This procedure is intended for Page Designer administrators who want to promote the Clinic Locator from another page without displaying the full Clinic Locator Map directly on that page.

The Clinic Locator Banner is a specialized promotional component. Its purpose is to provide visitors with a visually prominent entry point to the Clinic Locator when clinic discovery is not the primary purpose of the page.

Objective

The Clinic Locator Banner component is designed to promote and drive traffic to the Clinic Locator.

It acts as a teaser or entry point rather than displaying the clinic network directly.

The component combines:

• A large visual
• Short content or title
• An optional inverted text color
• A CTA
• A predefined destination to the Clinic Locator

Unlike a general-purpose banner, the Clinic Locator Banner has a specific and fixed purpose.

It cannot be repurposed to promote another page because its destination is already embedded within the component.

Clinic Locator Banner vs. Clinic Locator Map

The Clinic Locator Banner and Clinic Locator Map support the same broader visitor journey, but they serve different purposes.

Clinic Locator Map

Use the Clinic Locator Map when clinic discovery is an important objective of the page and you want to reduce friction as much as possible.

The map immediately gives visitors access to the locator experience without requiring them to first click through another component.

This makes the Clinic Locator Map the preferred approach when the objective is to maximize the number of visitors reaching and engaging with the clinic network.

Clinic Locator Banner

Use the Clinic Locator Banner when clinic discovery is a secondary objective of the page.

For example, the visitor may primarily be consuming other content, while the banner provides an opportunity to continue their journey towards finding a clinic.

The banner therefore works primarily as a traffic driver or teaser.

It introduces an additional click before visitors reach the Clinic Locator, so it should not replace the Clinic Locator Map when direct clinic discovery is the main objective.

Content

The Content field is intended for a short title or message.

This is not a component designed for extensive storytelling or large amounts of copy.

Keep the message short and focused on encouraging the visitor to continue to the Clinic Locator.

Visual

The expected visual dimensions are:

1440 × 810 px

The image is a major part of the component's design and should work effectively with the short text and CTA displayed over or alongside it according to the component design.

Invert Text Color

The component includes an Invert Text Color option.

Use this when the visual requires white text to provide sufficient contrast.

For example, if the selected image is relatively dark where the text is displayed, activating Invert Text Color changes the text to white so that it remains readable.

The decision should be based on the contrast between the image and the text.

CTA

The component includes a CTA.

The administrator can configure:

• The CTA text
• The button style

The CTA destination itself is not configurable.

The destination to the Clinic Locator is embedded within the component.

The administrator therefore only needs to determine what the CTA should say and how the button should look.

Placement and Compatibility

Although the component can technically fit into several Page Designer structures, the recommended placements are:

1. Main Region
2. Boxed Layout

These placements provide sufficient space for the large banner format and help keep the Clinic Locator journey easy to discover.

Main Region

Use the Main Region when the banner should have strong visual presence and make effective use of the available page width.

Boxed Layout

Use a Boxed Layout when the banner should remain within the page margins while retaining sufficient size and prominence.

Why Other Placements Are Not Recommended

The Clinic Locator Banner already introduces an additional interaction compared with displaying the Clinic Locator Map directly.

The visitor must:

See the banner → click the CTA → reach the Clinic Locator

For this reason, avoid adding additional friction around the component.

Although the component may technically be placed within structures such as a Tab Wrapper or certain Grid layouts, these are not recommended placements.

A Tab Wrapper can require an additional interaction before the visitor even discovers the banner.

A constrained Grid can reduce the visual prominence of a component designed to act as a strong traffic driver.

The recommended approach is therefore deliberately simple:

Main Region or Boxed Layout.

Versatility

The Clinic Locator Banner has low versatility by design.

Unlike components that can be repurposed for several types of content, this component has one specific objective:

Promote the Clinic Locator.

Its fixed destination means it should not be treated as a generic promotional banner.

Typical Use Case

A page contains content whose main objective is unrelated to clinic discovery, but the administrator wants to provide visitors with an opportunity to find a clinic as part of their next step.

The Clinic Locator Banner can be added towards an appropriate point in the page journey to promote that action without requiring the full Clinic Locator Map to occupy a significant portion of the page.

Alternative / Creative Uses

There is no recommended alternative use for this component.

Because its destination is embedded and always leads to the Clinic Locator, using it to represent another type of journey would create a mismatch between the content and the resulting visitor experience.

If another destination needs to be promoted, use a more appropriate general-purpose banner or another component offering configurable links.

Pairing With Other Components

The Clinic Locator Banner can be considered standalone.

It contains the visual, short content and CTA required to perform its function.

It does not need to be paired with another component to explain or complete the Clinic Locator promotion.

The Destination Cannot Be Changed

The Clinic Locator Banner is not a general-purpose banner.

Its CTA destination is already embedded within the component and leads to the Clinic Locator.

