HTML anchors and website scrolling

If you are using long pages on your website and you want to create direct links to a specific section within this page, you can do that with an HTML anchor.

Place HTML anchor

You can place an HTML anchor at any point on your page. You do this by moving the cursor to the position where you want to add an 'anchor'. Then choose the 'Insert content' icon on the right (the leaf with the arrow). Then choose 'HTML anchor' and enter the anchor there. You can then use the anchor you entered here in the link to this section on this page.

Link to an HTML anchor

Now if you want to create a link that automatically jumps to the spot where you added an anchor, you can do this by taking the entire URL of the page and then adding the following piece of code after it:

#!anker

Where 'anchor' can be replaced by the anchor you have created. You can then link this to your pages by linking to the full URL, which will look something like this:

www.ziber.nl/welkom#!easy-cms

Here 'easy-cms' is the added anchor. For example, you can now link to the specific section within that same page at the top of this page. It is of course also possible to link to the same URL elsewhere on the site, or perhaps on a completely different site. The visitor of that website, who clicks on the link, is then referred to the page and automatically scrolls to the right place.

Standard anchors

Within your Ziber website you can always use the following standard anchors in the links to pages:

• #!website
• #!section
• #!footer

The anchor #!website causes the visitor to scroll all the way to the top. It is also possible to make a reference to the top of the 'section' part (where the page content begins), you do this with the anchor #!section. The #!footer anchor creates a reference that scrolls all the way to your footer.