WordPressの関数「wp_head」はデフォルトでさまざまなコードを出力します。
オリジナルでテンプレートを開発する場合に、このコードが邪魔になることがほとんどです。しかし、wp_head自信を削除してしまうと、プラグインなどが正常に動作しなくなる危険性があります。
なぜなら、wp_headやwp_footerがあることを前提に開発されているプラグインが多くあり、動作に必要なコードを出力しているからです。
そこで、今回はfunctions.phpにアクションフックを記述して、不要なコードの出力を省く方法を調査します。
目次
実際に表示されるコードと削除方法
以下、各セクションにおいて、まずwp_headを読み込むとデフォルトで出力されるHTMLソースを提示します。
次に、そのソースを表示させないため、functions.phpに書き込むアクションフックを示します。
※順不同です。また、新しいバージョンでは表示されなくなっているものもあります。
フィードリンク
デフォルトで出力されるフィードのリンク情報を削除します。
<link rel="alternate" type="application/rss xml" title="CMS helog » フィード" href="http://cms.helog.jp/feed/" /> <link rel="alternate" type="application/rss xml" title="CMS helog » コメントフィード" href="http://cms.helog.jp/comments/feed/" />
remove_action('wp_head', 'feed_links', 2); remove_action('wp_head', 'feed_links_extra', 3);
デフォルトCSS
デフォルトで読み込まれるテーマのCSSを削除します。
<link rel='stylesheet' id='twentyfourteen-lato-css' href='//fonts.googleapis.com/css?family=Lato:300,400,700,900,300italic,400italic,700italic' type='text/css' media='all' /> <link rel='stylesheet' id='genericons-css' href='http://cms.helog.jp/wp-content/themes/twentyfourteen/genericons/genericons.css?ver=3.0.2' type='text/css' media='all' /> <link rel='stylesheet' id='twentyfourteen-style-css' href='http://cms.helog.jp/wp-content/themes/twentyfourteen/style.css?ver=3.9' type='text/css' media='all' /> <!--[if lt IE 9]> <link rel='stylesheet' id='twentyfourteen-ie-css' href='http://cms.helog.jp/wp-content/themes/twentyfourteen/css/ie.css?ver=20131205' type='text/css' media='all' /> <![endif]-->
remove_action('wp_head', 'wp_print_styles', 8);
デフォルトJavaScript
デフォルトで読み込まれるJavaScriptを削除します。
<script type='text/javascript' src='http://cms.helog.jp/wp-includes/js/jquery/jquery.js?ver=1.11.0'></script> <script type='text/javascript' src='http://cms.helog.jp/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>
remove_action('wp_head', 'wp_print_head_scripts', 9);
EditURI
「EditURI」情報を削除します
<link rel="EditURI" type="application/rsd xml" title="RSD" href="http://cms.helog.jp/xmlrpc.php?rsd" />
remove_action('wp_head', 'rsd_link');
wlwmanifest
「wlwmanifest」情報を削除します
<link rel="wlwmanifest" type="application/wlwmanifest xml" href="http://cms.helog.jp/wp-includes/wlwmanifest.xml" />
remove_action('wp_head', 'wlwmanifest_link');
WordPressのバージョン情報
WordPressのバージョン情報を削除します
<meta name="generator" content="WordPress 3.9" />
remove_action('wp_head', 'wp_generator');
前の記事、次の記事のリンク
記事ページに追加される、前の記事、次の記事へのリンク情報を削除します。
<link rel='prev' title='前の記事' href='http://cms.helog.jp/previous/' /> <link rel='next' title='次の記事' href='http://cms.helog.jp/next/' />
remove_action('wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0);
canonical
canonical情報を削除します。
<link rel="canonical" href="http://cms.helog.jp/xxxxx/" />
remove_action('wp_head', 'rel_canonical');
shortlink
shortlink情報を削除します。
<link rel='shortlink' href='http://cms.helog.jp/?p=1' />
remove_action('wp_head', 'wp_shortlink_wp_head', 10, 0);
絵文字
WordPress 4.2から絵文字が使えるようになったことで、絵文字用のスタイルとスクリプトが読み込まれます。
削除することで絵文字は使えなくなります。
<script type="text/javascript"> window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/2.2.1\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/2.2.1\/svg\/","svgExt":".svg","source":{"concatemoji":"http:\/\/cms.helog.jpt\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.7.3"}}; !function(a,b,c){function d(a){var b,c,d,e,f=String.fromCharCode;if(!k||!k.fillText)return!1;switch(k.clearRect(0,0,j.width,j.height),k.textBaseline="top",k.font="600 32px Arial",a){case"flag":return k.fillText(f(55356,56826,55356,56819),0,0),!(j.toDataURL().length<3e3)&&(k.clearRect(0,0,j.width,j.height),k.fillText(f(55356,57331,65039,8205,55356,57096),0,0),b=j.toDataURL(),k.clearRect(0,0,j.width,j.height),k.fillText(f(55356,57331,55356,57096),0,0),c=j.toDataURL(),b!==c);case"emoji4":return k.fillText(f(55357,56425,55356,57341,8205,55357,56507),0,0),d=j.toDataURL(),k.clearRect(0,0,j.width,j.height),k.fillText(f(55357,56425,55356,57341,55357,56507),0,0),e=j.toDataURL(),d!==e}return!1}function e(a){var c=b.createElement("script");c.src=a,c.defer=c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var f,g,h,i,j=b.createElement("canvas"),k=j.getContext&&j.getContext("2d");for(i=Array("flag","emoji4"),c.supports={everything:!0,everythingExceptFlag:!0},h=0;h<i.length;h++)c.supports[i[h]]=d(i[h]),c.supports.everything=c.supports.everything&&c.supports[i[h]],"flag"!==i[h]&&(c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&c.supports[i[h]]);c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&!c.supports.flag,c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.everything||(g=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",g,!1),a.addEventListener("load",g,!1)):(a.attachEvent("onload",g),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),f=c.source||{},f.concatemoji?e(f.concatemoji):f.wpemoji&&f.twemoji&&(e(f.twemoji),e(f.wpemoji)))}(window,document,window._wpemojiSettings); </script> <style type="text/css"> img.wp-smiley, img.emoji { display: inline !important; border: none !important; box-shadow: none !important; height: 1em !important; width: 1em !important; margin: 0 .07em !important; vertical-align: -0.1em !important; background: none !important; padding: 0 !important; } </style>
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');
Embed
WordPress 4.4から追加された「Embed」機能に関する出力ですが、必要ない場合に以下で出力を削除します。
<link rel='https://api.w.org/' href='http://cms.helog.jp/wp-json/' />
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');
DNS Prefetching
WordPress 4.6から追加された「DNS Prefetching」を削除します。
DNSプリフェッチは、外部ドメインのDNS名前解決を事前に強制させることで、サイトの表示速度をアップする技術のようです。
外部jsや画像などをほとんど読み込まない場合には必要ないでしょう。
<link rel='dns-prefetch' href='//s.w.org' />
remove_action('wp_head', 'wp_resource_hints', 2);
「最近のコメント」ウィジェット用スタイル
以下のような「最新のコメント」ウィジェット用のスタイルが出力されます。ウィジェットを使用してない場合は不要なので削除します。
<style type="text/css">.recentcomments a{display:inline !important;padding:0 !important;margin:0 !important;}</style>
function remove_wp_widget_recent_comments_style(){ global $wp_widget_factory; remove_action('wp_head', array( $wp_widget_factory->widgets['WP_Widget_Recent_Comments'], 'recent_comments_style' )); } add_action('widgets_init', 'remove_wp_widget_recent_comments_style');
Google検索結果スニペット
Googleの検索結果に表示されるスニペットを制御するタグです。
<meta name='robots' content='max-image-preview:large' />
remove_filter('wp_robots', 'wp_robots_max_image_preview_large');
Global Stylesのコード?
WordPress 5.9から、関数wp_body_open()より大量のsvg、cssコードが出力されるようになりました。
その機能についてよく理解できていませんが、とりあえず大量コードによるレスポンスへの影響が気になるので削除します。
remove_action('wp_enqueue_scripts', 'wp_enqueue_global_styles'); remove_action('wp_body_open', 'wp_global_styles_render_svg_filters');
まとめ
バージョンによって、その記述は若干変化しますが、WordPress 5.9.2時点でのwp headリセット設定を以下にまとめます。
remove_action('wp_head', 'wp_resource_hints', 2); 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', 'rest_output_link_wp_head'); remove_action('wp_head', 'wp_oembed_add_discovery_links'); remove_action('wp_head', 'wp_oembed_add_host_js'); remove_action('wp_head', 'feed_links', 2); remove_action('wp_head', 'feed_links_extra', 3); remove_action('wp_head', 'rsd_link'); remove_action('wp_head', 'wlwmanifest_link'); remove_action('wp_head', 'wp_generator'); remove_action('wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0); remove_action('wp_head', 'rel_canonical'); remove_action('wp_head', 'wp_shortlink_wp_head', 10, 0); remove_filter('wp_robots', 'wp_robots_max_image_preview_large'); remove_action('wp_enqueue_scripts', 'wp_enqueue_global_styles'); remove_action('wp_body_open', 'wp_global_styles_render_svg_filters'); function remove_wp_widget_recent_comments_style(){ global $wp_widget_factory; remove_action('wp_head', array( $wp_widget_factory->widgets['WP_Widget_Recent_Comments'], 'recent_comments_style' )); } add_action('widgets_init', 'remove_wp_widget_recent_comments_style');
この記事はWordPressのバージョンアップに伴い、必要に応じてその都度更新していきたいと思います。
同様にフッタ部分に出力する「wp_footer」があるのですが、デフォルトでは特に無駄なコードは出力していないようです。
ログイン後に管理バーを表示したり、他のプラグインがコードを出力したり、フックを使って自身で解析コードなどを出力させたりなどの活用法があるので、関数は残しておいたほうがよいでしょう。
コメントする