ずっと前からやりたかったこのカスタマイズ。
ハードルが高いと思い後回しにしてきましたが、最終的にはシンプルにできました。
参考にさせて頂いたURL
↓
http://blog1.erp2py.com/2011/04/blogger-auto-read-more-for-blogger.html
やり方
上記ブログに書かれている通りに、CSSとHTMLを更新するだけです。
注意点としては、<data:post.body/>が2か所あったので、上手くいかない場合は違う箇所に試してみることです。
最初に見つけた、<data:post.body/>の箇所で、書かれた通りに更新してみたのですが、ブログに反映されず。
BloggerのHTMLは、WEB上では上手く次を検索できないので、一旦、Ctl+Aで全選択してテキストエディタにコピペ。
その上でキーワード検索をして、見つけた新たな箇所の近くのキーワードで、再度Webソースを検索。
そこに指定された方法でコピペすると、上手くいきました。
（ここまで他の方法も探したので数時間かかった・・・）
サムネイル画像サイズをカスタマイズ
CSSで画像サイズを変更してみました。
サイズ指定部分を追加して画像を大きくしました。
本当は、200pxくらいがいいなと思ったのですが、文章の長さ調整ができないので、あまり画像を大きくするとバランスが悪くなってしまい、断念。
結局、バランスの悪さがギリギリ我慢できる、130pxにしました。
.thumb img { float: left; margin: 0 10px 10px 0; height: 130px; width: 130px; }
更にカスタマイズ
ただ一覧だけのページだとまとまりがない感じがしたので、一覧の先頭に一言加えたいな、と試行錯誤。
HTMLソースが完全に読めないながらも、divが枠組みだという基本的なイメージだけで、色々な箇所に文字を挿入して適当な箇所を探しました。
HEADの前に挿入したら、本当に一番上に表示されてしまって焦った(笑)
で、判明した場所がこちら
↓↓↓
<div class='column-center-inner'>の直後、
・・・・
<b:section class='main' id='main' name='Main' showaddelement='no'>の前。
最初は改行ない箇所だったので、見逃しそうでしたが粘り勝ち。
ここに、
<div class='column-center-inner'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<h4> ホームの記事一覧を 「続きを読む」 的にカスタマイズしました。</h4>
</b:if>
と、追加。
これ、色々と使えそうです。