WordPress「function.php」の便利なカスタマイズ６選

WordPressのサイト制作をするときに必要のない機能や追加したい機能があるとき便利なPHPファイル「function.php」
今回はそのfunction.phpのカスタマイズで必ず入れている必須のカスタマイズについて追加する機能３個、取り除く機能３個、計６個をご紹介します。

目次

function.phpについて

function.phpとは、WordPress機能の拡張、変更をできるWordPressのテーマ内に置くPHPファイルです。
ここに各種プログラムを記述し、カスタマイズすることでデフォルトのWordPressに実装されている必要のない機能の削除、足りない機能の追加が可能になります。

追加する機能

①function.phpの別ファイル読み込み

何もいじる必要のない方は必要ありませんが今から機能を追加していきたい方は必須だと思います。
機能を追加するのに全てをfunction.phpに書いていくといつの間にか膨大な量になり管理するのが困難になります。下記のコードを入れて別ファイルで読み込めば管理が楽になり、更新等でエラーが出た際もエラーを特定する助けになります。

foreach(glob(TEMPLATEPATH."/functions/*.php") as $file){
	require_once $file;
}

使用中のテーマ内にfunctionフォルダを作り、上記のコードをfunction.phpに書き込むことで下準備完了です。
/functionフォルダ内のファイルを自動で読み込んでくれるのでthumbnail.phpとか名前をつけてそれにまつわるコードを書いておけば管理が楽になります。

②アナリティクスコードの指定

次はアナリティクスコードを読み込むコードです。
以前は直接headerに書き込んだり、function.php内に色々書き込み管理画面上で管理していましたが、管理上の理由から入力忘れ、入力初期化が起こりやすくなっていました。

度々アップデートを施すサイトには向かないと判断した為、今の書き方に落ち着きました。

Google Tag Manager用の記述

<?php 
function my_wp_head() {
	if(is_user_logged_in()) return;
	echo <<< EOF
	<!-- Google Tag Manager -->
	//ここにhead内に入れるタグ
	<!-- End Google Tag Manager -->
	EOF;
}
add_action('wp_head', 'my_wp_head', 0);

function my_wp_body_open() {
	if(is_user_logged_in()) return;
	echo <<< EOF
	<!-- Google Tag Manager (noscript) -->
	//ここにbody直後に入れるもの
	<!-- End Google Tag Manager (noscript) -->
	EOF;
}
add_action('wp_body_open', 'my_wp_body_open', 0);

アナリティクス用の記述

<?php 
function my_wp_head() {
	if(is_user_logged_in()) return;
	echo <<< EOF
	<!-- Google tag (gtag.js) -->
	<script async src="https://www.googletagmanager.com/gtag/js?id=G-〇〇〇〇〇〇〇〇〇〇"></script>
	<script>
	window.dataLayer = window.dataLayer || [];
	function gtag(){dataLayer.push(arguments);}
	gtag('js', new Date());
	gtag('config', 'G-〇〇〇〇〇〇〇〇〇〇');
	gtag('config', 'UA-〇〇〇〇〇〇〇〇〇〇-1');
	</script>
	EOF;
}
add_action('wp_head', 'my_wp_head', 0);

③サムネイル追加

次はサムネイルを追加するコードです。
ワードプレスでは基本的に何種類かのサイズでサムネイルが出力されますが、制作するサイトのサイズ感とは合わないことが多いので別で出力することが多いです。

<?php
add_theme_support('post-thumbnails');

/* デフォルトのサムネイルを出力させない */
add_image_size('thumbnail', 0, 0);    /* サムネイル */
add_image_size('medium', 0, 0);       /* 中サイズ */
add_image_size('large', 0, 0);        /* 大サイズ */
add_image_size('medium_large', 0, 0); /* 縦横上限768サイズ */
add_image_size('1536x1536', 0, 0);    /* 縦横上限1536サイズ */
add_image_size('2048x2048', 0, 0);    /* 縦横上限2048サイズ */

