If you have a long page, you may want to be able to link from what part of the page to another. Let's take a page from SNPT, built with SupaDupa, which has the following set of images at the top of the page:

This is created using a Grid Block, and then an Image block within the four cells of the grid. Say we then have a section on the page for each of the above categories, and we want it so that when the image is clicked, the page automatically moves to the corresponding section. Achieving this requires two parts:

  1. The Image (or text) needs to link to a word beginning with a hash:
    e.g #visual-shopping

  2. An element needs to exist on the page which has an ID matching this word, alebit without the hash e.g id="visual-shopping"

The first part is easy, you'll want to give your link the literal URL as: #visual-shopping or, in the case of an Image or Slide, specify it as the link:

For step two we want to give an ID to the text that we want to be scrolled to when the link or image is clicked. For this, place your cursor at the top left text of your block and click to edit the code for the text block as shown below:

From here, add the ID attribute to the first paragraph, and save your changes 👍

Did this answer your question?