{"id":20918,"date":"2023-10-16T16:56:43","date_gmt":"2023-10-16T10:56:43","guid":{"rendered":"https:\/\/hasthemes.com\/?post_type=docs&#038;p=20918"},"modified":"2023-11-09T16:16:15","modified_gmt":"2023-11-09T10:16:15","password":"","slug":"how-to-add-new-notification-with-hashbar","status":"publish","type":"docs","link":"https:\/\/hasthemes.com\/docs\/how-to-add-new-notification-with-hashbar\/","title":{"rendered":"How to Add New Notification with HashBar"},"content":{"rendered":"\n<p>Adding a new notification using HashBar is a straightforward process that allows you to effectively communicate with your website visitors. Follow these simple steps to create and display a notification using HashBar:<\/p>\n\n\n\n<p><strong>1-<\/strong> <strong>Add New Notification:<\/strong> Within the HashBar menu settings, find and click on the <strong>&#8216;Add New Notification'<\/strong> button<\/p>\n\n\n\n<figure class=\"wp-block-image size-full has-custom-border\"><a href=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification.png\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1272\" height=\"474\" src=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification.png\" alt=\"\" class=\"has-border-color wp-image-20920\" style=\"border-color:#fafafa;border-width:8px;border-radius:8px\" srcset=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification.png 1272w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-300x112.png 300w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-1024x382.png 1024w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-768x286.png 768w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-360x134.png 360w\" sizes=\"(max-width: 1272px) 100vw, 1272px\" \/><\/a><\/figure>\n\n\n\n<div style=\"height:25px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p><strong>2- Configure Notification (Title & Content):<\/strong> In this step, we will focus on configuring the fundamental components of your notification: the title and content. The title and content are key elements that convey the message you want to communicate to your audience effectively.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Notification Title:<\/strong> Enter your notification title.<\/li>\n\n\n\n<li><strong>Content:<\/strong> Input the content for your notification. The content complements the title and delves deeper into the details of your message.<\/li>\n\n\n\n<li><strong>Notification Bar Options:<\/strong> Customize the appearance of your notification, including colors, fonts, position, and more.<gwmw style=\"display:none;\"><\/gwmw><gwmw style=\"display:none;\"><\/gwmw><\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full has-custom-border\"><a href=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-2.png\"><img decoding=\"async\" width=\"1562\" height=\"816\" src=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-2.png\" alt=\"\" class=\"has-border-color wp-image-20935\" style=\"border-color:#fafafa;border-width:8px;border-radius:8px\" srcset=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-2.png 1562w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-2-300x157.png 300w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-2-1024x535.png 1024w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-2-768x401.png 768w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-2-1536x802.png 1536w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-2-360x188.png 360w\" sizes=\"(max-width: 1562px) 100vw, 1562px\" \/><\/a><\/figure>\n\n\n\n<div style=\"height:10px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h4 class=\"wp-block-heading\" style=\"font-size:18px\"><strong>Creating Notifications with HashBar Default Blocks and Customization Options<\/strong>:<gwmw style=\"display:none;\"><\/gwmw><gwmw style=\"display:none;\"><\/gwmw><gwmw style=\"display:none;\"><\/gwmw><gwmw style=\"display:none;\"><\/gwmw><\/h4>\n\n\n\n<p>Explore the versatile blocks of HashBar, including promo banners, promo banner images, notifications, and countdowns, to create engaging and tailored notifications that suit your website's needs. Unlock the potential of these default blocks and the extensive customization options HashBar provides to effectively convey your messages and captivate your audience.<gwmw style=\"display:none;\"><\/gwmw><\/p>\n\n\n\n<figure class=\"wp-block-image size-full has-custom-border\"><img decoding=\"async\" width=\"1898\" height=\"901\" src=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-3.png\" alt=\"\" class=\"has-border-color wp-image-20941\" style=\"border-color:#fafafa;border-width:8px;border-radius:8px\" srcset=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-3.png 1898w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-3-300x142.png 300w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-3-1024x486.png 1024w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-3-768x365.png 768w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-3-1536x729.png 1536w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-3-360x171.png 360w\" sizes=\"(max-width: 1898px) 100vw, 1898px\" \/><\/figure>\n\n\n\n<div style=\"height:25px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p><strong>3-<\/strong> <strong><strong>Publish Notification<\/strong>:<\/strong> Once you have configured the notification settings to your liking, click on the <strong>&#8216;Publish'<\/strong> button.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full has-custom-border\"><a href=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-4.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1903\" height=\"703\" src=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-4.png\" alt=\"\" class=\"has-border-color wp-image-20943\" style=\"border-color:#fafafa;border-width:8px;border-radius:8px\" srcset=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-4.png 1903w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-4-300x111.png 300w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-4-1024x378.png 1024w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-4-768x284.png 768w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-4-1536x567.png 1536w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/hashbar-add-new-notification-4-360x133.png 360w\" sizes=\"(max-width: 1903px) 100vw, 1903px\" \/><\/a><\/figure>\n\n\n\n<div style=\"height:25px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p><strong>4-<\/strong> <strong><strong><strong>Check Your Website<\/strong><\/strong>:<\/strong> Visit your website and ensure that the new notification is displaying according to your settings.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><a href=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/HashBar-Right-Button-Demo.png\"><img loading=\"lazy\" decoding=\"async\" width=\"580\" height=\"421\" src=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/HashBar-Right-Button-Demo.png\" alt=\"\" class=\"has-border-color wp-image-20831\" style=\"border-color:#fafafa;border-width:5px;border-radius:5px\" srcset=\"https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/HashBar-Right-Button-Demo.png 580w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/HashBar-Right-Button-Demo-300x218.png 300w, https:\/\/hasthemes.com\/wp-content\/uploads\/2023\/10\/HashBar-Right-Button-Demo-360x261.png 360w\" sizes=\"(max-width: 580px) 100vw, 580px\" \/><\/a><\/figure>\n\n\n\n<p><gwmw style=\"display:none;\"><\/gwmw><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Adding a new notification using HashBar is a straightforward process that allows you to effectively communicate with your website visitors. Follow these simple steps to create and display a notification using HashBar: 1- Add New Notification: Within the HashBar menu settings, find and click on the &#8216;Add New Notification&#8217; button 2- Configure Notification (Title &#038; [&hellip;]<\/p>\n","protected":false},"author":6,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","_mi_skip_tracking":false,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"doc_category":[249],"doc_tag":[],"class_list":["post-20918","docs","type-docs","status-publish","hentry","doc_category-how-to-use-hashbar-notification-bar"],"acf":[],"year_month":"2025-11","word_count":230,"total_views":"1578","reactions":{"happy":"0","normal":"0","sad":"0"},"author_info":{"name":"Kausar mamun","author_nicename":"mamun","author_url":"https:\/\/hasthemes.com\/author\/mamun\/"},"doc_category_info":[{"term_name":"HashBar","term_url":"https:\/\/hasthemes.com\/docs-category\/how-to-use-hashbar-notification-bar\/"}],"doc_tag_info":[],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"htmega_size_585x295":false,"htmega_size_1170x536":false,"htmega_size_396x360":false,"betterdocs-category-thumb":false},"uagb_author_info":{"display_name":"Kausar mamun","author_link":"https:\/\/hasthemes.com\/author\/mamun\/"},"uagb_comment_info":0,"uagb_excerpt":"Adding a new notification using HashBar is a straightforward process that allows you to effectively communicate with your website visitors. Follow these simple steps to create and display a notification using HashBar: 1- Add New Notification: Within the HashBar menu settings, find and click on the &#8216;Add New Notification' button 2- Configure Notification (Title &&hellip;","knowledge_base_info":[],"knowledge_base_slug":[],"_links":{"self":[{"href":"https:\/\/hasthemes.com\/wp-json\/wp\/v2\/docs\/20918","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hasthemes.com\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/hasthemes.com\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/hasthemes.com\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/hasthemes.com\/wp-json\/wp\/v2\/comments?post=20918"}],"version-history":[{"count":11,"href":"https:\/\/hasthemes.com\/wp-json\/wp\/v2\/docs\/20918\/revisions"}],"predecessor-version":[{"id":22005,"href":"https:\/\/hasthemes.com\/wp-json\/wp\/v2\/docs\/20918\/revisions\/22005"}],"wp:attachment":[{"href":"https:\/\/hasthemes.com\/wp-json\/wp\/v2\/media?parent=20918"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/hasthemes.com\/wp-json\/wp\/v2\/doc_category?post=20918"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/hasthemes.com\/wp-json\/wp\/v2\/doc_tag?post=20918"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}