V2's Site Designer lets you build, design, and customize your site with pages and content blocks. You can easily modify an existing theme, swap themes or create your own from scratch. Use Site Designer to change colors and fonts, rearrange the layout of your home page, and even update header and footer links!
Here are some key terms that may help you understand how Site Designer works:
Theme- The theme is a set of pages with specific block arrangements. As the framework for a website's design elements, the theme defines the colors and fonts, spacing and positioning, and content types that are displayed in each area of the storefront for all device types. A theme is applied to every Volusion store by default. You can download additional themes from the Theme Store section of Site Designer. For more information on Themes, click HERE.
Page- A page can consist of a single block or multiple blocks and is used to show specific information, such as products, product details or other items defined by the user. For additional information on Pages, click HERE.
Block- A block is a customizable unit of content on a page that has both functionality and styling. Blocks can be used to build a highly customized storefront and can also pull data from external sources. For more information on blocks, click HERE.
Accessing Site Designer
Access Site Designer from your V2 store's Dashboard by clicking the Site Designer icon in the navigation menu on the left side of the page.
Once you have accessed Site Designer, you have a few options.
Previewing, Publishing and Viewing Live-
A few important buttons are located at the top of the Site Designer page. On the left side of the page, you will find Preview and Publish buttons.
Preview: The preview button allows you to look at your work before you share it with the world. Clicking the button will open a new tab that displays your website, including any changes or edits you have made. Keep in mind that your changes have not yet been saved.
Publish: The publish button makes your changes live on the website. Changes made to layout, design and functionality are not live until this button has been clicked. Once the button has been clicked, you will see a pop-up message indicating that your changes have been saved you will be allowed to continue editing.
View Live: The View Live button is located at the top right of your Site Designer page. This button shows the live version of your site. It is similar to the Preview function, but shows actual URLs for your pages. This allows you to view the final results of your changes.
Themes are a quick and easy way to create the desired look and feel of your site. From the Theme section of Site Designer you can view available themes, browse and add new themes and even create a custom theme. For more information on adding a theme, click HERE.
Adjusting Design Settings
The Design Settings feature allows you to easily make changes to your current theme's global settings, such as colors, fonts and sizes and components such as buttons. You can access it by clicking the Design Settings button located at the top center of the Site Designer page. Clicking this button will open a navigation menu on the left side of the Site Designer page which can be used to make changes.
For specific information on making changes using Design Settings, click HERE.
Specific pages can also be accessed from Site Designer. A list of the pages that are available to be edited and published is located on the drop-down menu at the top center of the Site Designer page. You can also add a page from this menu. Pages added via the menu will appear as options in the drop-down after they are created.
Current options for editing include the Master Template, Categories, the site's Home Page, the Page Not Found (404 Error) page, Product Details and Search Results. Keep in mind, that any pages you have added will also be listed in the drop-down menu.
Adding a Page
For many merchant's adding a custom page is a great way to get specific and important information to your customers. V2 makes it easy. From the Page Edit menu at the top center of the Site Designer page, open the drop-down menu and choose Add a Page.
You can now add a Page Title and Page Path (your page's custom URL) as well as SEO information including Title and Description for you page to the Blank Page section on the left side of the Site Designer page. Click the Done button at the bottom of this section when you have all of your page information ready and your page will be created.
Editing the Master Template versus the Home Page
You have the option of editing both the Master Template and your site's Home Page. An easy way to distinguish between the two is to remember that any changes made to your Master Template will be applied to ALL pages on your site. This includes things like the site's Header and Footer, which appear on all the pages within the site. Editing the Home Page allows you to make changes to blocks that appear only on that page, such as the Slideshow, the Featured Products or the Text with Image block.
Additionally, any sections featured on the Master Template will show a green Edit Template button when you hover over them, which you can click to make any desired edits.
Sections from other pages, such as the Home Page will feature a white Edit button when you hover over them.