How To Add A Jump Link To Your Blog

By   McDonald, T.  | Date 30th of May 2020

While surfing the internet, you may have noticed that some sites have an index that lets you jump to different parts of the same webpage and thought 'That is cool!'  Well, this is how you do it.  I have used blogger to demonstrate how it is done, but the process will be very similar for most blogs.

What is a jump link

A jump link is a link that lets the user jump to certain pats of the same webpage they are viewing.

How to add the code

You will need to add a simple piece of code. Make sure you add it just before the code you want it to jump to.  Note, anchortext should have no spaces. The code is encapsulated in a span tag.  See below.

<span id="anchortext"></span> 

For example, if you want to jump to a header on the same page, you put the above code just before the <h1> tag in the HTML.

  1. Select the pencil icon in the menu bar at the top of blogger.
  2. Select HTML from the menu.
  3. Add the the span tag with the anchortext.

Select  HTML view

You will likely see an lot of HTML, so use the find option to locate the code you want to insert the span tag before.

How to add the link

  1. Open the webpage you are working on in a different window or tab and copy the url. Be sure it is in regular view mode. You can also get the url from the permalink in the side menu if using blogger.
  2. Select the text you want as the link.
  3. Select the link option in the menu at the top.
  4. Paste the url into the pop-up box and add a hashtag # to the end. Directly after the # add the anchortext. There should be no spaces. Generic formate URI#anchortext.
  5. Click apply and update.

Unfortunately, you can only test it once it is published.  Nevertheless, it does work.




Popular posts from this blog

How to install Linux Kali 2016.1 into Parallels and install Parallels tools.

How to play spectrum games on a Mac, Windows or even GNU/Linux.

Build A Test Website In 3 Easy Steps