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

このサイトを検索 | 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>

quote削除

まとめ

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

テンプレートを修正する時は、バックアップを取ってから行いましょう。
SC2
Windowsランキング 将棋ランキング スマホ・携帯ランキング にほんブログ村 IT技術ブログ ライフハックへ にほんブログ村 その他趣味ブログ 将棋へ

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

コメントを投稿

0 コメント