In this Guide: Designing Your Storefront
Summary
The Site HTML editors allow you to customize every element of your online storefront. The MonsterCommerce shopping cart software will dynamically pull each individual component (such as Top of Page, Left Column, Right Column, etc.), as entered in HTML code or through the WYSIWYG tool, and combine all of the individual components to create your complete storefront display.
Display Option Drop Down
The Display Option drop down menu is found throughout the HTML administration area, under the Design Manager section. This allows you to indicate whether you want to display custom HTML, default navigation or graphics, or a combination of both.
Display Option Key:
- Only Default - Ad/Logo/Ad setup will be used
- Use Only Custom - HTML in box is used
- Use Both Default and Custom - Shows both
Top of Page HTML Editor
This menu controls what is displayed in the top area of your storefront. This menu will allow you to display the default logos and ads you can set up in the Logo Editor, and Ad Editor, or allow you to display only custom HTML that you enter here. You may also display both.
Note: When using Custom HTML, be sure not to reference images using non-relative path statements or pop error messages will occur when entering secure portions of your website. Always refer to an image using relative addressing like this:
- Incorrect (absolute path)
SRC= http://www.site.com/images/image.gif- Correct (relative path)
SRC= images/image.gif
Left Column HTML Editor
The Left Column HTML Editor allows for custom HTML to be placed in the left hand column of the storefront. You may display only your custom HTML, or a mix of dynamically generated menu items and your custom HTML. The dynamically generated menu items are comprised of the categories in your storefront. Links are dynamically created as well, to take visitors through categories, subcategories, product groups, and products.
Homepage Messages Editor
This area allows you to edit or add messages that appear at the top of the front page of your site. Type in your message and click Add button to add a new message, or edit a current message and click Save to make changes take effect. If you insert more than one message, use Sort Order to indicate which order they should appear within your storefront.
Right Column HTML Editor
The Right Column HTML Editor allows for custom HTML to be placed in the right hand column of the storefront. You may display only your custom HTML, or a mix of dynamically generated menu items and your custom HTML. The dynamically generated menu items are comprised of the categories in your storefront. Links are dynamically created as well, to take visitors through categories, subcategories, product groups, and products.
Homepage News Editor
This area allows you to edit or add news that appears at the bottom of the front page of your storefront. This information will appear just below your home page specials. Type in your news message and click the Add button or edit a current message and click Update to make changes take effect.
Custom Pages Editor
The Custom Pages Editor allows you to create your own custom pages that will maintain a consistent look and feel with the rest of your storefront.
Steps to a Custom Page:
- Type in the Title of the page you wish to create. This is the title that will be displayed to site visitors when they open this page.
- Click the Add Button to add this page to your list of Custom Pages.
- You will see your Page Title and URL listed at the top of the page, with both an Edit and Delete button to the right.
- Click the Edit Button to modify the page.
- Type in your Custom HTML in the large box provided.
- Click the “Save” Button.
- Once you have returned to the Edit Custom Pages screen, click on the link next to the page you just created to test your HTML.
- If the HTML is acceptable, copy (CTRL-C) the URL from your browser's Address Box to the clipboard of your computer and paste (CTRL-V) the link into the Link Editor, or into your custom HTML. If you need to change the HTML, click on the edit button and go back to Step 2.
To edit custom pages, locate the page you wish to edit, and click the corresponding edit button.
Bottom of Page HTML Editor
This area allows you to edit or add the copyright information that appears at the bottom of every page of your site. Type in your message and click Add to add new copyright information, or edit a current message and click Update to make changes take effect.
Company Information Editor
This area allows you to create or edit the information that appears when a customer clicks on the Company Info link in the horizontal navigation bar of your site.
Note: The Horizontal Navigation Bar must be enabled for this page to display automatically. In addition, you can always call the page directly by pointing a link at:
http://www.site.com/index.asp? PageAction=COMPANY
Where the www.site.com is the domain name of your store.
Contact Us Editor
This area allows you to create or edit the information that appears when a customer clicks on the "Contact Us" link in the horizontal navigation bar of your site.
Note: The Horizontal Navigation Bar must be enabled for this page to display automatically. In addition, you can always call the page directly by pointing a link at:
http://www.site.com/index.asp? PageAction=CONTACTUS
Where the www.site.com is the domain name of your store.
Log In Page HTML Editor
If you sell wholesale or offer multiple price levels to customers based on login,
you may wish to customize the dynamically generated login page. You have the ability
to add text or custom HTML to both the header and footer of the login page. Add your
custom HTML or text to each of these areas by pasting the HTML in the appropriately
labeled boxes. Go to http://www.nameofyoursite.com/index.asp?PageAction=LOGIN
to view your page.
Product Gallery HTML Editor
The Product Gallery HTML Editor allows for custom HTML to be placed in the Top and Bottom of the Product Image Gallery pop-up windows. You may display only your custom HTML, which will be a global display throughout all Product Image Gallery windows. Your custom HTML will be displayed once the Image Gallery windows are opened from any detailed product display page on the storefront.