Visual Menu Pages

Visual Menu Pages display a thumbnail menu system offering customizable row and column layouts.

Visual Menu Content options define the display and behavior characteristics of row and column thumbnails on Visual Menu Pages.

The image width and aspect ratio for each thumbnail image on a Visual Menu Page is dynamic and is therefore not configurable. The thumbnail image width and aspect ratio is based on the height of each row, the number of columns, and the width of the browser viewport.

Note: First, create all pages the Visual Menu Page will reference, and then use the Visual Menu Content settings to connect those pages to your Visual Menu Page.

Available for: Visual Menu Page.

---

Add Row

The Visual Menu Page thumbnail grid supports unlimited rows.

Row height is defined globally with the Row Height setting under Visual Menu Page settings. Row height can be managed on individual rows using the Row Settings tool in the Visual Menu Content area.

To add rows to a Visual Menu Page:

1. Sign in to your Good Gallery administrator account.
2. Hover your cursor over the Pages menu.
3. Under the Your Pages menu heading, choose the appropriate page.
4. Scroll down to the Visual Menu Content section under Page Settings.
5. Click the Add Row button.
6. Locate the new row that was automatically added above all available rows.
7. Use the settings and select the Page Link from the dropdown list, choose the Thumbnail Image, and type informative text in the Label and Tagline fields.
8. Click the Save Changes button.

---

Add Headline

Headlines display interstitial text between rows of thumbnails on a Visual Menu Page.

To add a Headline on a Visual Menu Page:

1. Sign in to your Good Gallery administrator account.
2. Hover your cursor over the Pages menu.
3. Under the Your Pages menu heading, choose the appropriate page.
4. Scroll down to the Visual Menu Content section under Page Settings.
5. Click the Add Headline button.
6. Insert the appropriate text in the Headline field.
7. Click the Save Changes button.

---

Add Column

The Visual Menu Page thumbnail grid supports unlimited columns.

Note: For superior performance across all potential browser viewports, limit your configuration to 5 columns.

To add a column on a Visual Menu Page:

1. Sign in to your Good Gallery administrator account.
2. Hover your cursor over the Pages menu.
3. Under the Your Pages menu heading, choose the appropriate page.
4. Scroll down to the Visual Menu Content section under Page Settings.
5. Click the Add Column button on the row where you would like to add an additional column.
6. Click the Save Changes button.

---

Remove Row

To remove a row from a Visual Menu Page:

1. Sign in to your Good Gallery administrator account.
2. Hover your cursor over the Pages menu.
3. Under the Your Pages menu heading, choose the appropriate page.
4. Scroll down to the Visual Menu Content section under Page Settings.
5. Click the Remove Row button on the row you want to remove.
6. Click the Save Changes button.

---

Remove Column

To remove a column on a Visual Menu Page:

1. Sign in to your Good Gallery administrator account.
2. Hover your cursor over the Pages menu.
3. Under the Your Pages menu heading, choose the appropriate page.
4. Scroll down to the Visual Menu Content section under Page Settings.
5. Click the Remove Column button on the row where you would like to remove the column.
6. Click the Save Changes button.

---

Row Settings

The height of rows can be controlled globally with Visual Menu Page settings or on a per-row basis via Row Settings.

Values assigned to individual rows via the Row Settings tool override the global Row Height values defined in Visual Menu Page settings.

To change the height of individual rows on a Visual Menu Page:

1. Sign in to your Good Gallery administrator account.
2. Hover your cursor over the Pages menu.
3. Under the Your Pages menu heading, choose the appropriate page.
4. Scroll down to the Visual Menu Content section under Page Settings.
5. Click the Row Settings button on the row you want to modify.
6. Choose the desired height of the row using the dropdown provided.
7. Click the Set button.
8. Click the Save Changes button.

Desktop Row Height

Indicate the selected row height for desktop devices.

Mobile Row Height

Indicate the selected row height for mobile devices.

---

Link Page

The Link Page option indicates the destination page when a visitor clicks on a Visual Menu Thumbnail.

Gallery Pages, Text Pages, URL Link pages, and other Visual Menu Pages are supported with this option.

To create links to other pages via a Visual Menu Page:

1. Sign in to your Good Gallery administrator account.
2. Hover your cursor over the Pages menu.
3. Under the Your Pages menu heading, choose the appropriate page.
4. Scroll down to the Visual Menu Content section under Page Settings.
5. Choose the appropriate page from the Link Page dropdown list.
6. Click the Save Changes button.

---

Labels

Primary Label

Primary Labels are displayed as informative text above or alongside thumbnail images on Visual Menu Pages.

Font characteristics like contrast and readability are managed with Primary Label Typography settings. Dark text performs better with light thumbnails. Light text performs best with dark images.

To add a Primary Label to a Thumbnail:

1. Sign in to your Good Gallery administrator account.
2. Hover your cursor over the Pages menu.
3. Under the Your Pages menu heading, choose the appropriate page.
4. Scroll down to the Visual Menu Content section under Page Settings.
5. Insert the appropriate text in the Primary Label field.
6. Click the Save Changes button.

Secondary Label

Secondary Labels are displayed as informative text immediately below Primary Labels on Visual Menu Pages.

Font characteristics like contrast and readability are managed with Secondary Label Typography settings.

To add a Secondary Label to a Thumbnail:

1. Sign in to your Good Gallery administrator account.
2. Hover your cursor over the Pages menu.
3. Under the Your Pages menu heading, choose the appropriate page.
4. Scroll down to the Visual Menu Content section under Page Settings.
5. Insert the appropriate text in the Secondary Label field.
6. Click the Save Changes button.

---

Thumbnails

The Thumbnail is the clickable image in the menu area of Visual Menu Pages. Thumbnails are small images that represent large images, typically displayed in groups allowing visitors to view multiple images simultaneously.

When the Link Page is a Gallery Page, the Thumbnail is automatically set to the first image in the linked Gallery Page folder. When the Link Page is a different Page Type, a default Thumbnail is not automatically assigned.

Choose Image

Thumbnail image selections are modified using the Choose Image button. Choose the image from All Folders.

Thumbnail Recommendations

Simple Images -- Choose images with basic compositions, simple content, and substantial white space around the subject matter. As page dimensions and Thumbnail dimensions will vary based on the visitor browser viewport, pick images that work best at any dimension.

Dimensions -- Ensure the original image size for selected Thumbnails meets the minimum image dimension recommendations. Thumbnails may appear blurry or pixelated if the original dimensions of the selected image are smaller than the recommended minimums.

Focal Area -- Thumbnails expand and contract dynamically to fill horizontal and vertical space based on the browser viewport size. Use the Focal Area tool to control what areas of the image are always visible on your Visual Menu Page.

Aspect Ratios -- For best results, choose images with similar aspect ratios to the Thumbnail viewport area. For example, uncropped photos in landscape orientation from most modern SLR cameras are 3:2 ratio.

Contrast and Readability -- When Primary Labels or Secondary Labels overlay Thumbnails, use Typography settings to change the color and transparency of label text. Increasing image opacity using Thumbnail Transparency settings can improve label readability.