How to Add "Read More" Jump Breaks in HTML

by Marina Martin

Many blog posts begin with an introduction of a few paragraphs, followed by a "read more" link. This initial excerpt is sometimes used elsewhere, such as on the blog homepage where an entire article would be too long to fit. Clicking "read more" moves you further down the page to read the remainder of the article, which is known as "after the jump." You can create a "read more" link with an HTML anchor tag.

1

Open an editable version of the HTML code or page in which you want to insert a "read more" link. Consult your webmaster if you are not sure how to edit your website's HTML source code.

2

Type the following code in the place you want your reader to go after they click the "read more" link:

<a name="afterthejump">&nbsp;</a>

Replace "afterthejump" with any keyword you want. Keep the quotation marks intact and do not use spaces or special characters. This keyword is only visible in the HTML code itself, not on the Web page.

3

Type the following code in the place you want the "read more" link to appear:

<a href="#afterthejump">read more</a>

4

Save or publish your HTML page.

Tip

  • check " " creates a single blank space. You can replace this blank space with any words of your choosing, such as a header tag or a full sentence.