wordpressのブログ記事を一部だけ表示して「続きを読む」とする方法~「moreタグ」編~

wordpressのブログ記事を一部表示にして「続きを読む」とする方法

ブログのトップページや記事一覧などで、記事の全文ではなく一部分だけを表示させる方法をご紹介します。

トップページや記事一覧などで、だらだら全文が表示されると、たくさんスクロールしなければ他にどんな記事があるのかわかりにくいですよね。

ブログ記事の一部だけを表示して、「続きを読む」というような形にすれば、あまりスクロールしなくても、他にどんな記事があるのか、わかりやすくなります。どんな記事があるのかがわかれやすくなれば、他の記事を読んでもらえる可能性も高くなります^^

「記事の一部だけを表示する方法」は複数ありますが、この記事では、「moreタグ」というものを使う方法をご紹介します。

私が知っている、もう一つの方法についても別記事にしました。 よかったら併せてご覧くださいね。
テーマを編集して、自動的に抜粋表示する方法

それぞれ一長一短があるので、あなたの希望に添った方法を選んでください。

 

「moreタグ」を入れて「続きを読む」とする

まずは、やり方を説明しますね。

はじめの全文表示された状態です。下の画像の『ここで「続きを読む」を入れる』と書いてある部分に、「続きを読む」を入れてみます。

MOREタグ-1

 

記事の投稿画面に移動します。ビジュアルモードで編集する場合。

①「続きを読む」としたいところにカーソルを持っていき、②「続きを読むタグを挿入」のボタンをクリック。

MOREタグ-2

 

テキストモードの場合は、②<more>というタグをクリックします。

MOREタグ-3

 

すると、「MORE」の印が入ります。

MOREタグ-4

 

テキストモードの場合は<!—more—>というのが入ります。

MOREタグ-7

 

この状態で、ブログのトップページを見てみると・・・

「moreタグ」を入れたところで、「続きを読む」が表示されるようになりました!

MOREタグ-5

はい、これでおしまいです。めっちゃ簡単ですね。

「続きを読むを挿入」ボタンを押す または 「more」をクリックすればいいだけです。

お次は、メリットとデメリットをお伝えしておきますね。

 

メリット

1.とにかく簡単

「続きを読むを挿入」ボタンを押すか、「more」をクリックすればいいだけなので、とにかく簡単に手っ取り早くできます。

2.自分の好きな位置に「続きを読む」を入れられる

キリの良いところで区切ったり、思わず「続きを読む」をクリックしたくなるような位置を狙って、「続きを読む」を挿入することができます。

 

デメリット

1.記事を投稿するたびにやらなければならない

毎回記事を投稿するときに「moreタグ」を挿入しなければいけないという手間がかかります。

まぁ、手間というほどでもないですけど。ただ、うっかり忘れると、全文表示されてしまいます。

2.「続きを読む」をクリックすると、「moreタグ」が一番上になる

「続きを読む」をクリックすると、「moreタグ」を入れたところが、パソコンやスマホの画面の一番上になって表示されます。イマイチ伝わりにくいかもしれないですけど、こんな感じ↓

MOREタグ-6

記事の一番はじめから読みたい場合は上にスクロールして戻らないといけないんです。

他の人はどうなのかわかりませんが、私は「続きを読む」をクリックする時点では、タイトルは見ていますが、内容は深く読んでません。なので、途中から表示されてしまうと、「あれれ?」となってしまうんですね。

私は「途中からしか表示されない」というのが嫌だったので、この「moreタグ」を使う方法ではなく、もう一方の方法を選びました。

これは、好みの問題かもしれませんね。。

 

まとめ

「moreタグ」を入れるだけで、簡単かつ好きな位置で「続きを読む」とすることができちゃいます。

簡単にできますが、デメリットもあることもお伝えしました。

もう一つの方法についてもよかったらご覧くださいね。
⇒ 「テーマを編集して、自動的に抜粋表示する方法

最後まで読んでいただきありがとうございました!

***

 

Comment

  1. ちえぞう より:

    まかろんさん。
    はじめまして、ちえぞうです。
    ランキングから来ました。
    とっても可愛いブログですね~。

    FMテンプレートも可愛いんですね。知りませんでした^^
    ちょっと発見でした。

    <more>タグの使い方。
    とても解りやすかったですね^^
    ワードプレス初心者さんには、きっと役立つと思います。

    応援して帰りますね^^

    • まかろん より:

      ちえぞうさん、はじめまして。
      ご訪問&コメントありがとうございます。

      ほめていただき、ありがとうございます(*^-^*)
      FMテンプレートの色を勝手に変えて使ってたりします。

      はじめの頃、
      どうやったら「続きを読む」ってできるのか
      悩んだので、記事にしてみました。

      どうもありがとうございました。

  2. きりと より:

    まかろんさん

    こんにちは、きりとです。

    ワードプレスの「続きを読む」って方法が
    昔は全く知らなかったので
    かなり探していた記憶があります。

    こういうわかりやすい記事があれば
    昔の僕みたいに知らない人は助かりますね。

    応援していきますね。

    • まかろん より:

      きりとさん、こんばんは。
      ご訪問&コメントありがとうございます。

      きりとさんも以前、
      続きを読むにする方法を探された経験があるのですね。

      私も、WordPressをはじめたときに随分悩んだので、
      誰かの役に立てばいいなと思って、
      今回記事にしてみました。

      けっこう、みんな悩むポイントだったりするのかもしれないですね。

      ありがとうございました。

  3. りつき より:

    まかろんさん

    はじめまして、りつきと申します
    ブログランキングからきました。

    私、ワードプレスの「つづきを読む」
    まさに今!ぶつかっていた壁でした。

    このブログにたどり着いた時に
    驚きました!

    参考にしてみたいと思います。
    ありがとうございました。

    これからも応援しています。

    • まかろん より:

      りつきさん、はじめまして。
      ご訪問&コメントありがとうございます。

      「続きを読む」ってどうすればいいのか、
      悩みますよね。

      実は私自身が、初期の頃にかなり悩んだので、
      記事にしてみたのですが、
      同じように悩む人が多いのかもしれませんね^^

      少しでも参考になればうれしいです。

      どうもありがとうございました。

コメント

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

まかろんのプロフィール



ハンドルネーム:まかろん
2児を子育て中の主婦兼アフィリエイターです。

このブログでは、知識も実績もゼロの初心者がアフィリエイトで稼ぐための情報をお伝えしていきます。
少しでもあなたのお役に立てたら幸いです。

詳しくはこちらから

ブログランキングに参加しています


人気ブログランキングへ
ポチっと応援クリックしてもらえるとうれしいです♪

当ブログで使用しているテンプレート

初心者でも、ブログの作成が簡単にできる工夫がいっぱいのテンプレート

詳しくはこちらから

アーカイブ

こちらのサイトの素材を使わせていただいてます

Re:vre