View Categories

So gestalten Sie eine Benachrichtigungsleiste mit Elementor & NotificationX

4 min read

NotificationX ermรถglicht es Ihnen, eine atemberaubende Benachrichtigungsleiste mit zu entwerfen Elementor Page Builder. 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.

How To Configure Notification Bar On Your Elementor Website #

Follow the below guideline to see how to configure the 'Benachrichtigungsleiste' using NotificationX and Elementor.

Schritt 1: Erstellen Sie eine Benachrichtigungsleiste #

Gehen Sie zu Ihrem WordPress-Dashboard und navigieren Sie zu wp-admin ->  NotificationX-> All NotificationX. Klicken Sie dann ganz oben auf โ€˜Add Newโ€™. Or you can also simply go to the โ€˜Add Newโ€™ tab from the sidebar.

Benachrichtigungsleiste mit Elementor

Nachdem Sie fertig sind, werden Sie zu weitergeleitet 'Quelle' Tab page of your NotificationX user interface.ย  Give a title if you want and select ย 'Benachrichtigungsleiste' as your notification type. Then click on the 'Nรคchster' Taste.

Benachrichtigungsleiste mit Elementor

Schritt 2: Konfigurieren Sie das Design  #

Von dem 'Design' Registerkarte finden Sie einige vorgefertigte Designs zur Auswahl und die 'Mit Elementor bauen' option when you turn the 'Advanced Design' toggle on. Simply by clicking on the button, you will find all the pre-made layouts for your Notification Bar.

Note: Make sure you have Elementor installed on your WordPress website. Or, click on the โ€˜Install Elementorโ€™ button to proceed.

Benachrichtigungsleiste mit Elementor

Nachdem Sie Ihre bevorzugte Vorlage ausgewรคhlt haben, klicken Sie einfach auf โ€˜Importโ€™ button, as shown above.

In โ€˜Erweitertes Designโ€™ you also get the flexibility to use the option to modify the notification bar to reach the maximum potential of it.

Unter dem 'Design' option, you can do a lot of customization to make your notification bar stand out. Such as changing the background color and image, making your own button color, countdown background color, countdown text color, closing button color, close button size, and position.

Benachrichtigungsleiste mit Elementor

Plus, you can also customize the Link Button, Typography  & add Custom CSS to your Gutenberg Notification from this section.

Benachrichtigungsleiste mit Elementor

Once the design is imported, you will find the button on the user interface โ€˜Mit Elementor bearbeiten'. Wenn Sie darauf klicken, werden Sie zum Elementor-Editor weitergeleitet, in dem Sie den Abschnitt Benachrichtigungsleiste nach Belieben mit Ihren bevorzugten Styling-Optionen gestalten und anpassen kรถnnen.

Benachrichtigungsleiste mit Elementor

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

Benachrichtigungsleiste mit Elementor

Publish your designed notification bar from the Elementor editor & revert back to the NotificationX dashboard to customize your bar more and make it publish finally.

Step 3: Set Your Notification Bar Visibility #

In dem 'Anzeige' tab, 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.

Benachrichtigungsleiste mit Elementor

Step 4: Customize Your Notification Bar As You Prefer #

AnschlieรŸend konfigurieren Sie einfach die Einstellungen รผber das 'Anpassen' Registerkarte und konfigurieren Sie das Aussehen, das Timing und das Verhalten der Benachrichtigungsleiste. Sie kรถnnen die Position auswรคhlen, an der die Benachrichtigungsleiste auf Ihrer WordPress-Website angezeigt werden soll, ob Sie die Leiste auf mobilen Gerรคten anzeigen mรถchten, und auch auswรคhlen, ob Sie eine Schaltflรคche zum SchlieรŸen hinzufรผgen mรถchten. 

Benachrichtigungsleiste mit Elementor

Mit dem โ€˜Targetingโ€™ option, you can target users who will be able to see the bar and who are not. The timing of the notification bar can also be customized from the โ€˜Timingโ€™ section.

If you want to hide your bar automatically, you can do that by simply clicking on the โ€˜Auto Hideโ€™ option. You have the flexibility of setting the timer for your auto-hiding.

If you want your notification bar will pop up after a few seconds your visitor come to your website, you can set that as well. You can also this based on your visitorโ€™s scrolling timing here.

Benachrichtigungsleiste mit Elementor

After you have completed all the steps, click on the 'Verรถffentlichen' Taste.

Benachrichtigungsleiste mit Elementor

Endergebnis #

By following these mentioned steps and a bit more modifying, this is how your Notification Bar will appear on your Elementor website. For more information on So konfigurieren Sie die Benachrichtigungsleiste, du kannst Sehen Sie sich diese ausfรผhrliche Dokumentation an.

Benachrichtigungsleiste mit Elementor

Mit Hilfe von NotificationX kรถnnen Sie auf einfache Weise atemberaubende Bilder erstellen und gestalten Benachrichtigungsleisten mit Elementor & erhรถhen Sie dabei Ihre Conversion.

Steckenbleiben? Wenn Sie Probleme oder Fragen haben, kรถnnen Sie Kontaktieren Sie unser Support-Team.

Unterstรผtzt von BetterDocs

  • 00Tage
  • 00Std
  • 00Mins
  • 00Secs

Wait! Already Leaving?

Our Exclusive Birthday Gift