/* サムネイルサイズを指定する */
add_image_size( 'pic_bg', 960, 0 );　//　追加分（トリミングなし）
add_image_size( 'user_icon', 100, 100, true ); //　追加分（トリミング有）

必要のない機能

①ヘッダー非表示設定

ヘッダーにはWordPressで自動で生成されるいらないタグが潜んでいます。アップデートで増えたり減ったりしているのでWordPressのバージョンが変わった際には改めてチェックしてみてください。

ここに関しては多岐に渡って色々消していますが絵文字は使わないから消そうみたいな感じでうまく対応してみてください！

// ヘッダーのgenerator非表示
remove_action('wp_head', 'wp_generator');

// 絵文字関連
remove_action('wp_head', 'print_emoji_detection_script', 7);
remove_action( 'admin_print_scripts', 'print_emoji_detection_script');
remove_action( 'wp_print_styles',     'print_emoji_styles');
remove_action( 'admin_print_styles',  'print_emoji_styles');
remove_action('wp_head', 'wp_shortlink_wp_head');
remove_action('wp_head', 'rsd_link');
remove_action('wp_head', 'wlwmanifest_link');
add_filter( 'emoji_svg_url', '__return_false' );

// Embed系削除
remove_action('wp_head','rest_output_link_wp_head');
remove_action('wp_head','wp_oembed_add_discovery_links');
remove_action('wp_head','wp_oembed_add_host_js');

// ファビコン非表示
function wp_favicon_delete(){
	exit;
}
add_action("do_faviconico", "wp_favicon_delete");

// コメントフィードを削除
remove_action('wp_head', 'feed_links', 2);
remove_action('wp_head', 'feed_links_extra', 3);
function comment_feed_remove() {
	if ( is_comment_feed() ) {
		remove_action('do_feed_rdf', 'do_feed_rdf');
		remove_action('do_feed_rss', 'do_feed_rss');
		remove_action('do_feed_rss2', 'do_feed_rss2');
		remove_action('do_feed_atom', 'do_feed_atom');
	}
}
add_action('parse_query', 'comment_feed_remove');

//　コメントフィードURLを削除
add_filter('feed_links_show_comments_feed', '__return_false');
//　記事ごとのコメントフィードURLを削除
add_filter('post_comments_feed_link','__return_false');

// css削除
add_action( 'wp_enqueue_scripts', 'remove_my_global_styles' );
function remove_my_global_styles() {
	wp_dequeue_style( 'global-styles' );
};
add_action( 'wp_enqueue_scripts', 'remove_classic_theme_style' );
function remove_classic_theme_style() {
	wp_dequeue_style( 'classic-theme-styles' );
}
add_action('after_setup_theme',function(){
	// SVGとグローバルスタイルを削除
	remove_action('wp_enqueue_scripts','wp_enqueue_global_styles');
	remove_action('wp_footer','wp_enqueue_global_styles',1);
	//　render_blockフィルターを削除
	remove_filter('render_block','wp_render_duotone_support');
	remove_filter('render_block','wp_restore_group_inner_container');
	remove_filter('render_block','wp_render_layout_support_flag');
});

②グーテンベルグブロックの設定

次はグーテンベルグのブロックの表示、非表示の設定になります。
グーテンベルグはブロックエディタと呼ばれる投稿を各ブロックに分けた単位で構成していくエディターです。参照：ホームページの運営をわかりやすく直感的に！WordPressのエディタ「グーテンベルク」

昔ながらのクラシックエディタとかなり変わっており、初めて使う方でもとっつきやすくなっている一方、機能がたくさんついています。
今回紹介するコードはそこを制御するコードとなっています。

WordPressのアップデートでわりと大きく変わる部分なのでアップデートをした際は記事の作成をしてみて不具合がないかチェックした方が良いかもしれません。

