Storefront Setup

Configure your online store's appearance, branding, and settings. Learn how to create a professional storefront that represents your brand.

Store Information

Set up the basic information that customers see on your storefront:

1

Navigate to Storefront Settings

Go to Commerce → Storefront Settings in your dashboard.

2

Enter Store Details

Fill in your store information:

  • Store Name — your business or brand name
  • Tagline — a short description or slogan
  • Store Description — detailed description of what you sell
  • Contact Email — customer support email
  • Phone Number — support phone (optional)
  • Address — business location (optional)
3

Save Changes

Click Save Settings to apply your changes.

Branding

Customize your store's visual identity to match your brand:

Upload your business logo to display in the header and throughout your storefront:

  • Recommended size — 200×200 pixels or larger
  • Format — PNG with transparent background works best
  • File size — maximum 5MB
1

Upload Logo

In Storefront Settings, find the Logo section and click Upload.

2

Select Your Logo File

Choose your logo image from your computer.

3

Preview and Save

Check how your logo looks and click Save to apply.

Favicon

The favicon is the small icon that appears in browser tabs:

  • Recommended size — 32×32 or 64×64 pixels
  • Format — PNG, ICO, or SVG
  • Square aspect ratio required

Brand Colors

Customize your store's color scheme to match your brand identity:

  • Primary Color — main brand color used for buttons and highlights
  • Secondary Color — supporting color for accents
Color Tip
Choose colors that have good contrast for readability. Light backgrounds work best with dark text, and vice versa.

Homepage Layout

Your storefront homepage is made up of distinct sections. You control which sections appear and in what state from Commerce → Homepage Layout. Changes take effect immediately after saving.

Section Visibility

Each section can be toggled on or off independently. The sections available are:

Hero Banner

A full-width banner at the top of the page showing your store name, tagline, and a Shop Now button. Optionally upload a hero image in Storefront Settings.

Shop by Category

A grid of your product categories with their images, shown below the hero. Only appears if you have categories with images.

Best Sellers

A horizontally scrollable carousel of your most popular products, ranked by order volume.

Brand Story Section

A full-width editorial split section with an image on one side and custom text on the other. Use it for your brand story, a current promotion, or a seasonal campaign. You configure the content in the fields below the toggle.

New Arrivals

A horizontally scrollable carousel of recently added products.

Trust Badges

A row of four trust indicators (e.g. Fast Delivery, Secure Checkout) displayed across the page. You can customise each badge's icon, title, and description.

Featured Products

A grid of up to 8 hand-picked products. Select which products to feature in Storefront Settings under the Featured Products section.

Customer Reviews

Displays three recent customer reviews. Hidden automatically if no approved reviews exist, even when the toggle is on.

Brand Story Content

When the Brand Story section is enabled, a set of text fields appears directly below the toggle. These let you write the content that appears in the section:

  • Section Label — small eyebrow text above the headline (e.g. "Our Story", "This Week's Deal")
  • Headline — the main heading (e.g. "More Than Just a Store")
  • Body Text — a paragraph below the headline; use this to spotlight a sale, event, or product range
  • Button Text — the label on the call-to-action button
  • Button URL — where clicking the button takes customers; leave blank to link to your products page

The Brand Story image is uploaded separately in Storefront Settings under the Brand Story Image section.

Trust Badges Editor

Below the section toggles is the Trust Badges editor. Each of the four badges has three fields:

  • Icon — choose from Truck, Package, Shield Check, or Star
  • Title — short label (e.g. "Fast Delivery")
  • Description — one sentence that supports the title (e.g. "Quick shipping to your doorstep")
Saving Homepage Layout
Click Save Changes at the top or bottom of the Homepage Layout page to apply your section toggles, brand story content, and trust badge edits in one step.

Cart Widget

The Cart Widget is a floating button that appears in the corner of your storefront on every page. When customers click it, a slide-in cart panel opens showing their current items, subtotal, and checkout actions — without leaving the page they are browsing.

Replaces the Header Cart Icon
The Cart Widget replaces the cart icon in your store header. Customers access their cart exclusively through the floating button, keeping the header clean and the shopping experience uninterrupted.

Button Position

