Add anchor links to page

Is there a way I can make the format buttons on the page below have an an anchor tag so I can link directly to specific formats of resources?
I want to include a link directly to our guides.

The page is using custom code and custom module for these buttons.

Hey @EWright44,

by default you should be able to set the button to “External” and just type “#MY-ANCHOR” as the URL. HubSpot might display that there’s an error, but it will work :slightly_smiling_face:

To add a Jumpmark to the page add a rich-text(if you’re in the drag&drop), switch to the source-code view and type:

<div id="MY-ANCHOR" style="height:0;"> </div>

Another possibility might be to create a simple custom module with two text inputs(not rich-text) like this:

<a href="{{ module.anchor|lower|replace(" ", "-") }}" class="btn btn-primary"> {# You might want to change the button classes to the ones from your theme #}
 {{ module.anchor_label }}
</a>

quick tip for editor experience: add this to the custom module if you’d like to show the used anchor while being in the page-editor

<a href="{{ module.anchor|lower|replace(" ", "-") }}" class="btn btn-primary"> {# You might want to change the button classes to the ones from your theme #}
 {{ module.anchor_label }}
</a>

{# show the anchor in the page editor #}
{% if is_in_page editor %}
 <strong style="padding:.5rem; background:#E8E8E8;color:#878787; text-align:center"> {# feel free to modify the colors #}
 {{ module.anchor|lower|replace(" ", "-") }}
 </strong>
{% endif %}

best,

Anton

Here is another option, but works off of what you said. If you look at the source code for any HubSpot page, I happen to be using a themed page, you can get the div id. Then, the same as you suggest, use the # to link to that div id on your page. Now I can link to other sections on my webpage. Thank you for putting me on the right path to a solution!!