SectionAI is free + 20K tokens if you're a The4 customer, Free plan is available Install App  

Header background

Button Configs

Annie

Written by Annie

Last updated

1607 views

On this page


The setting will apply to all the sections that have the Button style, Button color or Button size options in the settings.

Example: Featured Collection section.

2023-05-09_11-25-23.gif

You can go to Admin tools -> Go to configs page -> Sections Sidebar -> Button Configs and configure it.

1. Button Config

  • You can adjust Font family, Font weight, Border radius, Other corner radius.

  • Hover button effect: Set the effect for the button on hover. It's only shown here to preview, not set for all site buttons. This effect only works with the button style default, outline.

2023-05-09_11-29-42.gif

2. Custom Color

The Button config section only supports 2 custom color blocks. From here, you can customize the button color as you want.

Step 1: Go to Button configs > click Custom color 1 to config the color.

There are some options for Primary color, Secondary color, Primary color hover and Secondary color hover.

2023-05-09_14-39-52.gif

Step 2: From the section you are using > choose 'Button color: Custom color 1'. Example:

2023-05-09_14-37-20.gif

3. Button size

Button size block is available on Unsen and Gecko theme. Not for Kalles.

We provide Three button size blocks as:

  • Button size #1

  • Button size #2

  • Button size #3

With each block you can adjust many options like: Font family, Border width, Font size, Font weight, Letter spacing, Min height, Padding left/right.

Step 1: Go to Button configs > click Button size #1 to config the color.

size2.gif

Step 2: From the section you are using > choose 'Button color: Custom size #1'. Example:

size1.gif

🎁 Exclusive Deals for The4 Customers

SectionAI

🤖 SectionAI – Build Sections with AI

Generate Shopify sections from text or wireframes.
The4 users get +20,000 bonus tokens when verifying their theme license.

  • ✅ No-code section builder
  • ✅ Works with your The4 theme
  • ✅ Build FAQs, banners, product grids & more
🚀 Try Free – Claim Tokens
EComposer

🎉 EComposer – Free 6-Month Plan

Build landing pages, sales funnels, and more with drag & drop.
The4 users get 6 months free (save $114).

  • ✅ 100+ templates ready to use
  • ✅ Build any Shopify page
  • ✅ No coding required
🔓 Get 6 Months Free

Enjoy a free 3-day trial. Then get your first month for $1. Try Now

We uses cookies to ensure you get the best experience on our website.