How to Style Links as Buttons

By default, links you add in the CMS will automatically be coloured to indicate they are clickable. For a stronger visual effect, you can also style links as buttons, making them more prominent and easier to tap on mobile devices.

🎨 Button Styles

Button styles are created during the design and build of your site to match your branding. Examples include Button One, Button Two, and sometimes Button Three, each with different colours and effects.

⚠️ Note: If you are using the Composer 2 template or certain custom build templates, buttons may be added via a widget instead. You can find full instructions for this method here: Using Buttons and Button Groups in Composer 2

✍️ How to Apply a Button Style

STEP 1 – Create a Link

• Start a new line and keep your link text short.

• Link it to a page, library, or other content in the CMS.

STEP 2 – Apply a Button Style

• Select the link text (it should appear blue in the CMS).

• Open the Styles dropdown in the toolbar.

• Choose the desired button style.

✅ You will know the link has been styled correctly when it changes from blue text to a grey background (or the style defined in your site design).

• To change the style, simply select the link text again and pick another style from the dropdown.

💡 Tips

• Keep link text concise for clarity and better usability on mobile.

• Experiment with different button styles to see which looks best within your content.