Split your post content with the Read More tag

You can truncate your blog entries so that only the first part of certain posts is displayed on the home and archive pages. When you do this, a link will be placed directly after your excerpt, pointing the reader to the full post.

You can find the More Tag button in the first row of the visual editor toolbar or by pressing Alt+Shift+T:

Formatting toolbar – More tag

Using the More tag

Go to Posts → Add New in your dashboard to create a new blog entry. Note: this does not work with Pages.

Begin writing your post. Insert the More tag to mark where the post will be split. You will see the More Tag indicator in the visual editor:

Visual Editor with the More tag

Publish the post and view the front page of your blog. You should see your post split with a link that says “Continue reading” or something similar.

Note: The more tag is not displayed in post previews, since previews display posts in entirety, but the more tag will appear once the post has been published.

Click on the link, and you will be taken to the post in its full form. The front page of your blog should display the post similar to:

Continue Reading / Read More

Custom Read More Message

But wait, there’s more!

You can further customize the message that displays in the link to the full post content.

You will need to do this in the Text view of your editor. In the Text editor, look for this code:

<!--more-->

To customize the message, add a space after <!--more, and turn it into something like this…

<!--more But wait, there's more!-->

Text editor – custom More text

The front page of your blog should now display your post like this:

Custom More text

Note: You will need to customize the message for each post. You cannot declare a global message that will take effect on each post of your blog that uses the More Tag.

Formatting Issues

If the More Tag is inserted after writing a post, formatting errors can occur. The issue occurs when you insert the More Tag using the visual editor, but it is actually placed within another HTML tag. As an example:

<strong>Oh man, this post is messed up.<!--more--></strong>

The above will cause the rest of the posts on your front page (or in an archive) to be formatted as bold, sometimes including your sidebar contents. Not cool. It can also make the sidebar fall to the bottom of the page. To fix the issue, just place the More Tag on the outside of any pesky closing HTML tags, like so:

<strong>Oh man, this post is messed up.</strong><!--more-->

Make sure to go into the HTML view of the problematic post and move your More Tag to outside of any HTML tags (this includes div, strong, em, etc…).

Note: Copying and pasting content from rich text editors such as Microsoft Word often causes problems because a lot of extra HTML is used that can interfere with the More tag. Consider using a plain text editor, such as Notepad, instead or use the Paste from Word button.