Do you know how to use anchor links?
Updated by Tiago Araújo [SSW] 1 year ago. See history
123
<introEmbed body={<> The attribute "name" allows you to link to specific places within the page, via the `<a>` tag. This is especially useful in long pages that can be separated into sections. You can create a named anchor in each of these section headings to provide "jump-to" functionality. In other words, you can have a different URL for each piece of content on the same page. </>} /> ```html <h2><a name="get-started"></a>Get Started</h2> ``` **Figure: This is how you add an anchor name to an specific section of your page. Note it doesn't have the hash mark and the anchor tag is empty** You now have a custom URL that points to the specific section of the page. It is the page URL followed by the hashtag plus the name you chose: <asideEmbed variant="greybox" body={<> yourpage.com#get-started </>} figureEmbed={{ preset: "default", figure: 'This is how your custom URL will look like', shouldDisplay: true }} /> You can use this new URL to point users to that specific section of your page. To create a link to your anchor named section inside the same page, simply add a new "href" anchor tag - now with a hash mark followed by the name you chose: ```html <a href="#get-started">Go to Get Started section</a> ``` **Figure: This is how you add a link to that anchor name you created inside the same page. Remember to add the hashtag** **Tip:** Use a hashtag **alone** to link to the top of a page. E.g. `<a href="#">&Go to top</a>`
Categories
Related rules
Need help?
SSW Consulting has over 30 years of experience developing awesome software solutions.