Choose which corner of the screen the floating cart button appears in. The slide-in panel always opens from the same side as the button:

  • Bottom Left — button and panel appear on the left side of the screen (default)
  • Bottom Right — button and panel appear on the right side of the screen

Choose the side that does not conflict with your chat widget or other floating elements.

Button Size

Control how large the floating cart button appears:

  • Small — 48px button with a narrower panel (320px wide)
  • Medium — 56px button with a standard panel (384px wide) — recommended
  • Large — 64px button with a wider panel (448px wide)

Button Color

The cart button uses your Primary Brand Color by default. To use a different color, set a custom color using the color picker in the Cart Widget settings.

Leave the color field blank to revert to your primary brand color.

Cart Panel

When opened, the cart panel shows:

  • Product image, name, and a link to the product page
  • Quantity controls to increase or decrease each item
  • Per-item total and overall subtotal
  • A Checkout button that goes directly to checkout
  • A View Cart link to the full cart page
  • A Continue Shopping button that closes the panel
Cart Widget Configuration
Cart Widget settings are found in Commerce → Storefront Settings, in the Cart Widget card. Changes take effect immediately after saving.

The banner appears at the very top of your storefront, above the navigation, perfect for announcements:

1

Toggle Banner On

In Storefront Settings, find the Banner section and enable it.

2

Enter Banner Text

Write your announcement message. Keep it short and attention-grabbing. Examples:

  • "Free shipping on orders over ₦10,000!"
  • "New arrivals just landed — Shop Now"
  • "Sale ends Sunday — Up to 50% off"
3

Choose Banner Style

Select the banner appearance:

  • Static — text stays in place
  • Scrolling — text scrolls across the banner (marquee effect)
4

Set Banner Colors

Choose background and text colors for your banner.

Make your banner clickable by adding a URL. When customers click the banner, they'll be taken to the specified page (like a sale category or product).

Connect your social media profiles to display icons on your storefront:

  • Instagram
  • Twitter / X
  • Facebook
  • WhatsApp
  • TikTok
  • YouTube

Enter the full URL for each platform (e.g., https://instagram.com/yourstore). Only platforms with URLs will display on your storefront.

Store Policies

Set up your store policies that customers can view:

Shipping Policy

Explain your shipping options, delivery times, and costs. Include:

  • Delivery timeframes
  • Shipping costs by location
  • Free shipping thresholds
  • International shipping (if applicable)

Return Policy

Describe your return and refund policy:

  • Return window (e.g., 30 days)
  • Condition requirements
  • Refund process
  • Exchange options

Privacy Policy

Explain how you handle customer data and privacy.

Previewing Your Store

Always preview your storefront after making changes:

1

Click View Store

From anywhere in the dashboard, click View Store in the top navigation or sidebar.

2

Check All Pages

Browse through your homepage, product pages, category pages, and cart to ensure everything looks correct.

3

Test on Mobile

Open your store on a mobile device to ensure it looks good on smaller screens.

Live Preview
Changes to your storefront settings are applied immediately. You can see updates in real-time by refreshing your store page.

Newsletter Subscription

Enable a newsletter subscription form on your storefront to collect customer emails:

  • Enable Subscribe Form — toggle to show the form on your footer
  • Headline — customize the form heading
  • Description — add optional text explaining the benefits of subscribing

Collected emails appear in your customer list for future marketing campaigns.

Custom Domain

Connect a custom domain to give your store a professional branded URL instead of the default Vaendora URL. You have several options:

Domain Connection Options

  • Buy a Domain — purchase a new domain directly through Vaendora. This is the easiest option with automatic SSL and DNS setup.
  • Connect with Nameservers — point your existing domain to Vaendora's nameservers for full DNS control and automatic SSL.
  • Connect a Subdomain — add a CNAME record for a subdomain (e.g., shop.yourbusiness.com) pointing to app.vaendora.com.
SSL & Email Benefits
Purchased domains and nameserver-connected domains get automatic SSL and are eligible for email hosting. Subdomain connections via CNAME require you to handle SSL through your DNS provider (e.g., Cloudflare).

For detailed domain setup instructions, see the Custom Domains guide.