How to Add A Notification Bar in WordPress

How to Add A Notification Bar in WordPress

To explain your ideas and to showcase some essential messages effectively, you need to make use of all the highly visible areas of your site. Among these great locations, the page header can maximum the effect and ensure the most out of your website. Here, to target this valuable location, we highly recommend you to use the notification bar. In the following, we’d like to tell you how to add a notification bar in WordPress.

In the most cases, the notification bar can be used to showcase the short but critical messages using the colorful and bright strip at the top of your pages. Generally, when people access your pages, most of them will move their eyes to this special bar without feeling intrusive and disruptive. In this case, we sincerely suggest you adding this bar on your site to display the important information.

Method 1 – Leverage the WordPress Notification Bar Plugin

The easiest way to add a notification bar on your WordPress site is by utilizing the WordPress Notification Bar plugin. This plugin helps you create a sticky bar on the top of your pages, which showcases the custom messages or the call to actions. Note that you have the freedom to choose the design and color of this bar totally based on your taste.

Decide the Message of the Notification Bar

After clicking the Settings > Notification Bar button upon the plugin installation and activation, you can decide the information showcased on this bar.

Here, you can choose to enter some words to showcase a textual content only. If you want, you can also add a call-to-action button by entering the label and the target link of this button. Here, you can choose to open this link in a new window or not.

Notification Bar Message

Determine the Overall Style of the Notification Bar

Now, you can decide the background color of this special bar with the color picker. In addition, you can tick the checkbox of Position to make this notification bar a sticky one. This way, when people scroll down, this bar will still stay at the top location all the times.

Notification Bar Style

Note that you can check a preview at the top of the screen. If you feel satisfied, you can tick the Yes checkbox for the Enable option and click the Save Changes button.

Notification Bar Preview

Method 2 – Leverage the WP Notification Bars Plugin

The WP Notification Bars plugin ensures more customization freedom than the first recommendation. With it, you can generate the fully customizable notification bar to market your promotions, show some alerts and display the latest update with the higher click through rate.

Decide the Settings for the New Notification Bar

This plugin allows you to display different notifications bars on different pages. Here, you can generate the new bar by clicking the Notification Bar > Add New button. For the most basic settings, you firstly need to decide whether to hide, to toggle or to close the button showcased on this bar. After that, you can enter the exact pixel value to determine the content width as you want.

In addition, you need to pay attention to the Notification Bar CSS Position part. If you want to have a sticky bar, you should choose the option of Fixed. If you want it to disappear with the scrolling of the pages, you can choose the Absolute option.

Notification Bar General Settings

Set Up the Bar Content

In this step, you should decide the content of this notification bar. By default, you can add the words, a link or a call-to-action button. In this case, you simply need to enter the textual content, provide the label and the URL of the link or the button and choose the link style.

Notification Bar Content

In addition to the default content types, you can also showcase some custom contents, such as the special shortcode.

Change the Appearance of This Special Bar

Next, you should change and modify the appearance of your notification bar. You can try your best to make it match the overall design of all your pages. From this part, you can decide the background color, link color, button color, text color and the font size as you wish.

Notification Bar Style

Choose the Conditions to Display the Notification Bar

Lastly, you need to determine when and where to showcase this effective bar on your WordPress site. Here, you can choose to display it on the specific locations, which include your homepage, the posts and the pages. Or, you can showcase it for people who access your site via the searching results of Google Search Engine or via the Facebook platform.

In addition, you can set a contrary condition of not to display the notification bar based on the above mentioned situations.

Notification Bar Conditions

Note that you can get the live preview of your notification bar whenever you make any changes on it. If you are satisfied, you can give this bar a name for the easier management and publish it.