Skip to main content

Update your shop theme

Updated April 15, 2026

Choose a theme template and make your site feel like yours from day one

Your shop's theme controls the overall look and feel of your site. Fourthwall's Theme Selector Modal displays every available theme upfront so you can browse, preview, and pick a template without extra steps. Whether you want a bold hero layout or a clean, hero-less design like Oasis, you can go live with a polished storefront in minutes.

Browse themes in the Theme Selector Modal​

The Theme Selector Modal is your central hub for choosing a theme. It shows all templates in one view.

  1. In your Fourthwall dashboard, go to Site design > Theme.

  2. Click Add new theme to open the Theme Selector Modal.

Theme Selector Modal titled "Add a new theme" showing a grid of available theme templates with preview thumbnails

  1. Scroll through the available templates. The modal uses smooth scrolling so you can quickly compare layouts, color options, and hero styles.

  2. Click any template to see a full preview on desktop and mobile.

  3. Once you find a theme you like, click Add this theme to apply it.

tip

Some templates, like Oasis, use a hero-less layout. These are a good fit if you want your products or collections front and center without a large banner image at the top.

Onboarding: set up your theme for the first time​

When you first create your Fourthwall site, the onboarding flow takes a template-first approach. You pick a theme before anything else, then customize it to match your brand.

There are two paths through onboarding:

Quick-start with templates​

Pick a template from the Theme Selector Modal and go live right away. Fourthwall applies sensible defaults for colors and fonts, so your site looks polished from the start. You can always fine-tune later in the Site Designer.

Deep customization with color pairs and typography​

After selecting a template, you can customize further before publishing:

  • Color pairs let you define coordinated color combinations for your site's backgrounds, text, buttons, and accents. Instead of picking individual colors one by one, you set pairs that work together across your entire theme.
  • Typography settings let you choose heading and body fonts that match your brand's personality.

These options appear during onboarding and remain available in Site design at any time.

note

Color pairs and typography settings apply to your active theme. If you switch themes later, you may want to revisit these settings to make sure everything still matches your brand.

Preview your theme​

The Theme Selector Modal includes a built-in preview with smooth scrolling. As you browse templates, you can:

  • See how each theme looks on desktop and mobile
  • Scroll through the full page layout to check hero sections, product grids, and footer styles
  • Try different color patterns before committing

This preview helps you make a confident choice before applying a theme to your live site.

Activate a saved theme​

If you've previously added or customized theme templates, they're saved in your theme library.

  1. Go to the Themes page in the Site Designer.

  2. Review your saved theme templates under Inactive themes.

  1. Click the three-dot icon next to the theme you want and select Set as active theme.

Three-dot menu on inactive theme showing Set as active theme and other options

Manage your themes​

From the three-dot menu of any theme, you can:

  • Edit - Open the theme in the Site Designer to customize it
  • Set as Active Theme - Switch your live site to another theme
  • Duplicate - Make a copy before experimenting with changes
  • Rename - Update the theme's name for clarity
  • Reset to default - Restore original theme settings
  • Delete - Remove the theme from your library

Frequently Asked Questions​

What is a hero-less template?​

A hero-less template skips the large banner image at the top of your homepage. Instead, it leads with product grids, collections, or other content sections. Oasis is one example of a hero-less template.

Can I switch between themes without losing my customizations?​

Yes. When you switch to a different theme, your previous theme and its customizations are saved under Inactive themes. You can reactivate it at any time.

Where do I find color pairs and typography settings after onboarding?​

Go to Site design in your dashboard. Color pair and typography options are in the Style section.

Learn more about designing your site in Fourthwall site design options.

If you have any questions, do not hesitate to contact us at support@fourthwall.com.

Was this helpful?