WordPressのMoreブロックを使用すると、投稿の魅力的なプレビューを作成することができます。この機能は訪問者の注意を引き、投稿の全文を読むように促します。
例えば、WPBeginnerでは、読者を完全なブログ投稿に誘導するために「続きを読む」リンクを使用しています。
良いニュースは、WordPressはアーカイブやホームページに投稿プレビューを表示する複数の方法を提供し、あなたが同じことを行うことを有効化していることです!
この投稿では、WordPressのMoreブロックを使用する手順を説明します。また、テーマがMoreブロックをサポートしていない場合の抜粋の作成についても説明します。
WordPressでMoreブロックを使うタイミング
多くのサイトが投稿プレビューを使い、訪問者にフルバージョンをチェックするよう促している。
WordPressユーザーとして、いくつかの異なる方法で投稿プレビューを作成することができます。例えば、WordPressのアコーディオン・プラグインを使ったり、トグル効果を使ってコンテンツを表示したり非表示にしたりすることができます。
初期設定では、ほとんどの最新のWordPressテーマは、投稿の全文ではなく、投稿のプレビューをホームページとブログアーカイブに自動的に表示します。
例えば、私たちのブログのページには、投稿の中のいくつかの単語と、記事全体への「続きを読む」リンクが表示されます。
このプレビューテキストは、訪問者がすべての投稿をスクロールすることなく、あなたのブログのトピックを より多く見るのに役立ちます。また 、訪問者が投稿を読み終えるにはクリックする必要があるため、ページビューの増加にも 役立ちます。
WordPressがこれらのプレビューに表示する内容は、Moreブロックまたは抜粋を使用することで正確にコントロールできます。
あなたのサイトに最適な選択は、WordPressテーマによって異なります。 テーマによっては、作成したMoreブロックを無視するものもありますので、抜粋を代わりに使用する必要があります。
どのテーマを使っていても、魅力的なプレビューを表示できるように、Moreブロックと抜粋の両方を取り上げます。 特定の方法に直接ジャンプしたい場合は、以下のリンクをご利用ください:
準備はいいかい?始めよう
WordPressのMoreブロックの正しい使い方
WordPressのブロックエディターには、WordPress投稿のプレビューテキストの 正確なカットオフポイントを 指定できるMoreブロックがビルトインされています。
クラシックエディターでは、このブロックは以前はMoreタグとして知られていた。
文の途中や段落の途中など、投稿のどこにでもMoreブロックを追加できます。
Moreブロックの上のコンテンツはすべて、ブログのアーカイブページやWordPressサイト上の投稿一覧のどこにでも表示されます。WordPressはまた、プレビューに「続きを読む」リンクを追加し、訪問者がクリックして投稿のフルバージョンを読むことができるようにします。
注: WordPressテーマはそれぞれ異なり、初期設定の「続きを読む」ラベルを上書きするものもあります。そのため、「続きを読む」ボタンに異なるテキストが表示される場合があります。
投稿にMoreブロックを追加する前に、サイトがトップページに最新の投稿を表示するように設定されているか確認することが重要です。
カスタムホームページとして静的ページを使用している場合、テーマはMoreブロックを無視し、代わりに独自の設定を使用することができます。
静的なフロントページをホームページとして使用しているかどうか、本当に〜してもよいですか?WordPressダッシュボードの設定 ” 読む で確認できます。
この画面の上部に「Your homepage displays(あなたのホームページの表示)」という項目があります。最新の投稿」が選択されていれば、Moreブロックの使用は問題ありません。
まずは、ブロックを追加したい投稿を開いてください。次に、プレビューのカットオフポイントを作りたい場所を見つけて、「+」アイコンをクリックして新規ブロックを追加します。
その後、「More」とタイプし、適切なブロックを選択してページに追加することができる。
テーマによっては、ホームページやアーカイブページに表示する文字数に制限があるものもあります。
プレビューに多くの単語を含めると、テーマがMoreブロックを上書きする可能性があります。そのため、投稿の早い段階でカットオフポイントを作成することをお勧めします。
あとは通常通り投稿を続けてください。
ブロックエディターで投稿を編集しているときにはMoreブロックが表示されますが、WordPressブログで投稿日を読んでいるときには表示されません。
他のブロックと同様に、WordPressにはMoreブロックを設定するためのいくつかの設定があります。これらの設定を見るには、Moreブロックをクリックして選択してください。
右側のメニューで、現在見ているページであるフルコンテンツページの抜粋を非表示にするか表示するかを選択できるようになりました。
初期設定では、以下の画像にあるように、Moreブロックより上のコンテンツはすべてフルコンテンツページに表示される:
しかし、投稿日自体ではなく、ホームページとアーカイブページにのみ表示されるカスタマイザーを書きたい場合もあるでしょう。
これを行うには、「抜粋を非表示にする…」スライダーをクリックして、白から青に変えるだけです。
これで、Moreブロックより上はアーカイブページとホームページにのみ表示されるようになった。
更新が終わったら、「更新」または「公開する」ボタンをクリックして変更を保存します。
これで、ホームページやブログのアーカイブページにアクセスすると、この投稿用に作成したプレビューが表示されます。
何か違うものが見えますか?
WordPressテーマがMoreブロックを無視している可能性があります。
テーマによっては抜粋を表示するように設計されており、Moreブロックをすべて上書きします。ホームページやブログアーカイブにMoreブロックで作成したプレビューが表示されない場合は、抜粋を使用する必要があります。
モアブロックの「続きを読む」テキストを変更する方法
初期設定では、MoreブロックはあなたのアーカイブとホームページにRead Moreリンクを表示します。
このテキストを変更する方法はいくつかありますが、WordPressのテーマによっては若干異なる結果になる場合があります。テーマによっては、あなたの変更を初期設定で上書きしてしまうものもあります。
まずはじめに、WordPressの投稿エディターを使って「続きを読む」のテキストを変更できるかどうか確認してみましょう。
これを行うには、Moreブロックがある投稿を開くだけです。初期設定の「READ MORE」テキストをクリックし、代わりに使用したいテキストを入力することができます。
その後、通常通りページを更新するか公開する。その後、ホームページやブログのアーカイブにアクセスして、「続きを読む」のテキストが変更されたかどうかを確認することができます。
元の「続きを読む」リンクがまだ表示されている場合は、コードを使ってテーマの設定を上書きする必要があるかもしれません。
サイト固有のプラグインを作成するか、WPCodeのようなコード・スニペット・プラグイン(推奨)を使用して、以下のコードをサイトに追加することができます:
function modify_read_more_link() {
return '<a class="more-link" href="' . get_permalink() . '">Check out the full post</a>';
}
add_filter( 'the_content_more_link', 'modify_read_more_link', 999 );
これにより、初期設定の「続きを読む」テキストは、以下の画像にあるように「投稿の全文を見る」に置き換わる。
コード・スニペット内の「投稿の全文をチェックする」を置き換えれば、好きなテキストを使うことができる。
WordPressでの抜粋の正しい使い方
WordPressには投稿プレビューを表示する2つの異なる方法があります。Moreブロックについてはすでに説明しましたが、抜粋を使ってプレビューを作成することもできます。
WordPressブログやサイトへの訪問者のために、プレビューは抜粋を使用して作成され、Moreブロックはまったく同じように見えます。しかし、テーマによっては抜粋を使用するようにコーディングされているものもあり、その場合、Moreブロックは無視され、代わりに抜粋が表示されます。
投稿に抜粋を手動で追加しない場合、WordPressはテーマによって定義された抜粋の長さに基づいて自動的に抜粋を作成します。このため、プレビューが文章の途中で切れてしまうことがあります。
そのことを念頭に置いて、代わりに手動で抜粋を作成することを選択することができます。これを行うには、単に投稿を開き、右側のメニューで’抜粋’セクションを展開するためにクリックします。
Write an excerpt(抜粋を書く)」ボックスで、投稿に使用したい抜粋をタイプ入力するか、ペーストします。
右側のメニューに「抜粋」ボックスが表示されていませんか?その場合は、右上の3点アイコンをクリックして、この設定を有効化することができます。
それが済んだら、『環境設定』をクリックしよう。
表示されるポップアップで、「パネル」をクリックするだけです。
右側のメニューに追加できる設定がすべて表示されます。抜粋」を見つけてクリックすると、白(無効化)から青(有効化)に変わります。
そして、このポップアップを閉じます。これで、右側のメニューから「抜粋」の設定にアクセスできるはずです。
さて、上記と同じプロセスで抜粋を作成することができます。
それができたら、変更を保存してサイトにアクセスしてください。カスタム抜粋がホームページとブログアーカイブに表示されます。
この投稿がWordPressのMoreタグの正しい使い方を学ぶのにお役に立てば幸いです。また、WordPressの投稿にマルチカラムのコンテンツを追加する方法や、WordPressの投稿やページにHTML必須でテーブルを追加する方法についてのガイドもご覧ください。
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Moinuddin Waheed
I have seen many blogs and websites which have static home page and then many blog posts on some sections of the home page itself with more blog in the second line.
That is very good to have a static page as well as the blog posts on the same home page and when clicked it directs to the particular blog posts.
Is there a way to add blog posts on home page itself like in a section?
WPBeginner Support
It would depend on how your theme has the homepage set up but if you have a static home page you could add the posts via a block to the page.
管理者
Andy Manshel
This tutorial says nothing about how to do this in the “Block” editing system.
WPBeginner Support
The article was last updated in 2015, we will look into updating it when able. For the block editor, you would use the more block
管理者
Karis Seans
How do I do this on my blog now? I can’t even find the more tag you are talking about.
WPBeginner Support
This article was created before the block editor was added, to do this now you would add the more block to your post
管理者
Famous
Please how will l know if my theme supports More Tag or excerpt?
WPBeginner Support
If the plugin does not mention it in the documentation then the simplest method would be to test it to see if the read more works properly
管理者
Tracy
I am wondering if I am able to change the wording in the read more tag. Like if I wanted it to say. Click to carry on reading?
Thomas Conrad
What is the equivalent way to do this on pages instead of posts?
Thank you
Susie
You never explain what to do after you insert the “read more” tag. Nothing happens on my wp page when I insert the tag in the middle of a content box. I mean, is it supposed to automatically hide the rest of the text? You just tell us to insert the tag and that is that.
Pat
Hi,
I got the same problem, it’s not working when using More Tag in my post which appeared in my static page .
I tried to read those given blogs and explaination but it is really hard to understand it.
Could anyone help to give a tutorial or a detail example?
Thanks in advance!
Cyprus
Is there a way to use ‘More Tag’ not just for excerpt purposes, but to actually toggle hide/unhide specific paragraphs of your post unless tag/button is clicked or hovered by reader? If not, then, are there any other alternatives to apply a similar effect without using shortcodes/plug-ins or css (as I am using a simple Wordpress.com account)? If there REALLY is none, then I might be willing to explore other options but hopefully without having to pay anything…?
I would be grateful for some guidance. Thanks!
Peter Samuel
If I want to change the location of the ‘more tag’ how do I cancel a more tag break? I’ve tried a couple of times to simply delete it and it deletes not only the more tag but all the text above it. If I add a more tag in a new position the old more tag remains.
Is there any clean way of undoing a more tag?
Charlie Parker
Question: When the user clicks on the “continue reading” link, it goes to a spot in the blog where the link was. That is, it goes to a page using something like this:
http://example.com/how-to-have-a-great-day/#more-227
The “#more” parameter has “-227” after it indicating that the visual top of page should start at “position 227”.
But I want the visual top of the page to be the actual top of the page. If I manually change the URL to take off the “#more” parameter, then the actual top of the page is shown – which is what I want.
How do I make this happen automatically when I add the more tag in my post?
Thanks.
Maria
Hi! Can I change the “read more” text? How can I do that? I want to put it in Spanish. Thank you.
abhay
CAN ANY ONE TELL ME HOW TO ADD MORE READ IN POST , NOT PAGE OR HOME PAGE , LIKE SAME CONENT IN ANOHTER POST
Sam
I have seen the same information everywhere, yet nothing happens when I insert the more tag option. I receive the dotted line, but it does not hide the larger portions of my post thereby leaving me with a post too large on my homepage. I am looking for perhaps an HTML version so I can do it manually.
Alan Kelly
If you are using the text editor, then you can use the ‘more’ button in the toolbar or manually enter the more tag like this:
Rob
Sam,
I write blog posts on domain.com/blog/ subfolders. When I use the “more” tag, it doesn’t show up on the actual post itself. When I’m on the blog landing page and it shows all the blogs with a truncated entry with a clickable “more” button. Clicking this opens the full post.
Hope this helps.
Rusi
I’m not satisfied. It did not help me at all..
MAURINE
me neither…
Baz
All that has happened is that part of the Blog post has disappeared using More tag. Is it supposed to reappear somewhere?
Malcolm
Are either of these a good tactic for using SEO excerpts for a membership sites? ie if someone wants to read more, they would hit a firewall requiring them to join? (But the More or Excerpt content would be open for anyone to read?)
Chris
Hi,
your screenshot shows a “word count” in the excerpt area.
This seems to be not a standard, I don’t have this in my WP.
How have you made this please?
Thx.
fadhili
Thanks
And how do I edit that default ‘read more’ tag to my language?
cjt
You can use excerpts in yout theme as an intro to the post by adding the_excerpt (); tag anywhere in the html sheet.
You can use images in the excerpt by usin the img src tag. The only issue here is that they will not become responsive.
On the other hand, you can always use custom fields… and use excerpt, subtitle, etc. – all before the text for a more tag.