Buttons with icon

The Buttons with Icon section is a versatile feature for adding interactive buttons with icons that enhance the visual appeal and usability of your store.

How to add a Buttons with icon section to your Shopify store

Steps:

1. In the theme editor (Customize), click Add section

2. Locate Buttons with icon section

3. Make necessary changes

4. Save.

How to edit a Buttons with icon section

Section settings

Section header

See settings

• Subheading: Add a short, secondary heading to complement the main heading. This can provide additional context or detail.

• Heading: Enter the primary title for your banner.

• Heading size: Adjust the size to fit your design preference and ensure readability. Choose from available heading sizes.

• Description: Add a detailed explanation or summary for the banner. Use rich text formatting like bold, italic, links, and lists for better visual emphasis.

• Description size: Select the size of the description text.

• Button label: Input the text for the call-to-action button.

• Button link: Add a link to the button to direct users to a specific page, product, or collection.

• Button style: Choose a style for the button.

• Text alignment:

  • Align the text in the section to the Left, Center, or Right.

  • Adjust alignment based on your banner’s design and layout.

• Text alignment on Mobile: Override desktop alignment settings specifically for mobile devices if needed.

Item settings

• Content alignment: Align the content within the buttons (left, center, or right).

• Button style: Choose between styles for your buttons.

Carousel settings

Enable or disable the carousel function on desktop. Turning this on allows users to swipe through buttons interactively.

Mobile Layout

Allow users to swipe through buttons for a seamless mobile experience.

Block settings

Each button comes with a Button label, Button link, and an Icon for it.

Pro tip ⭐: Icons should complement the button text and enhance the message (e.g., use a checkmark for "Eco-Certified" or a cart for "Shop Now").