BASE shop design customization – make your shop look like your brand

Three ways to change your BASE design

There are three main routes, and the right one depends on how far you want to go.

• Free themes and built-in settings: in the admin "Design" area you can change the logo, main color, background, hero image and product layout. No code needed – a good first step
• Paid themes: more polished designs sold in BASE's Design Market. They change the layout and mood considerably and are usually a one-time purchase
• The HTML Editing App: this BASE App lets you edit the theme's HTML and CSS directly, which opens up the home page structure and fine visual details

The cart, checkout and payment screens are managed by BASE, so none of these routes changes them much. Your design work focuses on the home page, product lists, product pages and shop information – the parts customers see first, and the parts that shape their impression of your brand.

What well-performing BASE shops have in common

The goal of customization is clarity: a first-time visitor should quickly understand what you sell and what to buy. Shops that do well tend to share these traits.

• The first screen shows the brand's mood and its main products
• Product photos share the same background, brightness and aspect ratio, so lists look tidy
• A few clear categories, and any product is two taps away on a phone
• Shipping costs, dispatch times and return terms are easy to find from the product page
• A short brand story or maker profile explains who is behind the shop
• Logo, fonts and colors match your Instagram and other channels

Most BASE visitors arrive on a phone, so review every design change on mobile first. For the broader principles of shop layout, see our guide to e-commerce site design.

How to choose a paid BASE theme

A paid theme is a quick way to refresh your shop, but a theme that looks great in its sample photos may feel different with your own products. Check these points before you buy:

• Product count: a few products suit large-image themes; a big catalog needs a theme that shows many items clearly
• Photo shape: check whether the sample uses square or portrait images and whether your photos match
• Mobile view: open the demo shop on your phone and test the menu and text size
• App compatibility: make sure the BASE Apps you plan to use, such as pre-orders, subscriptions or reviews, display properly
• HTML editing: some themes are harder to adjust with HTML editing, so read the notes if you expect fine-tuning later
• Updates: see whether the author provides updates or support

Think of a paid theme as a foundation. Pick one whose overall feel is close to your brand, then fill the gaps with built-in settings or HTML editing – usually the best balance of cost and result.

What HTML editing on BASE can do – and what to watch for

With the HTML Editing App the range of possible changes grows a lot. Typical customizations include:

• Adding custom home page sections: a brand introduction, features, seasonal picks
• Fine-tuning fonts, spacing and button colors and shapes to your brand
• Reworking header and footer menus to lead people to key pages
• Notice bars or banners for free-shipping thresholds and dispatch news
• Clearer product page layouts, with readable size charts and care notes

Keep in mind that HTML editing means rewriting a template that uses BASE's own tags. On an edited theme, new BASE features and some Apps may not appear automatically, and tags may need to be added by hand. Three habits keep it safe: back up before editing, keep a record of what you changed, and test on mobile all the way through to checkout before publishing. Page structure and headings also affect how your shop is found in search, so it pays to read up on SEO for BASE shops as well.

Hiring someone for BASE design: steps and what to prepare

If doing it yourself is not practical, you can hire a designer. Requests range from theme setup and banner images to a fully built home page with HTML editing. The work usually runs like this:

• Goals: more new customers, higher order value or a stronger brand image – set the priority
• Scope: theme choice, built-in settings, HTML editing, banners and images – decide what to hand over
• Design review: settle the direction on the home page, then extend it to lists and product pages
• Pre-launch checks: mobile view, add-to-cart, App behavior and broken links
• After launch: reorder products and features based on visits and best-sellers

It helps to have ready: your logo files, brand colors, product photos, two or three shops you like and a list of the BASE Apps you use. Keep your BASE account and custom domain in your own name and share only working access. If you are still at the start, see opening an online shop on BASE.

How UNANOBO handles BASE design: a free demo first

Before you commit to anything, UNANOBO builds a free demo of a new design for your BASE shop, using your products and brand. You view it on your computer and phone, centered on the home page, and decide whether to continue once you like the direction. The demo also shows whether a theme and settings are enough or whether HTML editing is worth it.

The process is simple: free demo, feedback, launch, growth. The founder handles every project personally, so you keep one contact from the first demo to improvements after launch. Everything runs by message, in Japanese or English, and marketing after launch – SEO, Instagram ads, Google Shopping – goes through the same contact.