# Astra: Message Bar Above the Header

> Prints a slim message bar above the Astra header on every page, for sales, shipping notes or event dates, using Astra's own header hook.

- Type: PHP
- Runs: Frontend only
- Category: [Page Builders & Themes](https://wpide.com/library/category/page-builders/)
- Tags: astra, header, banner
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/astra-bar-above-header/

## Code

```php
// Message and colors.
$wpide_astra_bar_text = 'Free shipping on orders over $50 &mdash; <a href="/shop/">Shop now</a>';
$wpide_astra_bar_bg   = '#111827';
$wpide_astra_bar_fg   = '#ffffff';

add_action( 'astra_header_before', function () use ( $wpide_astra_bar_text, $wpide_astra_bar_bg, $wpide_astra_bar_fg ) {
    if ( '' === trim( $wpide_astra_bar_text ) ) {
        return;
    }

    printf(
        '<div class="wpide-astra-bar" style="background:%1$s;color:%2$s;text-align:center;padding:8px 16px;font-size:14px;"><style>.wpide-astra-bar a{color:inherit;text-decoration:underline;}</style>%3$s</div>',
        esc_attr( $wpide_astra_bar_bg ),
        esc_attr( $wpide_astra_bar_fg ),
        wp_kses_post( $wpide_astra_bar_text )
    );
} );
```

## Notes

Leave the message empty to hide the bar. Colors are set in the inline style.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Astra: Message Bar Above the Header" in its snippet library and add it in one click; or create a new PHP snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/