Administrators can configure the CTA wording and style, but cannot use the component to send visitors to an unrelated destination.

Use the Clinic Locator Map When Clinic Discovery Is the Main Objective

The banner introduces an additional click into the visitor journey.

If the main objective of the page is to help visitors find clinics and encourage them to engage with the clinic network, use the Clinic Locator Map instead.

This removes the intermediate banner step and gives visitors direct access to the locator experience.

Prefer Main Region or Boxed Layout

Use the component in:

• Main Region, or
• Boxed Layout

Although other placements may technically be possible, they are not recommended.

Avoid introducing unnecessary friction or reducing the visual prominence of the banner by placing it inside a Tab Wrapper or constrained Grid structure.

Keep the Content Short

The Content field is intended for a concise title or message.

Do not attempt to turn the Clinic Locator Banner into a long-form storytelling component.

Maintain Sufficient Text Contrast

Always check the readability of the text against the selected image.

Use Invert Text Color when white text provides better contrast.

Do not select the option automatically. The correct setting depends on the visual being used.

Use the Expected Image Dimensions

Prepare the banner visual at:

1440 × 810 px

Using imagery prepared for the component's expected format helps maintain the intended presentation.

1. Decide Whether the Banner Is the Right Component

Before adding the Clinic Locator Banner, determine how important clinic discovery is within the page experience.

Ask:

Is finding a clinic one of the main objectives of this page?

If yes, consider using the Clinic Locator Map directly.

This reduces friction by allowing visitors to access the clinic network immediately.

If clinic discovery is a secondary action and you simply want to provide a strong entry point towards the Clinic Locator, continue with the Clinic Locator Banner.

2. Prepare the Banner Visual

Prepare the image that will be used by the component.

The expected dimensions are:

1440 × 810 px

When selecting the visual, consider where the component's content will appear and make sure the image provides sufficient space and contrast for the text and CTA to remain readable.

Upload the visual to the Media Library if it is not already available.

3. Choose the Component Placement

Choose between the two recommended placements:

Option A: Main Region

Use the Main Region when the banner should receive strong visual prominence and make use of the available page width.

Option B: Boxed Layout

Use a Boxed Layout when the banner should respect the page margins while remaining large and easy to discover.

These are the recommended placements for the Clinic Locator Banner.

Avoid adding unnecessary friction by hiding the banner inside a Tab Wrapper or reducing its prominence within a constrained Grid.

4. Add the Clinic Locator Banner Component

Locate the Clinic Locator Banner in the Page Designer component list.

Drag and drop it into the selected Main Region or Boxed Layout.

5. Configure the Content

Locate the Content field.

Enter the short title or message that should appear within the banner.

Keep the content concise.

The purpose of the message is to support the Clinic Locator CTA rather than provide extensive information.

6. Select the Visual

Select the prepared 1440 × 810 px image from the Media Library.

Review how the image works together with the content.

Pay particular attention to the area where the text appears.

7. Configure the Text Color

Review the contrast between the text and the selected visual.

If the default text color does not provide sufficient contrast, activate:

Invert Text Color

This displays the text in white.

Use the setting according to the selected visual rather than applying it systematically.

The objective is to maximize readability and contrast.

8. Configure the CTA Text

Enter the text that should appear on the CTA.

Choose wording that clearly communicates that the visitor will continue towards the Clinic Locator.

The administrator controls the CTA wording, but not its destination.

The destination is already embedded within the component and leads to the Clinic Locator.

9. Select the Button Style

Choose the desired button style according to the design of the banner.

Use the available styling options provided by the component.

Consider the visual, text color and overall contrast when choosing the button presentation.

10. Review the Complete Banner

Before saving, review the component as a whole.

Confirm that:

• The component is placed in the Main Region or Boxed Layout.
• The correct 1440 × 810 px visual has been selected.
• The Content is concise.
• The text remains readable against the image.
• Invert Text Color has been enabled if required.
• The CTA wording is clear.
• The selected button style works with the visual.
• The banner clearly communicates that it leads towards clinic discovery.

11. Click Apply

Once the Clinic Locator Banner has been configured, click Apply.

Apply saves the component configuration.

Do not leave the component without applying your changes.

12. Validate the Banner on Staging

Validate the completed page on the appropriate staging storefront.

Confirm that:

• The banner displays correctly.
• The component has sufficient visual prominence.
• The image displays correctly.
• The short content is readable.
• Text contrast is sufficient.
• The CTA is clearly visible.
• The button style works with the selected image.
• Clicking the CTA takes the visitor to the Clinic Locator.
• The placement does not introduce unnecessary friction into the visitor journey.

If the Clinic Locator Banner feels unnecessarily indirect for the purpose of the page, reconsider the component choice.

When clinic discovery is a primary objective, use the Clinic Locator Map to provide visitors with more direct access to the clinic network.