はてなブログProでトップページを「一覧表示」にできるようになった…けど

6月1日に、はてなブログProにおいて、トップページを「一覧表示」にできるようになりました。これまでもjavascriptでarchiveページに飛ばしている人がいましたが、それをやらないでも良くなったということです。

テーマをいじるために、これがどんなhtml構造になっているのか、確認してみました。

body

トップページ全文形式

<body class="page-index enable-top-editarea">

トップページ一覧形式

<body class="page-index enable-top-editarea page-archive">

記事一覧ページ

<body class="page-archive enable-top-editarea">

最後にpage-archiveクラスが付くんですね。最終的にこれで上書きされてしまい、また記事一覧ページと共通なので、けっこう考えないといかないかもしれません。

記事部分

ここのhtmlについては、記事一覧ページとまったく同じになります。

<section class="archive-entry autopagerize_page_element" data-uuid="***">
<div class="archive-entry-header">
<div class="date">
<a href="***" rel="nofollow">
<time datetime="***" title="***">日付</time>
</a>
</div>
<h1 class="entry-title">
<a class="entry-title-link" href="***">記事タイトル</a>
</h1>
</div>
<a href="***" class="entry-thumb-link">
<div class="entry-thumb" style="background-image: url('***');">
</div>
</a>
<div class="archive-entry-body">
<p class="entry-description">
本文概要
</p>
<span class="social-buttons">
<span class="star-container"></span>
<div class="hatena-star-metadata" style="display: none">
<a class="hatena-star-permalink" href="***">記事タイトル</a>
</div>
</span>
</div>
</section>

もっと変わってるのかと思ったけど、htmlが記事一覧ページと同じだとわかったので、bodyと合わせてこの2つさえ抑えておけば良さそう。

所感

トップページが一覧表示と言うか、本当に記事一覧表示をそのままトップページに持ってきた感じ。
あまりに多くの人が/archiveへjavascriptで飛ばすからそれをさせなくさせた、というイメージ。今までそれ使ってた人は全く違和感なく移行できそう。
あいかわらず表示されるサムネイルが、サムネ設定した画像の120×120で切り取った（短辺を120ピクセルに縮小）画像が生成される。これはちょっと小さい。たしかに現状の一覧表示ならコレくらいでいいんだけど、カスタマイズしてもっといろんな表示にするには小さい。
大きなサムネイルを取得するには、これまでと同じようにjavascriptで持ってくるしかないか？
本文表示は記事概要が表示されるので、そこにhtmlはない。画像もない。なのでZENO-TEALでやったような「記事最初の画像を表示位置移動させて…」というのは使えない。
ただ可能性は感じる
現状のテーマで普通にこの一覧表示にすると若干表示が乱れるおそれがある。ZENO-TEALの場合はカテゴリー表示が少し上に移動してしまいタイトルと被ってしまう。
修正は面倒。
でもZENO-TEALの場合、本文部分が変にhtmlつきで表示されてしまう人がいたので、うまく対応させてあげたほうが見た目良くなるかも。
続きを読むを入れないでもいい、というのも利点になるかもしれない。

こんなところかなぁ。