How to use the Website builder to create your online store #

The Little Big Shop drag-and-drop Website builder is a tool that allows you to create a unique and professional website for your online store with no tech or design skills.

In this help article, we explain the Website builder’s features and how they can be used to bring your brand to life, promote your products, tell your story and much more.

The Website builder contains many features that will help you bring your brand to life and will be explored here. The following are frequently mentioned and are a good starting point:

• Pages: default shop page, option to add following pages with pre-built templates: Home, Shipping, Contact Us and a blank page
• Global styles: use this feature to add your logos and update your branding site-wide (or ‘globally’), saving time and helping you achieve a consistent look. Our help page Layout and style runs through how to use it.
• Section templates: A section template is a Blank or Prebuilt template with editable elements that serve as ideas on how to present your content. In most cases, you can click on an element, e.g., text, and change it to your liking. The header and footer templates are default. We’ll go into more detail here.

To access the Website builder:

• From the Admin dashboard, select ‘Website builder’ on the left-hand side
• A new tab will open with the Website builder

Upon opening the Website Builder for the first time, you will land on the default ‘Shop’ page. On the top left-hand side, you will see the Pages icon is already selected, and next to it is the Global styles icon.

As you add products to your shop, they will appear in your online store. This can serve as your shop and website, but you can use the website builder to add any of the following pages to give it a website feel:

• Home
• Contact Us
• Shipping
• Blank Page

We’ll start with exploring the Shop page.

The Shop page template #

This contains the following elements:

Default header: this is your site’s navigation and if you add extra pages to your store (more on that soon) they will appear here. You cannot delete your shop’s header.

Update your logo

• • Option 1: click on the LOGO image and select the pencil icon. Follow the prompts to change the logo
  • Option 2: select ‘Global styles’ > ‘Logos’ > click on the box in ‘Site logo’ to add your logo site wide > click ‘Save’ to apply your changes

Change your background colour

• • • Select the header > ‘Style manager’ will appear on the top right > select ‘Decorations’ > click into the field underneath ‘Background colour’ and add your own hex code or use the drag function to select your own colour

Base panel

There is a base panel under the header and above the footer. This contains instructions to ‘Drag section template here’. It is optional to add content here.

Add section templates

A section template is a Blank or Prebuilt template with editable elements that serve as ideas on how to present your content. In most cases, you can click on an element, e.g., text, icon or image, and change it to your liking.

To drag a section template to the base panel:

• Navigate to the top right-hand side of the website builder and select the ‘Add section templates’ icon (it looks like a rectangle)
• Click on ‘Blank Templates’ or ‘Prebuilt Templates’ to view and explore options to choose from
• Click on a content panel to select it and drag it above the base panel. When the green line guide appears, drop the content panel here and click into it to start making your changes

Shop placeholder image

This placeholder demonstrates how your products will display in your store once you start adding them. It does not appear in your live store.

Footer

The footer is a mandatory template. Click into it to update it. If you would like to choose another footer design, select ‘Add section template’ > navigate to the ‘Footer’ section to explore your options > hover over your chosen footer > click to select the footer > the new footer will automatically be applied. Click into it to edit it.

You can also add the following pages with pre-built templates: Home, Shipping, Contact Us and a Blank page.

To do this:

• From the left-hand side, navigate to ‘Pages’ and select the plus icon to the right
• Click on the icon of the page you wish to add and it will begin to load
• Click ‘Save draft’ on the top right side of the website builder to save your edits, or click ‘Publish’ to instantly publish the page

Each template contains section templates that are like building blocks for your page. They are a guide for content to add and can be viewed as building blocks for the page.

You can remove, rearrange or delete the section templates in the pre-built page templates. You can also browse through other section templates and elements and add them to the page.

• Use the layout and style settings to further customise the look and feel of your website. You can adjust colours, fonts, and other design elements to match your brand.
• Always preview your changes to make sure everything looks perfect before publishing.

Check out our page about our website builder to learn more about its capabilities.