moreタグの動作をカスタマイズする方法｜Blogger

Atom | RSS

このサイトを検索 | Search this site

Blogger,エラー対策

※この記事は「Awesome Inc. テンプレート」を対象にしています。
※2021年11月現在、SuperFast テンプレートを使用しています。

Bloggerのメインページを表示すると記事が要約付きでリスト表示されます。(トップページともいう)

この記事は、メインページの「本文を読む」（デフォルト表示：「続きを読む」）をクリックした時の動作を変更する方法について書いています。

「続きを読む」はBloggerのHTMLコードに <!--more-->が存在する時に、挿入される文字列です。

moreの動作

「続きを読む」をクリックした時の動作
修正前	moreタグ以降に記述された本文を表示する
修正後	本文を最初から表示する

<!--more--> タグの動作

※2018年6月時点の情報です

Blogger > レイアウト > メイン > 編集 > ブログの投稿の設定 > メインページのオプション

<!--more--> の動作は「メインページのオプション」から変更することができます。

（スナップショット）
※「本文を全て表示する」に変更しています。

記事作成中にHTMLモードに変えて、任意の場所に <!--more--> を挿入すると、メインページを表示した時に <!--more--> タグ以降に記述されたコードの読み込みが中断され、「本文を読む（デフォルト表示：「続きを読む」）」と表示されます。

「本文を読む」をクリックすると投稿記事に遷移して、moreタグ以降に記述された本文が表示されます。

本文の途中から表示されると読みにくいので、投稿記事が最初から表示されるようにテンプレートを修正します。

手順

Blogger > テーマ > HTMLの編集

テンプレート編集画面を表示させて以下の操作を実行します。

1. class='jump-link' を検索する
2. + &quot;#more&quot; を削除する
3. テーマを保存する

<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>

まとめ

1. more の動作は変更することができる
2. 「続きを読む」の文字は任意の文字に変更することができる
3. more をクリックした時に本文を最初から表示するにはテンプレートを修正する
4. 具体的には、「+ &quot;#more&quot;」を削除する

テンプレートを修正する時は、バックアップを取ってから行いましょう。

SC2

ブログサークルSNS
クリックして応援してね！

このサイトを検索 | Search this site