How to Use Showit: Full Walkthrough for Beginners

A quick tutorial overview of the basic tools of the Showit website builder.

If you’re diving into Showit for the first time, this post will walk you through the core tools you’ll use most often while customizing your website. Whether you’re launching with a free template or one you purchased, understanding how Showit works will make your design process smoother and more enjoyable.

Inside, you’ll learn:

• How to navigate the Showit interface

• The difference between site canvases and page canvases

• How to update fonts and colors across your site

• What canvas sets do and why they save time

• How to manage galleries, blog templates, and more

This guide is perfect for:

1. Creative entrepreneurs using Showit for the first time

2. Business owners who want to maintain and update their own sites

3. Designers who need a refresher on Showit’s layout and features

Let’s dive in and explore the magic behind one of our favorite website builders.

Navigating the Showit Interface

Once you log into Showit and load your template (purchased or free), you’ll see:

• Desktop and mobile previews
• A sidebar with your pages, blog templates, site canvases, and canvas sets

Pages are your core website pages like Home, About, Services, etc. Blog Templates style your WordPress content (you’ll edit the content in WordPress post-launch). Site Canvases are reusable sections (like headers/footers) that update globally. Canvas Sets are grouped canvases you can apply across multiple pages.

Pages: Your Website Foundation

Within the Pages section, you can:

• Rename pages
• Set any page as your homepage
• Duplicate pages to save time
• Unpublish or delete pages

If you’re building a WordPress blog, you can copy pages into the Blog Templates section.

Blog Templates: Style Your WordPress Content

Blog templates don’t contain your content but define how it appears on your site.

• Headers/footers are static
• Post previews and blog grids pull from WordPress
• Templates can include shop layouts if you’re using WooCommerce

Site vs. Page Canvases

Site Canvases are synced across multiple pages. Great for headers, footers, navs, and promos. Page Canvases are unique to the page. Perfect for homepage heroes, bios, or individual services sections.

You can:

• Convert canvases between page and site formats
• Copy/paste canvases between pages
• Reuse and repurpose them easily

Canvas Sets

Canvas Sets group site canvases together (e.g., a header + footer combo).

• Apply different sets to different pages
• Reorder or remove canvases as needed
• Handy for creating focused landing or sales pages without distracting navs

Design Settings: Brand Colors + Fonts

In Design Settings, you can:

• Set your color palette (match brand colors by intensity)
• Upload and assign custom fonts
• Customize font styles for headers, paragraphs, mobile and desktop views

Customizing Text + Elements

For every element (like headings or paragraphs), you can:

• Change fonts, line height, spacing
• Set visibility per device
• Add inline or block links
• Adjust alignment, column layout, and more

Adding Images, Icons, and Videos

Add media elements to any canvas:

• Images and icons (with custom color and shape options)
• Embed code (for forms, tools, etc.)
• Videos (from YouTube or Vimeo)

Galleries + Instagram Grids

Use image galleries to create:

• Tiled, sliding, or single-image layouts
• Add padding, borders, hover effects

Instagram grids allow live feed display or fallback images if API breaks.

Views + Click/Scroll Actions

Views let you add multiple content sections to one canvas (great for testimonials, process steps).

• Set to auto-advance or click-through

Click Actions and Scroll Actions let you:

• Trigger new canvases to appear
• Link buttons or sections
• Create interactive elements without code

Mobile Tools + Canvas Options

Mobile tools include:

• Cropping overlays
• Centerlines and grid guides
• Zoom, undo/redo tools

Canvases have:

• Sticky positioning
• Background image options (parallax, fixed, transparent)
• Animation on entry/exit

SEO + Page Settings

Each page has:

• Meta title + description fields
• Featured image for social sharing
• Custom background color
• Animation options
• Header/footer code injection

Site Settings

At the site level, you can:

• Set favicon + language for browser translations
• Add your custom domain
• Configure blog domain settings
• Insert social links globally
• Add Google Analytics, Meta Pixel, Bedda, and custom code