【はてなブログ】TOPページを自由自在にカスタマイズする方法。

このTOPページですが...

https://quietplace.hatenablog.com/

 これをどうやってるかです。

仕組み

これは実は1つの記事です。
タイトルや日付や記事上、記事下を消している感じです。

でもどうやってTOPに表示しているかというと...

こんな感じにしていますw

こうすると今後記事を投稿しても未来の時間に投稿していることになるので一番上にこの記事が表示されるようになります。

あと購読中のブログからもこの記事は表示されません。

9999-12-31 23:59に購読中のブログに表示されますw

あとTOPに表示される記事を1つにしないと駄目ですね..

他にはアーカイブページや最新記事の一番上に出てきてしまうので消します。

/* 月間アーカイブから9999年を消す */
.archive-module-year[data-year="9999"] {
 display: none;
}
/* アーカイブページから特定の記事を消す */
.archive-entry[data-uuid="26006613505316646"] {
 display: none;
}
/* 最新記事の一番目の要素を消す */
.recent-entries-item:first-child {
 display: none;
}

 UUIDはChromeの場合F12などで確認してください。

確かここ↓

 で肝心の記事のHTMLなんですが...

引用・参考

• 　はてなブログのトップページを固定して企業サイト風にする方法

• 　はてなブログのトップページをWordPressの固定フロントページっぽくし、ホームページとして活用する方法

• 　はてなブログでトップページの記事一覧から特定の記事を非表示にする

こちらの記事などを参考にするといいと思います。

あと「display: none;」使いすぎるとSEO的に悪いので考えたほうがよさそうです。