The Variables in the Page Layout section control the presence, positioning, and appearance of all the major elements on a page, including elements which appear in the Head, Body, and Navigation Bar. Changing a Page Layout field can have a dramatic effect on the look of your Store Editor pages.

• The position of the navigation bar (using the Page-format control)
• The width of the page (using Page-width control)
• The appearance of the Head section (using the Head-elements and Head-style controls)

• Page-format
• Page-width
• Name-image (located in Header variables for Editor 3.0)
• Column-width
• Row-pad
• Bullet-image (located in Body Content variables for Editor 3.0)

Page Layout Variables common to both Editor 2.0 and Editor 3.0 include

• Head-elements
• Head-style
• Columns
• Contents-elements
• Contents-format

Page Layout Variables specific to Editor 3.0 include

• Page-layout
• Item-image-align

Editor 2.0 only variables

Page-format (Editor 2.0 templates): Use the drop-down menu to select the position of navigation buttons in your Store pages, either top buttons or side buttons. Figure 1 below shows an example of a page in each format.

Page-width (Editor 2.0 templates): Enter a number (in pixels) to set the width of your pages when page-format is set to side-buttons. Note: When page-format is set to top-buttons, the page width is determined by the width of the navigation bar which includes the number of buttons, the font size and the button padding.

Name-image: Click "Upload" to upload a store logo image. This logo will appear at the top of your pages. Click "None" to delete a logo you no longer wish to use. Note: You can use a text-based logo by entering your store name in the Title Variable field.

Tip: If you do not wish to use a logo, but you also do not wish to display a text-based logo from the Title variable, you can upload a 1 pixel transparent GIF image in the Name-image Variable.

Column-width (Editor 2.0 templates): Use the drop-down menu to select a column width. Select "fixed" to set all columns to a fixed width. Select "variable" to have the width of columns adjust based on the contents.

Row-pad (Editor 2.0 templates): Enter a number to set the number of pixels of padding (space) between rows. Leave the field empty to default to the minimum padding.

Bullet-image: Click "Upload" to upload an image to use for bulleted lists. If no image is uploaded, bullets will appear as squares in the same color as the home-button color. To remove a bullet-image you have uploaded, click "None".

Variables common to Editor 2.0 and Editor 3.0

Head-elements*: Select items from the list box to choose what to display directly beneath the Name-image: the Display-text title (pulled from the page's Headline field or from the Name field if no Headline is entered), the Image field, or both. By default, both Image and Display-text title are selected. Click an item in the list to select, and press Ctrl while clicking to select multiple items.

Notice that omitting one of the Head-elements creates more white space on a page or makes the page appear more compact, depending on the size of the element being omitted or the amount of text in the Caption.

Head-style*: Use the drop-down menu to select the arrangement (left, center or right) of the Image and Title fields of section and product pages.

Columns*: Enter a number to represent the number of items displayed in each row. For example, if a section page had six items, setting columns to 2 would display three rows with two items per row. Setting columns to 3 would display two rows with three items per row.

Contents-elements*: Use the selection box to set control which elements of your products will appear on your Item and Section pages in your Store. Each Content (or product), you create in your Store has many attributes which you can enter. These attributes include the Price, Image, Caption and Title (product name), as well as others.

For purposes of layout, you can control which of these elements will appear on your section pages. This allows you to control which attributes of your products are displayed on your section pages--not on the product pages themselves. This can be useful for a link to an item on a section page that does not need to display every piece of product information.

In order to change which elements in this field are used, press and hold the "Ctrl" (Control) button on your keyboard and click on the elements you wish to appear. This will allow you to select multiple elements. If the "Ctrl" button is not used, only one element at a time will be selectable. Selected items will appear highlighted in blue. For Macintosh users, you will need to hold down the "Apple" button while clicking on the desired elements.

When finished selecting, click "Update" on the Variables page and re-publish your Store. For page specific Contents-elements changes, you may use the "Override Variable" feature to change this setting on any single Item or Section page.

• The Item's thumbnail image or a bullet image if no product image has been uploaded
• The Item's Name in screen text
• The Item's Price and Sales-price (if applicable)

You can also select to add any of the following fields:

• Display-text-title - An image created from the Title field entry
• Abstract - Entered in the Object Properties section on the Item or Section Edit page
• Caption - Entered in the Object Properties section on the Item or Section Edit page
• Price - Entered in the Object Properties section on the Item Edit page
• Order - Displays the Order button for the Item
• Contents - Displays the items or sections along with their contents

Contents-format*: Use the drop-down menu to select how all Contents-elements are displayed:

• Vertical - All the Contents-elements are arranged in a column, center-aligned, as in Figure 3.
• Ell - The Image thumbnail is displayed on the left side of the column in its own table cell. The remaining Contents-elements are displayed to the right of the Image thumbnail in their own table cell. This is the default setting, which you can see in Figure 3.
• Wrap - The Image thumbnail is displayed on the left side of the column, and the remaining Contents-elements are displayed to the right of the Image thumbnail (see Figure 4). In the Ell setting the text in the rest of the "non-Image" Contents-elements is so long that it reaches the bottom edge of the Image thumbnail. Here, however, it continues immediately underneath the image, giving the appearance of "wrapping" around the thumbnail image.
• Pack (Deprecated for Editor 3.0)- In this setting, only the Item's Image (or Icon) is displayed at its actual size, rather than the size specified by the Thumb-height and Thumb-width Variables.

Editor 3.0 only variables

Page-layout: Enter the size in pixels of the page width (top navigation templates only).

Item-image-align: Enter a value (left or right) to set the alignment of the Image and Inset on only the item page. Figure 5 shows Item image set to "right".

Note: These fields only apply to pages where the "Leaf" field is set to "No" (default). If set to "Yes" then these fields are set on the Config page of the Store Editor.

See Also

• Variables Overview
• Account Variables
• Color and Typeface Variables
• Image Dimension Variables
• Button Properties Variables
• Page Properties Variables
• Store Properties Variables
• Custom Variables
• Overriding a Variable