Store Design and Theme Set Up in Vend Ecommerce


Latest update: - Admin

Choose your store design

Making your store beautiful and appealing to your customers (as well as easy to use) is an essential part of being successful when selling online.

The layout of your store depends on several elements of your store working together. There are two parts to this:

  • Structure
  • Appearance

Structure

The structure of your store is how your products and other information are organised. This includes:

  • Collection (sets of products)
  • Pages (other information about your store, like an About Us page, or Terms and Conditions)
  • Navigation (sets of collections and pages)

Appearance

The appearance of your store is how the structural elements are arranged and styled. Two things control how your store looks:

  • Theme - this controls how your homepage, pages, and collections display.
  • Checkout - this controls how your checkout process appears.

Your store will come with a free default theme, but you'll also be able to purchase themes in our marketplace or commission your designer/developer to create a custom one for your store.


Buy a new theme from the marketplace.

  • In your Ecommerce store, under Design, choose Themes.

  • Click Show Marketplace.

  • Move your mouse over a theme and select Theme Details.

  • Click Preview to open the developer's site and see a full site preview (this will have dummy data, not your store data)

  • If you decide to purchase the theme, click Purchase.

  • The theme developer's site will open for you to complete the purchase. You'll be provided with a zip file to download - Do not unzip it.


Upload a theme.

Once you've purchased a theme from the marketplace, or a designer/developer has made you a custom one, you'll need to upload it. It must be a zip file.

  • In your Ecommerce store, under Design, choose Themes.

  • Click Upload Theme.

  • Confirm you have authority to upload your theme.

  • Select your theme zip file and select Upload Theme.

  • Your theme will begin to upload. This will take a few minutes to process.

  • Refresh your web browser page to reload the page. Your theme file should appear.

  • Click Activate to activate your theme. This will make it live, so you may wish to customise it first.

We'll come back to your theme later to complete some customisation. Before we do that, you'll need to set up some of the structure of your store so that your theme knows what to display.


Customise your theme

Once you've got your structure set up, you're ready to customise your theme.

The theme in your store controls everything about how your store appears other than the checkout. This includes:

  • Homepage
  • Collection pages
  • Regular pages (like your 'About Us' and 'Terms and Conditions' pages)
  • Product pages
  • Cart page

How do I customise my theme?

Important: Theme customisation is dependent on how your theme designer built your theme. The following directions are general instructions only. You may need help from someone experienced in web design to customise your store.

Once your Navigation is set up, you can start to customise your theme.

  • In your Ecommerce store, under Design, choose Themes.
  • Click the name of the theme you want to customise. The theme editor will open.
  • Make your changes, then hit Preview to preview them.

  • If you're happy you can either:
    • Publish your changes; or
    • Save them as a preset if you'd like to keep editing.

The options in the left-hand menu are determined by your theme's developer/designer.

  • Click Instructions to open your theme designer's help document.

Use the theme help document with the theme editor to edit your store layout.

Tip: You can use the colour picker, or enter a hex colour code that specifies the exact shade.

Some important things to note:

  • Changes won't be updated in the preview window until you hit the button Preview at the bottom. Hitting > Preview does not update your live store.
  • As soon as you hit Publish, the changes will be live on your Ecommerce store.
  • If you don't want to publish immediately, you can save a version of your changes as a preset. Click Preset and choose Save current as new preset. You'll be asked to choose a name for the preset, and click Save.
  • You can't preview external links within the editor.

What if I want to make more advanced/complex changes?

In the top right-hand corner, you can click Edit HTML/CSS. This will take you to the source files for your store's theme.

Warning: Be careful changing your theme source files if you don't have a copy.

If you're not confident changing the HTML/CSS yourself, you can hire a developer/designer to help you with this.


Will my changes publish immediately?

This depends on whether you're editing your active theme or an inactive theme. If you're editing your active theme, as soon as you click Publish in the theme editor, your changes will be published. If you're editing an inactive theme, you can click Publish to save your changes, but they won't be live on your site until you change that theme to active.


I want a custom-designed theme

Any designer/developer who's familiar with Liquid templates can build a theme for you.


For more information on Vend Ecommerce, check out this article.


Powered by Zendesk