Usings Anchor on frontpage

Hi all,

As the front-page is getting quite big, I want to build a menu with custom anchorlinks to the different parts of the page.

I’ve tried using normale html: Useful Tips Section and linking to it using a href=#tips, but it doesn’t do anything.

Any tips?

I managed to solve it myself. It works if you add a text widget and fill in the html-code there. Using the editor to put the html directly on the page won’t work.

Another tip: If you put the html text above your section, there will be some white space between the line and the title of the section. I solved this by creating a 2 column row and using the first for the html (width = 0%) and the other side for the section content (width = 100%).

Hopefully this will help some others as well.

Can I please see a link to your website? I’m curious about that white space, maybe there is something that I need to fix. Thanks.

This is the page: http://sieradenmerkbeginnen.nl/

Please notice the difference between the first and the second section. Avobe (Over sieraden merk beginnen) there is some extra space. Above the second part (Diensten) there is no whitespace, because I placed the text besides the main part.

See here how I did it in the backend https://www.diigo.com/item/image/354qk/bi71

I don’t think I understand what the issue is here. If you remove the first empty text widget then there will be no white space above OVER SIERADEN MERK BEGINNEN.

Regarding the second part - you can remove that 6.6% text widget and it will look exactly the same, without any extra white space.

Could you please do this and let me know? And if it doesn’t work leave it like that a bit so I can see if there is an issue.

I also think I understand know why you said that linking the menu isn’t working. You probably weren’t targeting the correct IDs. You can simply take the row ID by using the Chrome debugging tool. For example, the ID for your OVER SIERADEN MERK BEGINNEN section is #pgc-701-0-0.

Thanks for the reply. Using Chrome I now got it to work without the extra html needed. Not easy to find by the way, it might be an idea to add it to the Editor.

Is there also an easy way to add a “go back to top” icon, just above the line of the next section?

There isn’t anything to add to the editor, the Page Builder plugin generates those IDs automatically.

We’ll see about adding a back to top icon in the next update.