技術と経験で、価値のあるホームページ制作を。ホームページ制作を通じて、お客様に利益をもたらすことを追求します。

技術と経験で、価値のあるホームページ制作を。ホームページ制作を通じて、お客様に利益をもたらすことを追求します。

ブログ

名古屋のホームページ制作会社 花のや > 花のやブログ > 【コピペOK】WordPressのヘッダーをキレイにするコード
2017/06/12Wordpress

【コピペOK】WordPressのヘッダーをキレイにするコード

花岡です、TUBEが流れる季節になってきました。

WordPressのヘッダーって汚い

WordPressのヘッダーには必要なのか不要なのか、たくさんソースが書かれています。
SEOを意識する人からすると、ちょっとうんざりするくらいです。
例えばこんな感じですね。

<link rel='dns-prefetch' href='//ajax.googleapis.com' />
<link rel='dns-prefetch' href='//s.w.org' />
<link rel='https://api.w.org/' href='http://hogehoge.com/wp-json/' />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://hogehoge.com/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://hogehoge.com/wp-includes/wlwmanifest.xml" /> 
<meta name="generator" content="WordPress 4.5" />
<link rel="canonical" href="http://hogehoge.com/" />
<link rel='shortlink' href='http://wp.me/P11111' />
<!-- 絵文字 -->
<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:\/\/dosankocare.com\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.7.5"}};
!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>

本当に長くて汚いです。
これではサイトの読み込み時間にも影響がでそう。
絵文字のコードはインラインでCSSを書き足される始末です、絵文字を使わない運用の場合は速攻消しましょう。
ということで色々と試した結果下記のコードをfunction.phpの末尾にコピペで追加します。

// DNSプリフェッチ削除
add_filter( 'wp_calculate_image_srcset_meta', '__return_null' );
add_filter( 'wp_resource_hints', 'remove_dns_prefetch', 10, 2 );
function remove_dns_prefetch( $hints, $relation_type ) {
	if ( 'dns-prefetch' === $relation_type ) {
		return array_diff( wp_dependencies_unique_hosts(), $hints );
	}
	return $hints;
}
// head 内不要タグ削除
remove_action('wp_head','rest_output_link_wp_head'); //Embed除去
remove_action('wp_head','wp_oembed_add_discovery_links'); //Embed除去
remove_action('wp_head','wp_oembed_add_host_js'); //Embed除去
remove_action('wp_head','feed_links', 2); //feed除去
remove_action('wp_head','feed_links_extra', 3); //feed除去
remove_action('wp_head','rsd_link'); //RSD除去
remove_action('wp_head','wlwmanifest_link'); //Windows Live Writer
remove_action('wp_head','adjacent_posts_rel_link_wp_head'); //ページ先読み除去
remove_action('wp_head','wp_generator'); //WPバージョン除去
remove_action('wp_head','wp_shortlink_wp_head'); // 短縮URL除去

// 絵文字コード削除
remove_action('wp_head', 'print_emoji_detection_script', 7);
remove_action('wp_print_styles', 'print_emoji_styles');

これでかなりスッキリしたと思います。
削除したタグなどの意味については下記の参考サイトをご覧ください。

 

【参考サイト】
http://wp-setting.info/setting/remove_header_edituri_wlwmanifest.html

http://on-ze.com/archives/6018
http://moralhazard.jp/2010/12/26/6797/

キレイにはなったけど

今回はキレイにすることを重視したため、ホームページによっては必要なものも削除している可能性もあります。
特にSEOを意識する場合、prevとnextを消すのはよろしくありません。
そのあたりはコピペした後に調整していただければと思います。

いらないと思ったものが後々必要になったり、嫌いになって別れてみたものの、やっぱり好きだったり。
人生ってそういうもんかな、って思います。
こちらからは以上です。

書いた人:hanaoka

林業高校出身後、インテリア学科に進学して、土方監督からCADオペを経てWebディレクターになりました。
Webディレクターとして皆様のお悩みを解決します。Web制作とガジェットが好きです。特技は少年ジャンプを縦に裂くことです。

人気記事ランキング

株式会社 花のや
〒460-0011
愛知県名古屋市中区大須4-1-79 第2ハヤシビル 3F

花のやについて

お仕事のご依頼やご相談は、下記の電話番号
または、メールフォームよりお問い合わせください。
TEL.052-251-7090 / FAX.052-251-7092

お問い合わせ