How to Use Showit’s New Button Feature (and Why It’s a Big Deal)

Showit

If you’ve ever layered a text box on top of a shape in Showit just to make a button… you’re not alone. That’s been the go-to workaround for years.

But guess what? There’s a better way now—finally!

Showit just introduced a brand-new Button element that simplifies the whole process. It’s one of those small updates that makes a big difference, especially when it comes to design flow, user experience, and yes—those all-important clicks.

In this post, I’m walking you through what’s new, why it matters, and how to use it with intention.

Let’s dive in 👇

Why Buttons Are More Important Than You Think

Your buttons are more than just design accents—they’re calls to action. A well-designed button can guide someone exactly where you want them to go (book a service, view your portfolio, read a blog post).

When buttons are clear, clickable, and thoughtfully placed, they:

Create smooth user journeys
Improve your overall site experience
Increase conversion rates

…but when they’re confusing or hard to spot? Your visitors might click away instead of clicking through.

So yes, buttons matter a lot. And Showit’s newest feature makes it easier than ever to get them right.

What’s New in the Showit Button Feature

Here’s what’s exciting about this update:

A True Button Element – No more stacking. Simply drag and drop a real button onto your canvas.
Built-In Hover States – Easily add hover effects without needing multiple layers.
Custom Padding & Spacing – Make your buttons look polished and feel consistent across your site.
Better Mobile Behaviour – These buttons adapt beautifully on mobile—no extra tweaking needed.

Here’s a peek at the new button tool inside Showit (In Settings):

This is in the back-end of showit where you style both the Primary and Secondary Button in Showit.

How to Make Your Buttons Work Harder

Now that buttons are easier to make, let’s make them more effective. Here are a few design tips to help your buttons support your site’s goals:

1. Be Clear and Action-Oriented

Use words that inspire action like:

“Inquire Now”
“See My Work”
“Browse Templates”

Avoid vague words like “Click Here.” Be specific!

2. Limit to One Primary CTA per Page

If everything is the most important thing, nothing is. Keep one button styled as the hero, and let the rest fade back visually.

3. Keep Visual Hierarchy in Mind

Make sure your button color stands out from the background, but still aligns with your brand palette. Size, color, and placement all signal importance.

4. Check Mobile (Always)

Even though the new buttons are mobile-friendly by default, always preview to be sure your spacing, sizing, and hover states still feel intentional.

A Look at the New Button in Action

I’ve already started using the new button feature inside my latest template designs—and I can’t wait for you to see them when the Template Shop opens this August!

A little sneak-peak how a button will look-like when you apply your branding.

✨ Notice the consistent padding and perfect alignment? And you can create a subtle hover effect without stacking elements—just using Showit’s new built-in button feature.