bloggerの「続きを読む」リンクを該当ページの冒頭にする+文字を変更

2017年9月24日

web/computer

bloggerを使っていて「ウザい」と思ったのは、「続きを読む」機能が本当に記事の途中からになってしまうこと。
そりゃまあ、「続きを」読むボタンだから間違ってはいないけど、チラ見して全部読みたいと思った際には、じっくり読み込んでいる訳ではないから「続きの前」の部分を読み返すことを含めて「全文を読みたい」と思うのではないか、と。
そこで、

  1. 続きを読むを全文を読むに
  2. 記事の冒頭から開くように

のカスタマイズをすることにし、色々と調べてみました。

まずは管理画面で「テーマ」→「HTMLの編集」、開いたHTMLのソース内のどこかをクリック(ブラウザ全体ではなく、inline frameとなっている「bloggerのHTMLソース部分」から検索するため)してcommand+F。
ちゃんとHTMLソース部分を選択してからだと、上図のようにブラウザ画面ではなくHTMLソースになっているフレーム内に検索窓が出ます。

ここに、 data:post.hasJumpLink を入れてreturn。
多分1500行目以降あたりに跳ぶと思います。(テンプレートによって違います)
以下のようなコードを発見。
<b:if cond='data:post.hasJumpLink'>
  <div class='jump-link'>
    <a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
  </div>
</b:if>
そしたら、 下図のように変更。
要するに、
 + &quot;#more&quot;'
これが勝手にリンクに「#more」というページ内アンカーリンクをつけている訳で、これを消してしまえば単なる「****.html」へのリンクと同じになるんですね。
で、<data:post.jumpText/>が「続きを読む>>」になっているので、これを表示させたい文字列に変更すれば良いだけ。
<b:if cond='data:post.hasJumpLink'>
  <div class='jump-link'>
    <a expr:href='data:post.url' expr:title='data:post.title'>全文を読む</a>
  </div>
</b:if>
つまりこうなります。

あー、すっきりした。