add_filter( 'allowed_block_types_all', function( $allowed_block_types, $block_editor_context ) {
  $allowed_block_types = [
    // 追加分
      'lazyblock/ruled-line',   // 罫線囲み（追加分）
      'lazyblock/hukidashi',   // ふきだし（追加分）

    // テキスト
      'core/paragraph',    // 段落
      'core/heading',      // 見出し
      'core/list',         // リスト
      'core/list-item',    // リスト
      // 引用'core/quote',        
      // コード'core/code',         
      'core/freeform',     // クラシック
      // 整形済み'core/preformatted', 
      // プルクオート'core/pullquote',    
      'core/table',        // テーブル
      // 詩'core/verse',        

    // メディア
      'core/image',      // 画像
      // ギャラリー'core/gallery',    
      // 音声'core/audio',      
      // カバー'core/cover',      
      // ファイル'core/file',       
      // メディアとテキスト'core/media-text', 
      'core/video',      // 動画

    // デザイン
      // ボタン'core/buttons',      
      // カラム'core/columns',      
      // グループ'core/group',        
      // 続き'core/more',         
      // ページ区切り'core/nextpage',     
      // 区切り'core/separator',    
      // スペーサー'core/spacer',       
      // サイトロゴ'core/site-logo',    
      // サイトのキャッチフレーズ'core/site-tagline', 
      // サイトのタイトル'core/site-title',   
      // アーカイブタイトル'core/query-title',  
      // 投稿カテゴリー, 投稿タグ'core/post-terms',   

    // ウィジェット
      'core/shortcode',       // ショートコード
      // アーカイブ'core/archives',        
      // カレンダー'core/calendar',        
      // カテゴリー'core/categories',      
      // カスタムHTML'core/html',            
      // 最新のコメント'core/latest-comments', 
      // 最新の投稿'core/latest-posts',    
      // 固定ページリスト'core/page-list',       
      // RSS'core/rss',             
      // ソーシャルアイコン'core/social-links',    
      // タグクラウド'core/tag-cloud',       
      // 検索'core/search',          

    // テーマ
      // クエリーループ, 投稿一覧'core/query',               
      // 投稿タイトル'core/post-title',          
      // 投稿コンテンツ'core/post-content',        
      // 投稿日'core/post-date',           
      // 投稿の抜粋'core/post-excerpt',        
      // 投稿のアイキャッチ画像'core/post-featured-image', 
      // ログイン/ログアウト'core/loginout',            

    // 埋め込み
      'core/embed',// 埋め込み 
  ];
  return $allowed_block_types;
}, 10, 2 );

使わないブロックに関しては// でコメントアウトしてみてください。
一番上にあるlazyblock/○○○の部分はlazyblockというカスタムブロックを追加するプラグインで追加したブロック用です。こちらの記事も見てみてください！参照：ホームページの更新をリッチな表現にするプラグイン「Lazy Blocks」

③パスワード保護記事を非表示

こちらはWordPressに最初からついているパスワード保護機能についての制御コードになります。
デフォルトのままだとパスワード付きで投稿した際に記事リストに出てきてしまいます。これじゃ記事タイトル見えてイマイチですよね

//パスワード保護記事を非表示
function custom_pre_get_posts($query) {
	if(is_singular() || is_admin()) {
		return;
	}
	$query->set('has_password', false);
}
add_action('pre_get_posts', 'custom_pre_get_posts');
//パスワード保護記事の場合パスワードフォームのみ表示
function custom_add_header() {
	if(post_password_required()) {
		echo '<meta charset="utf-8">';
		echo '<meta name="viewport" content="width=device-width, user-scalable=yes">';
		echo get_the_password_form();
		exit;
	}
}
add_action('get_header', 'custom_add_header');

まとめ

以上function.phpに必ず入れているコード６選でした！
まだまだ出来ることはたくさんありますが「必ずいれている」といった視点で絞り込んでみました。今回の記事の内容で仕組みや出来ることを少しでも理解していただけたら幸いです。

function.phpは重要なファイルをなっており、ひとつのミスでサイト全体が表示できなくなるといったことが起こりうるので取り扱いには十分ご注意ください。

ご相談・ご依頼