How to Create a Link to Jump to a Specific Part of a Page - Step by Step Instructions

First, let me define "page jump link".  If you wish to have a link to a section or paragraph in an article, you can create a page jump link that can be inserted anywhere in an article.  You can even use jump links to "jump" to a section in another article on a website.  Or use one to jump to an article section on a totally different website that you manage by simply using the link to the jump link itself.  

Like this: 

Skip to End

I used page jump links at the top of our Review This Site Directory so visitors could quickly skip to the category of articles they wish to see. I've had several fellow bloggers ask me how I created those indexing page jumps and I happily shared my code.  However, it is easier for me to simply publish this article then to continue sharing the code individually each time it is requested.

 

FAST CLICK INDEX - Click the Category Title to Jump to Specific Section of Our Site Directory
BOOKS    CRAFTS    DECOR     ELECTRONICS     GARDENING    GIFTS    HOLIDAYS    MOVIES    MUSIC    PARTIES    PHOTOGRAPHY    PRODUCTS    RECIPES    SITE REVIEWS    SPORTS    TIPS FOR WRITERS    TOYS    TRAVEL    WEDDING    SPECIAL TRIBUTES        ABOUT THE CONTRIBUTORS    ARCHIVES    

ONE VERY IMPORTANT NOTE: THIS CODE MUST ALWAYS BE ADDED OR CORRECTED ON THE HTML, NOT COMPOSE, OPTION WHEN WRITING ON BLOGGER.

If you ever use Compose on an article on Blogger where you use the jump skips, your jump link code will be lost. As an example, if I ever wish to add anything to this article, I will have to do so in the html tab. Should it open to compose, click the html tab and close the article immediately without making or saving any changes. Keep opening it until it opens in the html. Never update or save an article that has page jumps while working under the compose tab.

HTML Code to add Jump Links

I'm showing the actual html code that you would need to create a jump link.  This is the code I used in this article to skip to the end.

This code should go at the top, or section where you want to place the option to jump to another section.  Replace the title text with your own descriptive text.

<a href="#the_end_HERE">Skip to End</a> 

And this code should go at the beginning of the section you wish to skip to.

<a id="the_end_HERE">The End!</a>

The id link text must be exactly the same in both links.  As you can see, the visual title text can be different.

Easy Jump Links

Adding page jump links to an article is actually very easy if you are careful and remember to stay in the html tab area on Blogger. I do recommend keeping a copy of your original article html text on a file saved to your computer. Accidents happen, especially if we get in a hurry and need to make a quick change or update an article.

This html jump link code also works on Wordpress!

Happy Blogging & Jumping!

        

 
 

How to Create a Link to Jump to a Specific Part of a Page - Step by Step Instructions Written by:

The End!

Note: The author may receive a commission from purchases made using links found in this article. “As an Amazon Associate, Ebay (EPN) and/or Esty (Awin) Affiliate, I (we) earn from qualifying purchases.”

FOLLOW US ON: