## Top bar and newsletter popup

Product: Grafton - Blog & Magazine WordPress Theme
URL: https://hub.jkdevstudio.com/docs/grafton/styles-and-settings/top-bar-and-newsletter-popup
Updated: 2026-11-15
Summary: Show or hide the newsletter bar above the header, and set when the subscribe popup opens through the Modals integration.

This is a Pro feature. Grafton Pro can add a thin dark bar above the header that invites visitors to the newsletter, and a popup with the subscribe form. The bar is switched at [[Grafton Pro > Theme Options > Header > Elements]]. The popup is a modal of the Modals integration, so you set when it opens there.

:::options

- **Top bar** (default: on): The thin bar above the header with a line and a link to the newsletter. A visitor can close it with the button on its right.

:::

## How the popup opens

The demo comes with one modal called **Newsletter**. It opens once per browser session, when the visitor has scrolled 40% down a page, and any link to `#newsletter` opens it at any time. The link in the top bar already points there.

:::steps

### Open the modal

Go to [[Modals]] and open **Newsletter**.

### Change when it appears

On the **Trigger** tab, pick another **Open when** choice, such as a delay or exit intent, and set **How often**. Keep the **Trigger ID** as `newsletter` so your links keep opening it.

### Check it on the site

Open a page in a private window and scroll down, or click a link to `#newsletter`. Close the popup with its button or the <kbd>Esc</kbd> key.

:::

To open it from your own link, set the address of any paragraph link, button or menu item to `#newsletter`. When there is no published modal with that id, the same link scrolls to the subscribe block in the footer instead, so it never leads nowhere.

Every trigger and setting is covered in [Modal windows](https://hub.jkdevstudio.com/knowledge-base/integration/modals-integration).

## Where the subscribers go

The form sends to the audience you connect on the Mailchimp page of Theme Options. Until an audience is connected, nobody is added to a list. The connection is covered in [Mailchimp integration](https://hub.jkdevstudio.com/knowledge-base/integration/mailchimp-integration).