Button Group
Create compelling call-to-action buttons with customizable styling and link options
The Button block gives you two layers of control. First, you have Group Settings that apply to all buttons at once, ensuring they look consistent (like their size and alignment). Second, you have Individual Settings for each button, allowing you to customize its specific text, color, and link. This makes it easy to create a polished, professional set of actions for your visitors.
How to Add Buttons
Option 1: Drag and Drop
Look for Buttons in the right sidebar
Choose how many buttons you need:
1 Button: A single call-to-action
2 Button: Main action + secondary option
3 Button: Multiple equal choices
Drag your choice onto the page
Option 2: Type to Add
Click where you want buttons
Type
/buttonPress Enter to add a single button
Adding More Buttons (After Initial Creation)
You have two ways to add more buttons (up to 3 total):
Quick Add:
Look for the '+' button that appears to the right of your existing buttons
Click it to instantly add a new button
This only appears when you have less than 3 buttons
From Manage Items:
Click on the button container area (not on a specific button)
Select "Manage Items" from the toolbar
Click "+ Add New Item"
Customizing Your Buttons
For All Buttons in Your Set
Click anywhere on your button set (not on a specific button) to see these options:
How many buttons?
Add buttons using the '+' icon or "Manage Items" (3 maximum)
Remove buttons two ways:
From Manage Items: Click the trash icon next to any button
From individual button: Click the button, then click trash in its toolbar
Drag buttons up/down to reorder them in Manage Items
Where should they appear?
Left: Start from the left side
Center: Centered on the page
Right: Aligned to the right side
What size should they be?
Small: Subtle, space-saving buttons
Medium: Standard size (recommended)
Large: Bold, attention-grabbing buttons
For Each Individual Button
Click directly on a button to customize it:
Button Text
Type your call-to-action (30 characters max)
Make it action-oriented: "Get Started" not "Submit"
The text box grows as you type
Button Colors
Background Color:
Click the color picker
Choose from your brand colors
White buttons get an automatic border
Text Color:
Pick a color manually, OR
Turn on "Auto select text color" (recommended)
Auto-select ensures your text is always readable
Where Should It Go?
Click the link icon to set up your destination:
Website Links: Type the full URL (like https://example.com)
Opens in a new tab automatically
Your Other Pages: Select from your published pages
Opens in the same tab
Downloads: Link to PDFs or documents
Files you've uploaded to Resources
Smart Links (Templates only): Use merge tags
Like {{LINKS.BOOK_MEETINGS}} for scheduling
Once linked, you can:
Click "Go to Link" to test it
Click "Remove Link" to start over
Add Tracking (Optional): You can add UTM parameters to any link for analytics:
Example:
?utm_source=email&utm_campaign=spring2024If on the page templates, you can add variables as the utm_source values
Helps you track where button clicks come from
Works with all link types
Tips for Success
Writing Button Text That Converts
Be specific: "Get Your Free Guide" beats "Submit"
Add urgency: "Claim Your Spot Today"
Include value: "Start Saving 20%"
Use numbers: "Join 5,000+ Happy Customers"
Choosing Your Button Strategy
1 Button: When you have one clear action (most effective)
2 Buttons: Primary action + alternative ("Buy Now" + "Learn More")
3 Buttons: Multiple equal options ("Basic" "Pro" "Enterprise")
Design That Works
Use contrast: Make buttons stand out from the page
Stay consistent: All buttons in a set should be the same size
Think mobile: Buttons stack vertically on phones
Give them space: Don't crowd buttons against other content
Where to Place Buttons
After benefits: Once you've explained the value
Above the fold: At least one button visible without scrolling
At decision points: Where visitors are ready to act
Repeat on long pages: Every 2-3 sections
Common Questions
Can I have more than 3 buttons? No, each button set holds a maximum of 3 buttons. If you need more options, consider using multiple button sets or a different approach like a menu.
Why can't I see my button on the live page? Check that you've added both text and a link. Buttons without links won't appear to visitors.
How do I make buttons the same width? Buttons automatically size based on their text. For uniform widths, use similar text lengths in each button.
Can I use images in buttons? No, buttons are text-only. For image-based calls-to-action, use an Image block and add a link to it.
Related Features
Last updated