# Shipping banner configuration

### Layout and placement

There are two out-of-the-box layouts for the shipping banner: floating widget and top bar. We recommend the floating widget — it works in every theme. The top bar layout works in most themes, but for a few themes ShipScout cannot determine where to place it.

You can opt into the top bar layout in any theme by adding the following placeholder where you'd like the banner to appear:

```
<div class="shipscout-placeholder"></div>
```

{% hint style="info" %}
You can add as many placeholder elements as you need; we'll replace them all with the banner.
{% endhint %}

### The banner text

Every variant carries a single banner text. Whatever you write is what the visitor sees — there's no template language and no rate-state-driven message switching.

Each variant in your test can have its own banner text, so the banner is part of the treatment you're A/B testing. The shop-level banner text is the fallback shown when no test is running.

### Country targeting

You can restrict the banner to specific countries directly from the banner editor. Pick the countries the banner should show in, and visitors outside that list will not see it. Leave the country list empty to show the banner globally.

This applies both during a live test (per-variant country list) and to the shop-level banner shown outside a live test. The visitor's country is determined from their IP address.

{% hint style="info" %}
Country targeting only affects banner display. The shipping rates themselves are scoped by your Shopify shipping zones — country targeting on the banner doesn't change which destinations qualify for ShipScout rates.
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.shipscout.app/tasks/top-bar-integration.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.