Lastly, we will take a look at a simple text link anchor.
Supposing we want to link from some text within a paragraph, our HTML would look like this, you can see we have replaced the URL with our unique anchor, preceded with a hash (#).
This is the HTML I would use to create my custom <a href="#myanchor">Anchor Link</a> when using within text.
Again we can add our anchor to the CSS ID field of any section, row or module, but we could also add it to other text so the anchor serves only to link between sentences or paragraphs. For example, here we link to a heading:
<h1 id="myanchor">This is a heading</h1>
Here we link to the beginning of a paragraph:
<p id="myanchor">This is the beginning of my paragraph...</p>
And we could even link to a specific word or sentence within a block of text using a span tag like this:
Here is some text, <span id="myanchor">anchor links to here</span> and some more text...
These solutions work for linking to content on the same page, but what if you want to link to an anchor on another page?
In that case you need to add the page name before the anchor, so on your button, custom menu item or text link you would add your anchor like this:
rather than just
If you have a scenario where you just want to link back to an anchor on the homepage from any other page, for instance if you have a one page site that also has a blog, and on single posts you want to be able to link back to an anchor on the homepage, then you can just use a preceding forward slash like this: