Layout

Top  Previous  Next

 

From the AShop Administration main menu, click Store Configuration on the left side menu. This will open the Configure AShop menu. Click on the "Layout" link.

 

clip10049

 

clip10050

clip10051

 

Upload Logo Image

This logo image file will be displayed on any page that does not have an HTML page template attached to it. The main pages will use a page template if present. If a page template is not present, the logo will appear at the top of the page. Some message pages do not use templates and will always display the logo image at top of the page. The language selection page also displays the logo image.

 

Theme Selection

A theme is a canned set of design components. Each theme typically includes a set of page templates, a set of button images, and a configuration file, which sets the Layout parameters. When a theme is not selected, the root page templates, button images, and Layout parameters are used for shopping cart pages. Themes and buttons are available to download from AShopSoftware.com.

 

How To Set Colors

Colors can be selected by clicking on the color selector icon clip0037, which is on the right side of each color setting.

 

clip10052

The colors can also be set by entering the hexadecimal equivalent into the color text box. AShop Deluxe does not include an eyedropper to sample and convert colors in the page to hexadecimal, but Dreamweaver, PhotoShop, and other similar programs include a color sampler/converter, which can be used to get the hexadecimal number for colors that are not web standard. Just open an image containing the color that you want in one of these programs and use any of the color selector tools to activate the eyedropper tool.

 

clip10053

 

Notes about Layout settings

 

Layout settings can be overridden by the presence of settings in AShop HTML page templates and style sheets.

 

Some pages do not use page templates. For instance add to cart confirmation windows and attribute selection windows do not use a page template and will always use these settings.

 

Page Body Colors

 

Background Color

This sets the body background color of web pages that are created by the shopping cart program.

 

Text Color

This is the default text color for shopping cart pages.

 

Link Color

This is the text color of link text for shopping cart pages.

 

Alert Color

Controls the text color of product alert messages such as the filesize and filetypes text for downloadable products.

 

Forms Colors

Forms Background Color

This field sets the background color in forms used to collect shipping and billing information.

Forms Text Color

This field sets the text color used in forms that collect shipping and billing information.

 

Product Layout & Colors

 

Item Border Color

The products are displayed in the catalog within tables (boxes). The border color of these tables is set here.

 

Item Border Width

This field sets the width of the table borders, in which the products are displayed.

 

Item Background Color

This field sets the background color of the tables, in which the products are displayed.

 

Item Text Color

This field sets the text color of the tables, in which products are displayed

 

Condensed Layout

With the standard layout product listings are separated by borders and there are line breaks between the product names, descriptions, price, etc. When condensed layout is selected the product listings so not have as much space between them. Instead of table borders, each product listing is separated by a horizontal rule. This layout is desirable when there is a large number of product selections.

 

standard layout clip10054

 

condensed layout clip10055

 

Category Colors

 

Category Color

The categories have two different background colors to differentiate ones that are not selected from the one that is selected. This field sets the color of the categories that are not selected in the product catalog.

 

Category Text Color

This field sets the text color within a category.

 

Selected Category Color

This field sets the color of a selected category in the product catalog.

 

Selected Category Text Color

This field sets the text color within a category that is selected.

 

Other Settings

 

Font

This field sets the default text font style that will be used for text within the affiliate pages and in the product descriptions within the catalog.

Click clip0036 to select from a list of fonts.

 

Text Size

The small, medium, and large text sizes are set used

 

Table Width

The Regular and Large table (width) size settings in the Store Configuration->Layout page are applied to tables in the catalog and view cart pages. The table size settings are applied through CSS, which makes it possible to override them and modify the style options through style sheets. The two table size classes are called "tablesize1" (default is 700 pixels) and "tablesize2" (default is 500 pixels).

 

Thumbnail Image Size

 

It's best to set this initially with the size that will be used for all of the product thumbnail images when displayed in the shopping cart catalog. Note that the images always appear in 100 x 100 pixel size within the Administration Panel > Edit Products.

 

When images are uploaded in Add Products or Edit Products, the images are resized to the current Thumbnail Image Size setting. Original images that are larger than the thumbnail size will be resized to fit. Original images that are smaller than the thumbnail are not stretched. In cases where the original image size is smaller or a different ratio of width and height than the thumbnail size, there will be blank space around the image. To preserve the aspect ratio the blank space in the resulting image will be filled with the current "Item background color", which is set in Layout > Product Layout and Colors.

 

Note: For the thumbnail image resizing and optimization to work, the version of PHP on the server must be 4.3 or higher and GD or ImageMagick must be installed on the server. AShop will check if these features are available and use one. GD is an additional PHP library that is typically installed on most servers. Not all versions of the GD library have support for saving gif images so AShop checks and if it isn't available, all of the thumbnail images will be converted to jpeg. ImageMagick is a similar software that may be installed on some servers. If both GD and ImageMagick are available, AShop will use IMageMagick.

 

Link to large original image

 

If the thumbnail image is automatically resized by GD or Imagemagick, this setting will, when activated, keep the (if more than 20%) larger original image file AND create a link above the thumbnail image, which will open the original larger size image in a new browser window. The default text "Click to enlarge" may be edited in the catalogue.inc.php file for each language. This feature is in addition to the preview files, which may also be uploaded through the product Files menu.

 

clip10122