AShop V Design Guide AShop Software © Copyright 2011
AShop V Design Guide Table of Contents 0 Part I Overview Of AShop 3 Part II Designguide 3 1 Page Templates ................................................................................................................................... 5 Design Your Page .......................................................................................................................................................... Templates 7 Placeholder Codes ..........................................................
Overview Of AShop 1 3 Overview Of AShop AShop is a shopping cart program, which can be used in a variety of different ways to manage and sell products and services over the Internet.
AShop V Design Guide AShop Software © Copyright 2011
Designguide 2.1 5 Page Templates The AShop page templates are simply HTML pages with the AShop placeholder tags inserted where the AShop content is to appear. They can include HTML, images, links, CSS, and JavaScript just like any other web page but they can not include PHP or any other server side code. You can use a web page editor, for example Adobe Dreamweaver, to design or modify the AShop templates just as you would with any other page for a website.
AShop V Design Guide Wholesale Shopping Cart & Sign up Page Templates These templates are used by the wholesale pages. wscart.html - used by the wholesale basket and checkout pages wssignup.html - used by pages where wholesale customers sign up for an account wsthankyou.html - used to display a thank you message page after a customer completes a wholesale order Shopping Mall Page Templates aboutvendor.html - used to render About Us pages for the member shops mall.html - used by mall.
Designguide 2.1.1 7 Design Your Page Templates Start by designing a page with an empty area that can be used for content such as signup forms, login forms or shopping cart contents list. You can use any web page editor or design tool you like, for example Dreamweaver or Microsoft Expression Web. Here is an example of a page template designed in Dreamweaver: Add the two comment tags: and to the empty area of the page.
AShop V Design Guide Note: The templates must use paths relative to the root folder of your AShop, not the templates folder. If you design your templates while keeping them in the templates folder of a local copy of AShop you may need to remove "../" on image src parameters, link and CSS href parameters and any other code that refers to a local file, before publishing and using the templates.
Designguide 9 You can override any of the styles generated by the AShop CSS script to tweak and customize all the design elements in great detail. A copy of all the CSS classes is included in the sample ashop.css file, found in the css folder. Just make sure you put any style tags or custom CSS files below the default AShop CSS tag in your templates and storefront files to make them override the default classes.
AShop V Design Guide Several of the special storefront placeholder codes have both a start tag and an end tag, which means that you can actually put example categories or example products in the boxes to get a good overlook of the design and have this content automatically replaced with AShop generated content when the template is used by your shopping cart. 2.2.
Designguide 2.2.2 11 Newsletter Module If you are using the Autoresponder-Service.com account that is included for free with your full AShop V license, you can enable the newsletter module to let visitors sign up with your mailing list, which can of course be an autoresponder. You need to select the list you wish to use for this on the Configuration>Shop Parameters page to make it work.
2.2.
Designguide 13 This is an example of how it will look: You can also add a similar box that will allow your customers to select which currency to view your product prices in. The currency rates are automatically updated and changing to a different currency than the one you used when you set your prices should give a correct price in the selected currency.
AShop V Design Guide links: This will show a breadcrumb navigation line, with links to the current caregory and its parent category: This will show a list of categories in a directory type of view that changes to show the subcategories of the current category when one is selected, which will work well together with the breadcrumb navigation line: The storefron
Designguide 2.3 15 Top Lists The top list module will show a list of top selling products and/or the newest products in the catalog. The scripts that produce these lists may be included in... · page templates · any custom web page of your choice There are two ways to include the lists, either through Javascript or a template placeholder code. This is how to use the Javascript version... And this is how to use the template placeholder code...
AShop V Design Guide Show just the latest additions... Number of Products Shown If not otherwise specified, the top.js.php script will display the last 10 new products and latest additions. To display a lower number of products, add the parameter "items=x" where x is the number of products to display. This include will display the 5 most popular and latest additions:
