はてなブログのトップページを固定ページ化する方法その2

以前↓こういう記事を書きました。
blog.minimal-green.com
9999年の記事に直接HTMLを書き、全文表示にする方法です。

過去記事のカスタマイズの問題点

これはこれでまあまあ使えるのですが、トップページを作るためにかなり無理をしていることも確かです。
「10000年になったらどうしよう！？」という問題も心配でした。（嘘です）
問題点としては

問題点
・トップページ用の記事が注目記事などに出てしまう。
・→最新記事一覧に現れないようdisplay:noneを使わなきゃいけない
・display:noneを多用するとSEO的に心配？

必要ならばdisplay:noneを使っても良いと思うんですが、本来あるべきものを非表示にしているのはSEO上よろしくないと聞きます。
参考:
seopack.jp

SEOに関しては私は専門ではないので、明言はできませんが、上記の過去記事のカスタマイズは使い方に注意してください。
上記のカスタマイズがユーザーにとって便利なブログならOKだと思います。（あまり更新がなくホームページのようなサイトの場合など）

jQueryでトップページの記事一覧の前にコンテンツを追加する

先月このブログのトップページ、その他のデザインをリニューアルしました。トップページをホームページっぽくしています。

色々考えた結果上記とは別の方法でトップページを固定ページ化させました。現在のこのブログのトップページのカスタマイズ方法についてご紹介します。

方法は簡単です。jQueryでトップページの#main-innerの前にトップページ用のHTMLを挿入しています。

トップページ追加用HTML&jQuery

以下のコードをはてなブログ管理画面→デザイン→カスタマイズ→フッタに入れて下さい。http://example.com/はご自分のブログURLに書き換えて下さい。

<!--toppage-add-->
<div class="toppage-add">
<!--ここにトップページ用のHTMLを書いてちょ-->
</div>
<!--jQueryを使用:既に読み込んでるときは不要-->
<script src="https://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script>
<script>
$(function(){
    // URLがトップページのとき実行
    if(location.href=='http://example.com/'){
        $('#main-inner').before($('.toppage-add'));
    }
    // トップページ以外
    else{
	$('.toppage-add').remove();
    }
});
</script>

トップページ用の追加コンテンツのHTMLは自由に書いて下さい。CSSもデザインCSSに追記してくださいね。
追加用のHTMLをどうすれば良いかわからない方は、このブログのトップページのHTMLとCSSはパクって使ってもらってもOKです。但しそのコードを改変なくそのまま記事に転載するのはNGです。改良してコードを紹介される分には構いません。

この方法もデメリットがありそうな気がしますがしばらくはこのブログデザインで行こうと思います。とりあえずPVが激減したとか検索流入が減ったということは無いようです。何かお知らせがありましたら、ここに追記します。
【追記】
トップページ判定のscriptの改良版をらいち(id:AzuLitchi)さんが書いてくれました。↑のコードだと管理画面のデザインプレビューにトップページのデザインが反映されないという欠陥がありました。以下のコードでは管理画面でもトップページのデザインが確認出来ます。

できました^^;
$(function(){
var TopUrl = $(location).attr('protocol') +'//'+ $(location).attr('host');
// URLがトップページのとき実行
if(location.href==TopUrl || location.href==TopUrl+'/preview/index_design'){
$('#main-inner').before($('.toppage-add'));
}

— 阿豆らいち@ヒミツ基地 (@AzuLitchi) 2017年11月8日

scriptを以下のコードに書き換えてみてください。

<script>
$(function(){
    var TopUrl = $(location).attr('protocol') +'//'+ $(location).attr('host');
  // URLがトップページのとき実行
    if(location.href==TopUrl +'/' || location.href==TopUrl+'/preview/index_design'){
        $('#main-inner').before($('.toppage-add'));
    }
  // トップページ以外
    else{
  $('.toppage-add').remove();
    }
  });
</script>