No results were found...

Holiday sale is here!Get 33% off any annual plan during the biggest sale of the year!  

How to use anchor links in landing pages and websites

Don't know which version of MailerLite you're using? Click here to find out!
Interested in the New MailerLite? Visit the New vs Classic comparison page.

An anchor link is a link that redirects the visitor of your landing page or website to another section of the same web page.

Anchor links come in handy if you have lots of content on your page and want to provide visitors with an easy way to navigate to certain parts of the page without having to scroll up and down looking for it.

  1. Navigate to Sites.

  2. Locate your landing page and click Edit to open the Drag & drop editor.

3. Then, locate the block that you wish to create an anchor link for. Each section will have a name that can be seen in the bottom right corner when you hover over it.

4. Scroll to the top of your landing page and add a Menu element to the page, or a Section that includes a Menu. Hover over it and click the Settings icon.

5. Choose the Menu item that you would like to link your anchor block to, and click the Edit pencil icon. 

6. In the dropdown menu, choose Anchor block.

7. Choose the block that you would like to link to, by selecting the block name.

8. Click Add to create the anchor link. Now when that menu item is clicked, it will automatically direct the reader to that specific block in the landing page

  1. Open your site in the editor.

  2. Drag the Anchor block from the sidebar and drop it onto your page. The Anchor block won’t be visible on your published site. It simply provides an (invisible) anchor to link to, so where you place your Anchor block will be the endpoint of your anchor link.

3. Click the Anchor block to select it and give it a name in the sidebar.

Note: When adding multiple anchor blocks, make sure to give them different names as you will need to be able to identify them in a dropdown menu later.

Now it’s time to provide a link to your anchor! You can use your header navigation, button blocks, and even image blocks as a link to your Anchor block.

We recommend using your header navigation. Keep in mind, this option is only available for Landing pages.

To enable header navigation (if it isn’t already enabled):

  1. Hover over your page header and click the pencil icon.

  2. In the sidebar, click the Settings tab.

  3. Under Header layout select any option that includes Navigation. For example: Logo / Navigation / CTA. This option will provide you with navigation links in your header that you can link to your anchor block(s).

To link your navigation links to your anchor block(s):

  1. Hover over your page header and click the pencil icon.

  2. In the sidebar, click the Content tab.

  3. Under Navigation, you will find the links that appear in your header navigation. Click the pencil icon to edit each link’s settings.

  4. In the Title field, add the title you want to give your link.

  5. In the Link field, click the dropdown menu to change the link type to Anchor.

  6. Select the Anchor block you want to direct that link to.

  7. Click Save changes.

You’ll first need to set up a blog on your MailerLite website. Follow the steps in this article to find out how to create a blog.

Anchor links allow readers to skip to the content that catches their eye. To add anchors to a blog:

  1. Navigate to the website editor and use the edit icon to open the blog page editor.

2. Click the + symbol in the blog editor and choose Anchor.

3. Name the anchor to make it easy to find in the next step

4. Add a table of contents, image, or button block.

5. In the block settings, open the Link drop-down menu and choose Anchor.

6. Select the anchor you want to link to. You can even use your header navigation as a link to your Anchor block!

That’s it! Your anchor links are now set up and ready to use.

An anchor link is a link that redirects the visitor of your landing page or website to another section of the same web page.

Anchor links come in handy if you have lots of content on your page and want to provide visitors with an easy way to navigate to certain parts of the page without having to scroll up and down looking for it.

  1. Open your site in the editor.

  2. Drag the Anchor block from the sidebar and drop it onto your page. The Anchor block won’t be visible on your published site. It simply provides an anchor to link to, so where you place your anchor block will be the endpoint of your anchor link.

  1. Click your Anchor block to select it and give it a name in the sidebar.

Note: When adding multiple anchor blocks, make sure to give them different names as you will need to be able to identify them in a dropdown menu later.

  1. Click Save.

Now it’s time to provide a link to your anchor! You can use your header navigation, button blocks, and even image blocks as a link to your anchor block. We recommend using your header navigation.

To enable header navigation (if it isn’t already enabled):

  1. Hover over your page header and click the pencil icon.

  1. In the sidebar click the Settings tab.

  1. Under Header layout select any option that includes Navigation. For example: Logo / Navigation / CTA. This option will provide you with navigation links in your header that you can link to your anchor block(s).

To link your navigation links to your anchor block(s):

  1. Hover over your page header and click the pencil icon.

  2. In the sidebar, click the Content tab.

  1. Under Navigation, you will find the links that appear in your header navigation. Click the pencil icon to edit each link’s settings.

  1. In the Title field, add the title you want to give your link.

  2. In the Link field, click the dropdown menu to change the link type to Anchor.

  1. Then select the Anchor block you want to direct that link to.

  1. Click Save changes.

That’s it! Your anchor links are now set up and ready to use.

Last time edited: Jul 28, 2023