一緒に悩み、考える。
つくるだけでなく、
そのあとの物語も、ともに。

どんな会社もサービスも、それぞれにストーリーがあります。
花のやはそれをサポートしながら、お客様の成長を隣で見ていたいのです。

一緒に悩み、考える。
つくるだけでなく、
そのあとの物語も、ともに。

どんな会社もサービスも、
それぞれにストーリーがあります。
花のやはそれをサポートしながら、
お客様の成長を隣で見ていたいのです。

ブログBLOG

  1. 名古屋のホームページ制作会社 花のや
  2. 花のやブログ
  3. 【コピペOK】WordPressのヘッダーをキレイにするコード
2017/06/12オープンソースWordPress

【コピペ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)&amp;amp;&amp;amp;(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&amp;amp;&amp;amp;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&amp;amp;&amp;amp;c.supports[i[h]],"flag"!==i[h]&amp;amp;&amp;amp;(c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&amp;amp;&amp;amp;c.supports[i[h]]);c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&amp;amp;&amp;amp;!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&amp;amp;&amp;amp;c.readyCallback()})),f=c.source||{},f.concatemoji?e(f.concatemoji):f.wpemoji&amp;amp;&amp;amp;f.twemoji&amp;amp;&amp;amp;(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

村生まれ村育ちWebディレクターです。 2014年に株式会社花のやを設立。以後ディレクションと営業を兼務しています。 学歴コンプレックスをバネに日夜戦っています。

LINEで送る
Pocket

人気記事ランキング

お問い合わせ

Webサイト制作・その他お仕事のご依頼、
ご相談についてお気軽にお問い合わせください。

  • ホームページ制作で”補助金・助成金”使えます!
  • WEBに関する無料個別相談会
株式会社 花のや
〒460-0008
愛知県名古屋市中区栄2-14-5 山本屋本店栄ビル7階

花のやについて

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

お問い合わせ