Theme #10 "Premium"

Universal adaptive design theme family

You can easily customize this theme to match the specific contents of your store. Most of the theme's options are available on "Storefront" tab "Design" -> "Theme Settings" page. Let's take a look at each of the items.

  • "Color scheme". Set some of the several available colors for your website.
  • "Logo font". Set some of the several available fonts for your logo.
  • "Logo font size". Height of the logo (px).
  • "Top margin for the logo". You can move up or down your logo by entering a number into this field (px).
  • "Vefrtical margins for the header". You can adjust the header height for the background image.
  • "Logo color". Hex or RGB value. For example: #000000, rgb(0,0,0).
  • "Logo". You can use a graphical logo instead of text.
  • "Logo image width". You can specify width of the logo image here..
  • "Slogan". Optional field. The slogan will be displayed directly under the company logo.
  • "Background image". Just select one of included images here.
  • "Your background". You can upload your background image here.
  • "Inverse menu colors". You can choose this box If you have light background image.
  • "URL prefix for images". Optional field which specifies the URL of the directory for uploaded images. This prefix used to display product category icons. It is recommended to create folders for uploading images using the "File manager" section in the Site app. In this case, the desired folder's URL will be similar to this: http://your-site/wa-data/public/site/img or /wa-data/public/site/img (this string is displayed in the page header).
  • "Use categories icons". If you have a set of icons for top-level categories, upload them into the image folder and enable this settings option. File names must match the id's of categories displayed in the "Storefront link" on the "Products" tab. Allowed file extension is ".png".
  • "Use horizontal categories menu". When you choose this option categories menu will be located horizontally under the main menu.
  • "Navigation menu". If you use multi-level menus with large number of elements, it's great to choose "Accordion" or "Full" menu.
  • "Minimal page width". Optional setting which limits the minimum width of all website pages. If the browser window size is less than the specified value, the horizontal scrollbar appears.
  • "Maximal page width". Optional setting which limits the maximum width of all pages.
  • "Facebook page URL", "Twitter username", "VK.com page URL", "Instagram username", "Youtube channel URL", "Pinterest page URL", "Google+ URL". Optional set of fields for specifying the URLs of your company's pages in social networks.
  • "Additional text for Print page". Address of your company or whatever.
  • "Counter code". If you have additional counter code for your site, you can place it in this field.
  • "Additional styles". Any CSS styles for all of your pages.
  • "Long lists". Default value is "Auto load on scroll (lazy loading)".
  • Hide "New photos" block, left sidebar, "social" buttons, counts in categories list, "recent" products list, "Write review" link, "Add to comparison table" link. May be usefull in some cases.
  • "Hide checkout layout". By default the header and the footer of the checkout page are hidden.
  • "Service ad for the storefront". For example, information about the temporary suspension of sales.
  • "Storefront homepage slider". One of: "Best-selling products", "Best-selling products: last photo as a background", "Latest photos from Photos apps".
  • "Location of the filter unit". The filter may be placed in the left sidebar or on the category page.
  • "AJAX-enabled product filtering by features". By default, search results in a product category are updated automatically when you change the search criteria in the filter.
  • "Selectable features". One of: "Display all values inline", "<select> HTML control".
  • "Cross-selling in cart". "Common recommended product list based on entire cart content" or "Separate recommended product lists for each item".
  • "Storefront bullet #1 title", "Storefront homepage bullet #1 body", "Storefront bullet #2 title", "Storefront homepage bullet #2 body", "Storefront bullet #3 title", "Storefront homepage bullet #3 body", "Storefront homepage promo block title", "Storefront homepage promo block body". Simple text blocks for your storefront.

Website top menu.

Top horizontal navigation unit displays links to your website's main sections and consists of two parts:

  1. Installed apps (e.g., "Shop", "Blog", "Photos", etc.).
  2. Pages of the selected app (e.g., "About us", "Shipping and payment", "Contacts", etc.).

You can add custom menu items by creating a new page in "Shop" -> "Storefront" -> "Pages".

Conclusion.

In most cases, the settings are flexible enough to create the desired look for your store. Should you need more freedom in customizing your website design, you may use the built-in design editor to make any additional changes.

Good luck!