Search

sections


Step 3

Design

Customizing your store’s look and feel is a key component to standing out from your competition. This section of the manual will cover two major design topics: choosing a store template and configuring your logo.

Many other design functions and features will be covered in detail in the “Advanced Settings” section of this manual.

 

Store Template

An online store’s look and feel influences a visitor’s initial impression of its professionalism and competency. A well-designed store reassures visitors and helps convert them from browsers into customers. The most important visual aspect of the store is the template: the navigational framing device that remains constant throughout most pages of the website.

Choosing a Template

Choosing a look and feel for your store is a major decision. We've provided the design wizard to make this process as smooth and fluid as possible. In the admin area, click Design >>Template.

Here, you’ll see a My Templates tab. By default, a few templates are displayed in this area for you to try. Simply click on the template name to preview a thumbnail of the template on the left side.


Previewing a Template

You can preview the selected template prior to applying it to your storefront. Click Preview to open  a new browser window with the selected template applied to your storefront. Note that the save you are currently viewing is not yet saved.

Publishing a Template

Once you’ve selected your template, simply click the thumbnail in My Templates and click Publish. After a few seconds, your new template will be applied to your  store.


Downloading More Templates

There are many more options for you to choose from besides the defaults. Click Free Templates to browse through the gallery, using the Next and Prev buttons. Note that some templates have color swatches to allow you to preview color variations.  


To download a new template to My Templates, click Install. From here, you can choose the new template, preview it or publish it to your store.


A Note on Custom Designs

If you have a specific design in mind, or if you’d like a professional designer to create one for you from scratch, check out Volusion’s custom design services at http://www.volusion.com/web-design-pricing.asp.


Accessing the Winter '09 Templates

Winter ’09 allows you direct access to template files through the admin area or through FTP. To access templates through the admin area, click Design >> LiveEdit File Editor. Here, you’ll see Shortcut files on the right side that link to your template files. 


The names correspond to the name of the template installed in the design wizard. The “template_XX.html” file contains programming for the template’s header, footer and navigation.  The “template_XX.css” file contains template CSS, which primarily allows you to modify the look of the text.

 

To access template files through FTP, review the “Email & FTP Setup” portion of this manual. For more advanced template features, check out our online training video.


More Template Options

Besides our free templates, Volusion also offers a selection of premium design templates you can purchase directly online at http://www.volusion.com/web_design.asp


Just as an overall site design can define an entire user experience to your visitors, your logo is equally as important. It represents your company and is a vital part of your brand.

 

Winter ‘09 makes it easy to add custom website logos to your store header, emails and invoices. To add logos, click Design >> Logos in the admin area.

From here, you can create a simple text logo, upload a graphical logo and even
upload an image for your emails and invoices.

Adding a Store Logo

You can use wither a text-based or an image-based logo for your store. By default, the store is configured to use a text-based logo in the header of the storefront.

  • On the Logos page, select the Text option under Logo Type.
  • Enter the exact text you’d like to display as the logo.
  • Click Save to apply.
 
Items to Note

By default, the text logo size, font and color are determined by the store template’s style properties. You can modify these in the template’s CSS file.

 

To add a graphic logo:

 
  • In the Logos page, select the Graphic option under Logo Type. 
  • Enter the path to the graphic file on your local hard drive, or click Browse to locate it.
  • Click Save to apply.
 
Items to Note

Volusion only supports .GIF and .JPG image formats for use as website logos. Any other image format (e.g. .BMP, .PNG, .TIF) aren’t supported.



A Note on Graphic Logo Sizes

Consider the size of your graphic logo carefully. A prominent, bold logo can instantly capture your visitors’ attention, but the wrong logo size can cause a negative impression. For each Volusion template, suggested sizes are provided for the logo graphic.

 

Below the current Website Title and Website Heading Logo preview images, you’ll see a recommended size displayed (in pixels). For example, a recommended graphic size of 800x150 is 800 pixels wide by 150 pixels high. If you logo doesn’t match these dimensions, you can change them with a graphic editing program like Adobe Photoshop, Picasa or Corel Paint.


Adding an Email / Invoice Logo

Adding a logo to automatically-generated order invoices and emails is as simple as adding a logo to the store header. By default, if you chose to add a text-based logo to your site, your logo will automatically be added to your invoices and emails as well.

 

To add a graphic logo to your invoices and emails, simply enter the path to the image file on your local hard drive or locate the file by clicking Browse. Then, click Save to apply the graphic.

 
 
Items to Note

To use a graphic logo on store invoices and emails, you must enable the Graphic option within the Logo Type setting of the Logos page. Furthermore, all invoice logos must be of .GIF file format and can be of any size.

 


Go to top of page
Go to next section