Customizing Your Store
Click here if you would like to see a complete mapping of all the images used in Volusion's E-commerce Solution.
Uploading Your Logo
A quick and easy way to brand your store in a professional way, is to upload your logo.
- From the home page of the admin area, navigate to Design —> My Logos
- Next to "Website Heading Logo" Select "Graphic" and browser for the image file on your computer.
- Click on "Save Changes."
Website Heading Logo
This is the image file that will be placed at the top of your page.
Why does my logo repeat across the top of my website?
The logo you are referring to is the Website Heading Logo, which must be imprinted on a background which is 1600 pixels wide. We recommend that you go to the above mentioned My Logos page and scroll down just a bit where you will always see a sample image with NO logo on it, ready for you to download by right-clicking on it and choosing Save Picture As. This will allow you to save this blank background image to your computer, which you can then open in your favorite graphics editor and imprint your logo on top of it. Once you have placed your logo onto this graphic, just re-upload the graphic from this My Logos page.
Invoice Logo
This is the graphic file that will be included in your store's order confirmation e-mail to customers, as well as on receipts, invoices, POs sent to vendors and e-mail newsletters generated by the store. While this image does not have a fixed size, we recommend keeping the dimensions of this image within reasonable limits, as it will be included in customer e-mails, etc.
Favicon Icon
If you need to upload a Favicon Icon, you can upload the file by clicking on the link in Design -> My Logos that says Have a favicon.ico?. When you click on that link, an upload box will appear for you to browse and upload your file.
Changing Your Website Design
Navigate to Design —> Choose Template, from the home page of your admin area.
You may change the look and feel of your site by installing a new Template. A website design includes of all the graphics on your website, plus the color scheme of your website which includes many of the text colors and background colors on your website. Be aware that applying a website design will reset all of your custom changes back to the default of the template.
You may get a new website design by:
- having a web designer build one for you
- downloading a design from the Volusion e-Commerce Design Gallery at http://www.volusion.com/DesignGallery.
Your default website template is located in your store directory vspfiles/templates/1/. For more in-depth guides on how to design your own template, visit
http://www.volusion.com/university.
Navigation Menus
Click Design —> Navigation Menu, from the home page of your admin area.
If you have one of your menus set to rollover_colors_pop-out, that is the only time you will have to pay attention to the field titled Vertical Offset on this page. The determines the absolute positioned height of the JavaScript menu. The menu is designed to be compatible with only certain templates. If you are using the default Blue New Edge template the vertical offset should be set to 125. If you are using the Audio Gear template the vertical offset should be set to 154.
Custom Fields on One-Page Checkout
Navigate to Settings —> Custom Fields from the home page of your admin area. You may edit any of the existing sample custom fields, or add your own by clicking on "ADD". Make sure you click on the [?] box next to each field if you have any further questions.
- Choose a table name
- Customers — This field will only show up the first time the customer places an order. Example question: "How did you hear about us"?
- Orders — This field will show up on every order. Example question: "Do you agree to our terms and conditions"?
- Assign an alias Note: This will NOT show to the customer. Only for your reference
- Fill out Question, Input Type and Input_MaxLength. If you choose Drop down for Input Type, the values for your drop down can be set later by clicking on Custom Fields Dropdown Values.
- You can make your field required by checking Is_Required. This will force the customer to fill out the custom field.
- Make sure to check Is_Public for this field to show on the one-page-checkout for the customer
- Enable Show_On_Invoices if you want the custom field to print on the invoices
Customizing Your Template
Note: Before customizing your template you should install the free template that best matches your desired layout. Using a template that is close to your layout will make the integration process much easier.
To view your design files go to Design —> Live Edit File Editor. Under design files you will see the different files that you need to make custom changes to your store's template. The template.html file handles the header and footer sections of your site. It is also the file you would use to add additional navigation menus.
Currently, the Volusion software allows you to have up to eight separate navigation menus in your shopping cart but images are only available for the first two. Any images for additional navigation menus would need to be uploaded to the images directory for your template.
The colors and fonts for each navigation menu are pulled from the color variables under Design —> Navigation Menu. You will need to edit the .CSS files in your store to change the colors of the navigation menus you add yourself.
To use a custom splash page that is completely separate from your store all you have to do is place the HTML code of your splash page to default.htm, which is available in the Live Edit File Editor. under the section labeled Shortcuts.
Note: In order to connect to your store you must have a link pointing to default.asp on your splash page.
Previewing your changes
The software allows you to also make changes to your site and preview them without those changes appearing on your store front. To be able to do this, follow the below steps:
- Navigate to Settings —> Config Variables
- Un-check the variable Config_Enable_Publish_Always_By_Default
- Click Save Changes at the bottom
With this variable turned off, if any changes are made in your store, they will not become live on your site until you publish. For example, if changes are made to the template or CSS files, they will not be reflected on the site, however you can preview your changes by navigating to Design —> Choose Template and then clicking the Preview button. This will display what your site would look like with the existing changes. Once you are satisfied, click the Publish link in the top left corner of your administration area.
Navigation Menu Promotions
Note: Navigation menu links are controlled by the Categories table. Navigation menu promotions are an additional way to insert customized links and promotions into your navigation menu.
The below screen shot shows what fields are available when adding a new navigation menu promotion. See the list below the screen shot for additional information on each field
- ID - This is the internal ID number the system uses to keep track of Nav Menu Promotions. This number is automatically generated by the system.
- Group - This is the group name for this promotion. If you are creating a new promotion, set this to Misc
- Notes About This Special - Used to make notes that are only viewable by administrators
- Body -This is where you create your promotion. You can use plain text and / or HTML code
- SpecialOrder - Used to assign a numeric value that determines the order in which your navigation menu promotions appear from top to bottom
- Hidden - Enabling this field allows you to temporarily hide the promotion instead of deleting it