CMS Tips & Tricks
How do I create an anchor link?
Sometimes you may want to scroll a visitor to a certain section of the page. Enter anchor links.
Want to whisk your website visitors to a specific spot faster than you can say “abracadabra”? Enter anchor links. They’re like teleportation for your webpage, minus the sci-fi jargon. Here’s how to set them up without breaking a sweat—or the internet.
Step 1: Set Your Anchor ID
You’ve got options. Two of them. Both equally awesome.
Option 1: Slap That Anchor ID on a Module
- Find the section or module you want to spotlight. Let’s say it’s the Magic Module (because obviously, you’re using magic).
- Click the module to open its settings, and then head to Custom ID & Classes (code).
- In the CSS ID field, type your anchor ID. No caps, no spaces, no funny business. Keep it lowercase and clean, like a well-ironed shirt.
Pro Tip: This method ensures your section doesn’t end up awkwardly squished at the top of the browser. Perfect spacing, all the content in view. It’s like the feng shui of web design.
Option 2: Anchors Away in a Rich Text Area
- Open a rich text area in a Clean Pro module (because rich text = rich experience).
- Click Insert, then Anchor, and give your anchor a name. You’re officially the captain of this ship.
Pro Tip: This option makes your anchor extra link-friendly across HubSpot, but be warned: the scroll position might get a bit… clingy at the top. Tweak, test, and tweak again.
Step 2: Add Your Button or Link
Time to link it up! You can anchor almost anything in HubSpot—buttons, text links, navigation items, your existential dread—except for those super fancy HubSpot CTAs. Sorry, can’t touch those.
• Using Module Anchors? Drop the anchor ID into the URL field like this: #anchor_id.
• Using Rich Text Anchors? Select it from the handy menu. Easy-peasy.
And… Waala! You’re a Web Wizard!
Your anchor link is set. Visitors are happy. You’re happy. The universe smiles. Go forth and create scrollable magic!