{"id":20328,"date":"2025-12-24T08:22:54","date_gmt":"2025-12-24T08:22:54","guid":{"rendered":"https:\/\/notificationx.com\/?post_type=docs&p=20328"},"modified":"2025-12-24T08:24:29","modified_gmt":"2025-12-24T08:24:29","password":"","slug":"how-to-show-announcement-using-notificationx","status":"publish","type":"docs","link":"https:\/\/notificationx.com\/zh\/docs\/how-to-show-announcement-using-notificationx\/","title":{"rendered":"How to Show Announcement on WordPress Website with NotificationX"},"content":{"rendered":"

With NotificationX, you can easily display announcements to show promotional offers, videos, collect feedback and leads within your WordPress website. With this freemium feature, you can now customize your announcement, manage its visibility and add targeted content with ease. <\/p>\n\n\n\n

Let\u2019s see how to configure the \u2018Announcement\u2019<\/strong> notification type with NotificationX. <\/p>\n\n\n\n

How to Configure Announcement in NotificationX<\/strong><\/h2>\n\n\n\n

Follow this step-by-step process to show an announcement on your website with NotificationX. Before getting started, make sure you have \u5b89\u88c5\u5e76\u6fc0\u6d3b NotificationX<\/strong><\/a> and NotificationX PRO on your website. <\/p>\n\n\n\n

\u7b2c 1 \u6b65\uff1a\u6dfb\u52a0\u65b0\u901a\u77e5<\/strong><\/h3>\n\n\n\n

\u8f6c\u5230WordPress\u4eea\u8868\u677f\u5e76\u5bfc\u822a\u81f3 wp-admin -> NotificationX<\/strong>. Then, right at the top, click on \u2018Add New\u2019.<\/strong><\/p>\n\n\n

\n
\"Add<\/figure>\n<\/div>\n\n\n

Step 2: Select \u2018Announcement\u2019 as Your Notification Type<\/strong><\/h3>\n\n\n\n

\u5b8c\u6210\u7b2c1\u6b65\u540e\uff0c\u60a8\u5c06\u88ab\u91cd\u5b9a\u5411\u5230 '\u8d44\u6e90'<\/strong> Tab page of your NotificationX. You can also put a title. From the options, select \u2018Announcement\u2019<\/strong> \u4f5c\u4e3a\u60a8\u7684\u6765\u6e90\u7c7b\u578b\u3002<\/p>\n\n\n

\n
\"Select<\/figure>\n<\/div>\n\n\n

Step 3: Choose the Announcement Theme & Design<\/strong><\/h3>\n\n\n\n

\u6765\u81ea '\u8bbe\u8ba1' <\/strong>tab, you can choose a theme based on your needs. The first 4 themes, which include showcasing ongoing offers and collecting visitors’ messages without their email addresses, are FREE.<\/p>\n\n\n\n

The next 3 themes, where your website visitors can send a message and give their email, are included in the PRO version. From the \u2018\u4e3b\u9898<\/strong>\u2019 section, the chosen layout is how the \u2018Announcement<\/strong>\u2019 will be displayed on your website.<\/p>\n\n\n

\n
\"Select<\/figure>\n<\/div>\n\n\n

Next, to make the theme customizable, enable the \u2018\u8fdb\u9636\u8bbe\u8ba1<\/strong>\u2019 button. There you will be able to change the color of background color, overlay background color and control the popup width. You can even change the close button color for the popup. <\/p>\n\n\n\n

You will also be able to adjust the typography and font\/ size weight, content message color. Change the button design to a customized color in the button by adjusting font size, radius, padding and width. <\/p>\n\n\n\n

\"\"<\/div><\/div><\/figure><\/div><\/div>\n\n\n\n

Step 4: Customize the Content for Announcement<\/strong><\/h3>\n\n\n\n

After clicking the \u2018Next\u2019<\/strong> button, you will find the '\u5185\u5bb9'<\/strong> tab. Here, you can choose the content for the popup. From the \u2018Title\u2019<\/strong>, choose the title you want to showcase for your popup. You can give a catchy headline in the title section. Next, enable the Name, Email, or Message field to collect users’ names, email addresses, or their messages, respectively. You also have available option to choose a catchy CTA for the button. <\/p>\n\n\n\n

Below, you will also find an option to add a custom link for the CTA. After the setting, click on the '\u4e0b\u4e00\u4e2a'<\/strong> button to control the visibility of the announcement.<\/p>\n\n\n

\n
\"Customize<\/figure>\n<\/div>\n\n\n

Step 5: Control the Visibility<\/strong><\/h3>\n\n\n\n

Next, from the '\u663e\u793a'<\/strong> tab, select the visibility option where you want to show\/ hide the announcement on your website. You can also select to whom you want to display this notification type.<\/p>\n\n\n

\n
\"Control<\/figure>\n<\/div>\n\n\n

Step 6: Configure the Customization <\/strong><\/h3>\n\n\n\n

Next, under the '\u5b9a\u5236'<\/strong> tab, you can choose the Appearance of the announcement. That means in which position on your website you want to display the notification. Adjust the notification size and choose the type of device you want to display the close button and notification visibility. You can also control the notification reappearance for the users.<\/p>\n\n\n

\n
\"Customization<\/figure>\n<\/div>\n\n\n

Next, you will find popup settings where you can enable or disable the \u2018Show Close Button\u2019<\/strong> \u548c \u2018Close on Button Click.\u2019 <\/strong>You can also adjust the close button position. Next, in the Animation section, you can animate the popup and set up the delay. Set the Timing to show a delay before the first notification. Click on the '\u53d1\u5e03'<\/strong> button to make the announcement live on your website. <\/p>\n\n\n

\n
\"Set<\/figure>\n<\/div>\n\n\n

\u6700\u7ec8\u7ed3\u679c<\/strong><\/h2>\n\n\n\n

By following these steps and a bit more modification, this is how your Announcement will appear on your WordPress website.<\/p>\n\n\n

\n
\"Final<\/figure>\n<\/div>\n\n\n

\u5982\u679c\u60a8\u9047\u5230\u4efb\u4f55\u95ee\u9898\uff0c\u53ef\u4ee5\u8054\u7cfb\u6211\u4eec \u652f\u6301\u56e2\u961f<\/strong><\/a>.<\/p>","protected":false},"excerpt":{"rendered":"

Step-by-step guide of how to use announcement feature in NotificationX<\/p>","protected":false},"author":44,"featured_media":20338,"template":"","meta":{"_eb_attr":"","inline_featured_image":false,"_eb_data_table":"","_analytify_skip_tracking":false,"footnotes":""},"doc_category":[154],"doc_tag":[306,186,1617,156],"class_list":["post-20328","docs","type-docs","status-publish","has-post-thumbnail","hentry","doc_category-configurations","doc_tag-elementor","doc_tag-email-subscription","doc_tag-feature","doc_tag-notificationx"],"year_month":"2026-04","word_count":622,"total_views":"2052","reactions":{"happy":"1","normal":"0","sad":"0"},"author_info":{"name":"Maahi","author_nicename":"maahi","author_url":"https:\/\/notificationx.com\/zh\/author\/maahi\/"},"doc_category_info":[{"term_name":"Configurations","term_url":"https:\/\/notificationx.com\/zh\/docs-category\/configurations\/"}],"doc_tag_info":[{"term_name":"Elementor","term_url":"https:\/\/notificationx.com\/zh\/docs-tag\/elementor\/"},{"term_name":"Email Subscription","term_url":"https:\/\/notificationx.com\/zh\/docs-tag\/email-subscription\/"},{"term_name":"Feature","term_url":"https:\/\/notificationx.com\/zh\/docs-tag\/feature\/"},{"term_name":"NotificationX","term_url":"https:\/\/notificationx.com\/zh\/docs-tag\/notificationx\/"}],"knowledge_base_info":[],"knowledge_base_slug":[],"_links":{"self":[{"href":"https:\/\/notificationx.com\/zh\/wp-json\/wp\/v2\/docs\/20328","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/notificationx.com\/zh\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/notificationx.com\/zh\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/notificationx.com\/zh\/wp-json\/wp\/v2\/users\/44"}],"version-history":[{"count":3,"href":"https:\/\/notificationx.com\/zh\/wp-json\/wp\/v2\/docs\/20328\/revisions"}],"predecessor-version":[{"id":20405,"href":"https:\/\/notificationx.com\/zh\/wp-json\/wp\/v2\/docs\/20328\/revisions\/20405"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/notificationx.com\/zh\/wp-json\/wp\/v2\/media\/20338"}],"wp:attachment":[{"href":"https:\/\/notificationx.com\/zh\/wp-json\/wp\/v2\/media?parent=20328"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/notificationx.com\/zh\/wp-json\/wp\/v2\/doc_category?post=20328"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/notificationx.com\/zh\/wp-json\/wp\/v2\/doc_tag?post=20328"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}