Como projetar barra de notificação com Elementor e NotificationX

NotificaçãoX allows you to design a stunning Notification Bar with Construtor de páginas Elementor. With the introduction of Elementor integration, you will have the flexibility to choose and customize beautifully designed ready-made Elemetor templates on your WordPress website for free. You can display your latest sales, discounts, or urgent announcements amazingly on the website to influence your potential customers to buy your products or take your services.  Check out the below guideline to see how to configure the 'Barra de notificação' using NotificationX and Elementor:

Etapa 1: Criar uma barra de notificação #

Vá para o Painel do WordPress e navegue até wp-admin -> NotificaçãoX -> Todos NotificationX. Então, no topo, clique em 'Adicionar novo'. Or you can also simply go to the ‘Add New’ tab from the sidebar. 

notification bar with Elementor

Depois de terminar, você será redirecionado para o 'Fonte' Tab page of your NotificationX user interface. 

Give a title and select  'Barra de notificação' as your notification type. Your notification source will automatically be chosen to be ‘Press Bar’. Then click on the ‘Next’ button.

Notification bar with ELementor

Step 2: Configure The Design  #

De 'Projeto' tab, you will find a few pre-built themes to choose from and the 'Construir com Elementor' option. Simply by click on the button, you will find all the pre-made layouts for your Notification Bar.

Note: Make sure you have Elementor installed into your WordPress website. Or, click on the ‘Install Elementor’ button to proceed.

Notification bar with Elementor

After choosing your preferred template, simply go ahead & hit the ‘Import’ button, as shown above.

Once the design is imported, you will find button on the user interface ‘Edit With Elementor. By clicking on it, you will be redirected to the Elementor editor where you can design and customize the Notification Bar section any way you want with your preferred styling options.

Notification bar with Elementor

If you want, you can add new Elementor widgets and customize the design as per your preference and create a stunning notification bar.

notification bar with Elementor

Besides, Notification Bar comes with two more ready layouts to configure and showcase the GDPR Cookie Consent bar on your Elementor site.  Check out this documentation on GDPR Cookie Consent Bar to know in detail.   

Depois, acerte o 'Próximo' botão que irá redirecioná-lo para o ‘Content’ tab of the Notification Bar alert. Here, you can click on the checkbox to enable an advanced evergreen timer on your notification bar to create more urgency by using Marketing FOMO among your users. To learn more, check out this documentation.  

notification bar with Elementor

Next, you will be redirected to the ‘Display’ tab of your Notification Bar configuration process. You can now configure its settings to choose the location of your site where you want to display your notification bar and for whom you want to display the alert. 

notification bar with Elementor

Afterward, simply configure the settings from the 'Customizar' tab and configure the notification bar’s appearance, timing, and behavior. You can choose the position of where to showcase the notification bar on your WordPress website, whether you want to display the bar on mobile devices, and also select if you want to add a close button. 

notification bar with Elementor

Depois de concluir a etapa 6, clique no botão 'Publicar' button. As a result, the ‘Email Subscription’ will be successfully created. 

notification bar with Elementor

Resultado Final #

By following these mentioned steps and a bit more modifying, this is how your Notification Bar will appear on your WordPress website. For more information on como configurar a barra de notificação, you can check out this detailed documentation.

notification bar with ELementor

Com a ajuda de NotificationX, é assim que você pode criar e projetar facilmente Barras de notificação com Elementor e aumente sua conversão no processo.

Getting stuck? If you face any issues or queries, you can contact our Support Team.

Distribuído porBetterDocs