View Categories

How to Show Announcement on WordPress Website with NotificationX

2 min read

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. 

Letโ€™s see how to configure the โ€˜Announcementโ€™ notification type with NotificationX. 

How to Configure Announcement in NotificationX #

Follow this step-by-step process to show an announcement on your website with NotificationX. Before getting started, make sure you have ๅฎ‰่ฃ…ๅนถๆฟ€ๆดป NotificationX and NotificationX PRO on your website. 

็ฌฌ 1 ๆญฅ๏ผšๆทปๅŠ ๆ–ฐ้€š็Ÿฅ #

่ฝฌๅˆฐWordPressไปช่กจๆฟๅนถๅฏผ่ˆช่‡ณ wp-admin -> NotificationX. Then, right at the top, click on โ€˜Add Newโ€™.

Add new button for NotificationX announcement feature

Step 2: Select โ€˜Announcementโ€™ as Your Notification Type #

ๅฎŒๆˆ็ฌฌ1ๆญฅๅŽ๏ผŒๆ‚จๅฐ†่ขซ้‡ๅฎšๅ‘ๅˆฐ '่ต„ๆบ' Tab page of your NotificationX. You can also put a title. From the options, select โ€˜Announcementโ€™ ไฝœไธบๆ‚จ็š„ๆฅๆบ็ฑปๅž‹ใ€‚

Select NotificationX announcement type

Step 3: Choose the Announcement Theme & Design #

ๆฅ่‡ช '่ฎพ่ฎก' 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.

The next 3 themes, where your website visitors can send a message and give their email, are included in the PRO version. From the โ€˜ไธป้ข˜โ€™ section, the chosen layout is how the โ€˜Announcementโ€™ will be displayed on your website.

Select announcement design & theme

Next, to make the theme customizable, enable the โ€˜่ฟ›้˜ถ่ฎพ่ฎกโ€™ 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. 

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. 

How to Show Announcement on WordPress Website with NotificationX

Step 4: Customize the Content for Announcement #

After clicking the โ€˜Nextโ€™ button, you will find the 'ๅ†…ๅฎน' tab. Here, you can choose the content for the popup. From the โ€˜Titleโ€™, 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. 

Below, you will also find an option to add a custom link for the CTA. After the setting, click on the 'ไธ‹ไธ€ไธช' button to control the visibility of the announcement.

Customize the content on announcement

Step 5: Control the Visibility #

Next, from the 'ๆ˜พ็คบ' 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.

Control announcement visibility

Step 6: Configure the Customization  #

Next, under the 'ๅฎšๅˆถ' 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.

Customization in announcement

Next, you will find popup settings where you can enable or disable the โ€˜Show Close Buttonโ€™ ๅ’Œ โ€˜Close on Button Click.โ€™ 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 'ๅ‘ๅธƒ' button to make the announcement live on your website. 

Set animation and timing for announcement

ๆœ€็ปˆ็ป“ๆžœ #

By following these steps and a bit more modification, this is how your Announcement will appear on your WordPress website.

Final outcome of Announcement

ๅฆ‚ๆžœๆ‚จ้‡ๅˆฐไปปไฝ•้—ฎ้ข˜๏ผŒๅฏไปฅ่”็ณปๆˆ‘ไปฌ ๆ”ฏๆŒๅ›ข้˜Ÿ.

ไพ›็”ต BetterDocs

  • 00ๅคฉ
  • 00ๅฐๆ—ถ
  • 00Mins
  • 00Secs

Biggest Seasonal Savings For

A SUCCESSFUL 2026