はてなブログの大見出しをh3からh2へ自動的に書き換えるカスタマイズ - イケメン息子とぐうたら猫の成長見守りブログ

皆様、こんにちは。

この話題については既に議論は行われている内容となりますが、補足事項などがありますので改めてまとめさせていただきました。

はてなブログでブログを書いている方向けのエントリーとなります。

はてなブログの大見出しh3問題
jQueryで動的に書き換える方法
留意事項
SEO効果について
まとめ

はてなブログの大見出しh3問題

はてなブログで大見出しを選択するとHTMLのタグとしては<h3>が挿入され、それがSEO的にも悪い影響を及ぼしているのでは？という問題があります。

このあたりの議論については既に他の方が多数解説していただいていますので貼っておきます。

hatena.aaafrog.com

www.pojihiguma.com

一応、わかりやすく画像で示すとこんな感じです。

f:id:kanchi_guy_nice_guy:20160812231244j:plain

各エントリーにおいてはタイトルがh1、そして見出しがh3から始まるため、h2がなく歯抜けになってしまっているということが問題視されています。

ちなみに私の見解を述べておきますと、SEOがどうとか言うより、単に「気持ち悪い」です。だって抜けているんだもの。

jQueryで動的に書き換える方法

そして動的な変換方法も既に他の方が公開されています。丁寧に解説されていますので、コードの貼り付け場所等が不明な場合はこちらをご覧ください。
※本エントリー内では割愛させていただきます。

dokuwohaku.hateblo.jp

こちらのものを少し応用（1行足しただけ）したものが以下のコードです。
※2016/09/08追記 classとid対応に改良しました。

<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$(function(){
    if (!document.querySelector('.entry-content h2')){
        $('.entry-content h3').replaceWith(function() {
            var tag_class_h3 = $(this).attr("class");
            var tag_id_h3 = $(this).attr("id");
            
            if ( tag_class_h3 == null) {
                var tag_class_plus_h3 =[];
            } else {
                var tag_class_plus_h3 = 'class="'+tag_class_h3+'"';
            }
            if ( tag_id_h3 == null ) {
                var tag_id_plus_h3 =[];
            } else {
                var tag_id_plus_h3 = 'id="'+tag_id_h3+'"';
            }
            $(this).replaceWith('<h2 '+tag_id_plus_h3+'  '+tag_class_plus_h3+'>'+$(this).html()+'</h2>');
        });
        $('.entry-content h4').replaceWith(function() {
            var tag_class_h4 = $(this).attr("class");
            var tag_id_h4 = $(this).attr("id");
            
            if ( tag_class_h4 == null) {
                var tag_class_plus_h4 =[];
            } else {
                var tag_class_plus_h4 = 'class="'+tag_class_h4+'"';
            }
            if ( tag_id_h4 == null ) {
                var tag_id_plus_h4 =[];
            } else {
                var tag_id_plus_h4 = 'id="'+tag_id_h4+'"';
            }
            $(this).replaceWith('<h3 '+tag_id_plus_h4+'  '+tag_class_plus_h4+'>'+$(this).html()+'</h3>');
        });
        $('.entry-content h5').replaceWith(function() {
            var tag_class_h5 = $(this).attr("class");
            var tag_id_h5 = $(this).attr("id");
            
            if ( tag_class_h5 == null) {
                var tag_class_plus_h5 =[];
            } else {
                var tag_class_plus_h5 = 'class="'+tag_class_h5+'"';
            }
            if ( tag_id_h5 == null ) {
                var tag_id_plus_h5 =[];
            } else {
                var tag_id_plus_h5 = 'id="'+tag_id_h5+'"';
            }
            $(this).replaceWith('<h4 '+tag_id_plus_h5+'  '+tag_class_plus_h5+'>'+$(this).html()+'</h4>');
        });
    }
});
</script>