Using Buttons and Button Groups in Composer 2

Buttons are a primary way for visitors to interact with your website, providing quick access to key sections, features, or downloadable content. Composer 2 offers up to 8 preset button styles, each fully customizable to match your site’s branding.

When grouped, buttons can be displayed vertically or horizontally, giving users multiple clear options for navigation or actions.

Key Features

Multiple Button Styles

• Choose from 8 preset styles, easily accessible via the Widget Tool or control panel.

Flexible Layouts

• Add buttons individually or as a group.

• Arrange vertically or horizontally depending on your page design.

Link Anywhere

• Buttons can link to internal pages, external URLs, or downloadable files.

• External links can open in a new window for convenience.

Customisation Options

• Add custom text and optional icons.

• Choose icon style and placement.

• Set button width to Auto (text width) or Fill (full container width).

• Adjust styling via Design & Appearance settings (font, color, border, background, corner radius).

Optional Settings

Enhance button functionality with:

• Icons for visual cues.

• Full-width layout for uniform alignment.

• Group alignment controls for vertical or horizontal arrangements.

How to Add

1. Go to your page content area in the Back Office.

2. Click the Widget icon → Button (or Button Group).

3. Select a style and enter your button text.

4. (Optional) Add an icon and set the destination link.

5. Choose the layout and width (Auto or Fill).

6. Click Save and View Page to preview your buttons.

With these steps, you can create visually engaging, accessible buttons that guide visitors efficiently through your site and drive interaction.

Watch the Video Demo:

Video Transcript:

If you add buttons as a group, you can align them horizontally and vertically.

To add a button, please go into your back office.

For ease, we have placed the button icons directly into the control panel.

These can also be accessed through the Widget tool.

Please select the style of button you would like to add.

The different styles can be viewed on your sample page.

Add any text and if you'd like, you can add an optional icon.

You can also choose the style of the icon, locate your link as you would do normally, and submit.

If you are linking off to a PDF or an external link, we would recommend that you open the link in a new window.

By default, the width of the button will be the width of the words you add.

This is auto.

You can however set this to fill.

If you choose this option, the button will fill the entire width of the container.

So for example, these buttons are auto.

They literally take the width of the wording and these are set to fill.

They will fill the entire space that they're in.

You can also choose the alignment of the button: left, centre or right.

When you're done, hit Insert Widget and Save.

OK, there's your button.

To add a button group, follow the same process.

Insert your widget.

The button group will allow you to add up to five different buttons.

These can be toggled on and off.

Choose the button style you require and again any icon and link.

Don't forget to set the target.

We're going to add two buttons in this case.

Don't forget to hit Submit on the settings tab.

You'll be able to choose whether it is directed horizontally or vertically and where to have it aligned.

Here are my right-aligned buttons.

For more information on other button styles, please refer to their videos.