{"id":368975,"date":"2023-01-31T13:30:00","date_gmt":"2023-01-31T10:30:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=368975"},"modified":"2023-01-31T13:42:01","modified_gmt":"2023-01-31T10:42:01","slug":"so-richten-sie-eine-wordpress-benachrichtigungsleiste-ein","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/de\/so-richten-sie-eine-wordpress-benachrichtigungsleiste-ein\/","title":{"rendered":"So richten Sie eine WordPress-Benachrichtigungsleiste ein"},"content":{"rendered":"\n

Es gibt viele verschiedene Arten von Botschaften, die Sie auf Ihrer Website vermitteln m\u00f6chten. Jeder von ihnen ben\u00f6tigt einen geeigneten Kanal. Gro\u00dfe Pop-up-Boxen, Werbebanner und \u00e4hnliches sind sehr praktisch, wirken aber manchmal zu aufdringlich. Au\u00dferdem bekommen Website-Besucher leicht genug davon, was zu hohen Absprungraten f\u00fchren kann. Wenn Sie \u00fcber eine elegante, unaufdringliche und dennoch effektive M\u00f6glichkeit nachdenken , die Aufmerksamkeit Ihrer Besucher zu erregen und eine Nachricht zu \u00fcbermitteln<\/strong>, ist eine WordPress-Benachrichtigungsleiste m\u00f6glicherweise genau das, wonach Sie suchen.<\/p>\n

Benachrichtigungsleiste \u2013 Wof\u00fcr wird sie verwendet?<\/h2>\n

Die Benachrichtigungsleiste kann f\u00fcr verschiedene Zwecke verwendet werden. Es kann Ihnen sicherlich dabei helfen, mehr Verkehr auf spezielle Seiten zu lenken<\/strong>. Sie k\u00f6nnten es verwenden, um Ihre E-Mail-Liste zu erweitern, indem Sie ein Newsletter-Abonnement anbieten oder Website-weite Informationen teilen<\/strong>.<\/p>\n

Es kann sehr vorteilhaft sein, wenn Sie beispielsweise ein E- Commerce-WP-Thema<\/a> haben. Sie k\u00f6nnen dort Versandinformationen anzeigen,<\/strong> da dies die Art von Informationen ist, die alle Ihre Website-Besucher sicherlich wissen m\u00f6chten. Sie werden es auch sehr bequem finden, einen Verkauf oder ein neues Produkt zu bewerben<\/strong>. Das Anzeigen eines Promo-Codes<\/strong> in einer Benachrichtigungsleiste ist ebenfalls eine gro\u00dfartige Idee.<\/p>\n

\"So<\/a><\/p>\n

Dar\u00fcber hinaus k\u00f6nnen Sie es verwenden, um Ihre Kontaktinformationen zu teilen<\/strong>. Auf diese Weise verbessern Sie die Kommunikation mit den Website-Besuchern, da sie nicht eine andere Seite \u00f6ffnen m\u00fcssen, nur um sie zu finden. Und wenn Sie soziale Symbole in die Leiste einf\u00fcgen<\/strong>, ist dies ein bew\u00e4hrtes Rezept f\u00fcr den Ausbau Ihrer sozialen Netzwerkverbindungen.<\/p>\n

\"So<\/a><\/p>\n

Jede Art von Website kann von einer gut gestalteten Benachrichtigungsleiste profitieren. Denken Sie nur an die M\u00f6glichkeiten. Sie k\u00f6nnen es als CTA-Banner verwenden, um Website-Besucher einzuladen, sich anzumelden, sich zu registrieren, auf bestimmte Materialien zu klicken, um sie herunterzuladen, eine Sonderbestellung aufzugeben<\/strong> und \u00e4hnliches.<\/p>\n

\"So<\/a><\/p>\n

Wenn Ihr WP-Theme noch keine Benachrichtigungsleiste hat, k\u00f6nnen Sie ganz einfach eine mit einem der WordPress-Benachrichtigungsleisten-Plugins einrichten.<\/p>\n

Richten Sie eine Benachrichtigungsleiste mit dem WPFront-Benachrichtigungsleisten-Plugin ein<\/h2>\n

\"So<\/a><\/p>\n

WPFront<\/a> ist ein zuverl\u00e4ssiges und praktisches Plugin f\u00fcr die Benachrichtigungsleiste. Es ist aufgrund seiner Einfachheit und Effektivit\u00e4t bei WordPress-Benutzern sehr beliebt. Es ist ziemlich einfach einzurichten und bietet genau die richtige Menge an Anpassungsoptionen<\/strong>. Da es sehr leicht ist, k\u00f6nnen Sie sicher sein, dass es Ihre Website nicht verlangsamt oder ihre Leistung negativ beeinflusst. Jetzt zeigen wir Ihnen, wie Sie es in nur wenigen Schritten einrichten<\/strong> und die perfekte Benachrichtigungsleiste f\u00fcr Ihre Website erstellen.<\/p>\n

SCHRITT 1: Aktivieren des WPFront-Benachrichtigungsleisten-Plugins<\/h3>\n

Nachdem Sie das Plugin installiert haben, klicken Sie auf die Einstellungen und dann im Dropdown-Men\u00fc auf Benachrichtigungsleiste.<\/p>\n

\"So<\/a><\/p>\n

Ein Klick darauf \u00f6ffnet alle verf\u00fcgbaren Einstellungen f\u00fcr die Benachrichtigungsleiste. Das erste, was Sie tun m\u00fcssen, ist logischerweise, das Kontrollk\u00e4stchen mit der Aufschrift Enabled zu aktivieren.<\/p>\n

\"So<\/a><\/p>\n

Nachdem Sie die Benachrichtigungsleiste hier aktiviert haben, ist sie auf allen Seiten sichtbar und Sie k\u00f6nnen sie weiter anpassen<\/strong>. Alle Anpassungsoptionen werden auf dieser Seite angezeigt.<\/p>\n

Sie werden feststellen, dass die Benachrichtigungsleiste als Vorschau im Backend auf der Seite mit den Benachrichtigungsleisteneinstellungen angezeigt wird<\/strong>, was sehr praktisch ist, da Sie nicht hin und her gehen m\u00fcssen, um zu \u00fcberpr\u00fcfen, wie sie auf der Live-Seite aussieht. Sie k\u00f6nnen Ihre Anpassungen live sehen und, wenn Sie mit dem, was Sie sehen, zufrieden sind, auf Speichern klicken.<\/p>\n

SCHRITT 2: Einstellen der Position der Benachrichtigungsleiste<\/h3>\n

\"So<\/a><\/p>\n

Mit diesem Plugin k\u00f6nnen Sie den Ort ausw\u00e4hlen, an dem Sie Ihre Benachrichtigungsleiste anzeigen m\u00f6chten<\/strong> \u2013 dies kann oben oder unten auf der Seite<\/strong> sein. Falls Sie sich f\u00fcr die oberste Position entscheiden, k\u00f6nnen Sie mit der Option Positionsversatz zus\u00e4tzlich entscheiden, wie weit der Balken am oberen Bildschirmrand erscheinen soll .<\/strong> F\u00fcr die untere Position ist dies jedoch nicht m\u00f6glich.<\/p>\n

Was das Balkenverhalten anbelangt, k\u00f6nnen Sie zwischen Fixed at Position<\/strong> und Display on Scroll<\/strong> w\u00e4hlen. Wenn Sie die erste Option w\u00e4hlen, wird der Balken nicht durch das Scrollen der Seite beeinflusst, er bleibt immer an der gleichen Position<\/strong>. Wenn Sie die zweite Option w\u00e4hlen, wird die Leiste angezeigt, wenn Sie die Seite scrollen<\/strong>. Es ist nicht sofort sichtbar, und unter Scroll Offset<\/strong> k\u00f6nnen Sie ausw\u00e4hlen, nach wie vielen Pixeln es angezeigt werden soll<\/strong>. Damit die Option \u201eDisplay on Scroll“ funktioniert, m\u00fcssen Sie zuerst die Option \u201eFixed at Position<\/strong> “ deaktivieren !<\/p>\n

SCHRITT 3: Anpassen der Benachrichtigungsleiste<\/h3>\n

\"So<\/a><\/p>\n

Sie k\u00f6nnen Ihre Benachrichtigungsleiste statisch oder animiert gestalten<\/strong>. Sie w\u00e4hlen dies aus, indem Sie die Animationsdauer festlegen<\/strong>. Wenn Sie es auf 0 setzen, wird die Animation ausgeschaltet und die Leiste bleibt statisch<\/strong>. Um die Leiste zu animieren, geben Sie ein, wie lange die Animation dauern soll<\/strong>. Wenn Sie ihn beispielsweise auf 3 Sekunden einstellen, wird der Balken w\u00e4hrend der 3 Sekunden allm\u00e4hlich angezeigt. Die Animation ist eine sch\u00f6ne M\u00f6glichkeit, die Leiste hervorzuheben, da sie sie allm\u00e4hlich erscheinen l\u00e4sst und so die Aufmerksamkeit auf sie lenkt.<\/p>\n

Wenn Sie nicht m\u00f6chten, dass Ihre Benachrichtigungsleiste sofort nach dem Laden der Seite angezeigt wird, gibt es die Option Anzeigen nach .<\/strong> Hier k\u00f6nnen Sie festlegen, wie lange nach dem Laden der Seite die Leiste angezeigt werden soll<\/strong>.<\/p>\n

Mit der Option Automatisch schlie\u00dfen nach<\/strong> k\u00f6nnen Sie die Leiste nach einer festgelegten Zeit verschwinden lassen. Wenn die Leiste animiert ist, schlie\u00dft sie sich genauso, wie sie ge\u00f6ffnet wurde \u2013 allm\u00e4hlich.<\/p>\n

Wenn es um die Optionen geht, die Sie in der Navigationsleiste anzeigen k\u00f6nnen, haben Sie die Schaltfl\u00e4che \u201e Schlie\u00dfen anzeigen „,<\/strong> mit der der Besucher die Leiste schlie\u00dfen<\/strong> kann, und die Schaltfl\u00e4che \u201eErneut \u00f6ffnen“, mit der der Besucher die<\/strong> Leiste bei Bedarf erneut \u00f6ffnen kann<\/strong>. Wenn diese Option deaktiviert ist, wird die Leiste nicht angezeigt, bis die Seite neu geladen wird, oder gar nicht angezeigt, falls die Option geschlossen halten<\/strong> aktiviert ist. Mit der Option Keep Closed For<\/strong> k\u00f6nnen Sie die Zeit einstellen, nach der der Balken wieder angezeigt wird.<\/p>\n

Um den Textinhalt der Leiste<\/strong> zu definieren, verwenden Sie das Feld Nachrichtentext<\/strong>, in das Sie den Text eingeben, der in der Leiste angezeigt werden soll. Dar\u00fcber hinaus k\u00f6nnen Sie es mit HTML gestalten. Sie m\u00fcssen nicht einmal besonders gut in HTML sein.<\/p>\n

Wenn Sie beispielsweise die Schriftgr\u00f6\u00dfe \u00e4ndern m\u00f6chten, passen Sie diese einfach an, indem Sie die gew\u00fcnschte Gr\u00f6\u00dfe in das Feld Nachrichtentext eingeben<\/strong>. Sie f\u00fcgen diesen Text in das Feld ein:<\/p>\n

<span style=\"font-size: 20px\">Lorem ipsum dolor sit amet, consectetur adipiscing elit.<\/span>.<\/code><\/pre>\n
und das einzige, was Sie hier \u00e4ndern sollten, ist die Zahl<\/strong>, die die Schriftgr\u00f6\u00dfe darstellt.<\/p>\n
\"So<\/a><\/p>\n
Wenn Sie nun m\u00f6chten, dass neben dem Text in der Leiste eine Schaltfl\u00e4che angezeigt wird, aktivieren<\/strong> Sie die Option Schaltfl\u00e4che anzeigen<\/strong>. Geben Sie dann den Text, der angezeigt werden soll, in das Feld Button Text<\/strong> ein. Bei den Funktionen der Taste k\u00f6nnen Sie zwischen folgenden Optionen w\u00e4hlen:<\/strong><\/p>\n
\"So<\/a><\/p>\n
Wenn Sie m\u00f6chten, dass die Leiste nicht mehr angezeigt wird, nachdem der Besucher darauf geklickt hat<\/strong>, k\u00f6nnen Sie dies einfach einstellen, indem Sie die Option Leiste bei Klick auf die Schaltfl\u00e4che schlie\u00dfen aktivieren<\/strong>. Dies ist insbesondere dann sinnvoll, wenn es sich bei der Benachrichtigung um einen CTA-Button handelt. Wenn der Besucher beispielsweise auf die Schaltfl\u00e4che \u201eNewsletter abonnieren“ in der Benachrichtigungsleiste klickt, wird er auf die Seite mit den Details zum Abonnement weitergeleitet, und die Benachrichtigungsleiste wird nicht mehr angezeigt, da ihr Zweck erf\u00fcllt ist.<\/p>\n
Wenn Sie nicht m\u00f6chten, dass Ihre Navigationsleiste immer f\u00fcr alle sichtbar ist, k\u00f6nnen Sie eine der zahlreichen Filteroptionen<\/strong> verwenden. Sie k\u00f6nnen festlegen, wie lange der Balken angezeigt werden soll, indem Sie die Daten in den Feldern Startdatum und -uhrzeit<\/strong> und Enddatum und -uhrzeit festlegen<\/strong>. Sie k\u00f6nnen auch ausw\u00e4hlen, auf welchen Seiten die Leiste angezeigt<\/strong> werden soll, indem Sie einige der Optionen der Einstellung \u201e Auf Seiten anzeigen “ aktivieren.<\/strong><\/p>\n
\"So<\/a><\/p>\n
Wenn es darum geht, wer die Navigationsleiste sehen kann, k\u00f6nnen Sie sie nur f\u00fcr bestimmte Benutzer sichtbar machen, indem Sie einfach die Kontrollk\u00e4stchen im Feld Anzeige f\u00fcr Benutzerrollen aktivieren<\/strong>.<\/p>\n
\"So<\/a><\/p>\n
Design und Farben<\/h4>\n
Das Plugin bietet auch einige coole Funktionen, um das Aussehen der Leiste zu gestalten. Sie k\u00f6nnen die Balkenh\u00f6he<\/strong> anpassen \u2013 indem Sie die Anzahl der Pixel festlegen. Da diese Bar ansprechend, aber nicht gro\u00df<\/strong> sein soll, achten Sie darauf, es nicht zu \u00fcbertreiben. Eine weitere interessante Funktion ist, dass Sie der Leiste einen Schatten hinzuf\u00fcgen<\/strong> k\u00f6nnen, indem Sie die Option Schatten anzeigen aktivieren .<\/strong><\/p>\n
Interessant ist, dass man den Balken nicht einfarbig machen muss \u2013 man hat die M\u00f6glichkeit, zwei Farben einzustellen und Verl\u00e4ufe zu erstellen<\/strong>. Dar\u00fcber hinaus k\u00f6nnen Sie die Textfarbe und auch die Farben f\u00fcr alle Schaltfl\u00e4chen festlegen.<\/strong><\/p>\n
\"So<\/a><\/p>\n
Das Plugin f\u00fcr die WPFront-Benachrichtigungsleiste erm\u00f6glicht es Ihnen auch , zus\u00e4tzliches CSS zu schreiben, um den Stil noch weiter anzupassen<\/strong>.<\/p>\n
Lassen Sie uns nun ein paar CSS-Anpassungen erw\u00e4hnen, die ziemlich oft verwendet werden, wie zum Beispiel die \u00c4nderung der Schriftgr\u00f6\u00dfe. Was Sie daran verwundern k\u00f6nnte, ist, dass, wenn Sie die Schriftgr\u00f6\u00dfe des Nachrichtentextes \u00e4ndern, dieser m\u00f6glicherweise nicht mehr mit der Schaltfl\u00e4che daneben \u00fcbereinstimmt. Dies kann leicht behoben werden. Wenn Sie die Schriftgr\u00f6\u00dfe \u00e4ndern, ist es empfehlenswert, die Klasse des Elements zu definieren, dem wir bestimmte Werte zuweisen werden<\/strong> :<\/p>\n
<span class=\"text-bar\" style=\"font-size: 20px\">Lorem ipsum dolor sit amet, consectetur adipiscing elit.<\/span><\/code><\/pre>\n
In unserem Beispiel ist die Klasse eine Textleiste, Sie k\u00f6nnen dasselbe f\u00fcr eine andere Klasse tun.<\/p>\n
Wir werden es in CSS so beschreiben:<\/p>\n
.text-bar {margin-bottom: 0px;}<\/code><\/pre>\n
Auf diese Weise richten wir den Text und die Schaltfl\u00e4che<\/strong> aus. Nat\u00fcrlich m\u00fcssen Sie m\u00f6glicherweise einen anderen Wert verwenden. Am besten begutachten Sie das gew\u00fcnschte Element<\/a>, um den ben\u00f6tigten Wert zu ermitteln. Je nachdem, was Sie \u00e4ndern m\u00f6chten, k\u00f6nnen Sie der Klasse jedes andere Merkmal zuordnen.<\/p>\n
Ein weiteres interessantes Feature ist, dass Sie auch den Schatten anpassen k\u00f6nnen, der standardm\u00e4\u00dfig ziemlich dunkel ist. Sie k\u00f6nnen es zum Beispiel so anpassen und heller machen:<\/p>\n
wpfront-bottom-shadow {box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.2);}<\/code><\/pre>\n
Und vergessen Sie nicht \u2013 Sie m\u00fcssen nach jeder vorgenommenen \u00c4nderung auf Speichern klicken, damit sie tats\u00e4chlich wirksam wird!<\/p>\n
Abschlie\u00dfend<\/h2>\n
Bei richtiger Anwendung kann Ihnen die Navigationsleiste viele Vorteile bringen. F\u00fchlen Sie sich frei, es f\u00fcr verschiedene Zwecke zu testen. Wir haben nur einige der Ideen aufgelistet, um Sie zu inspirieren, aber wir sind sicher, dass Ihnen noch viele andere Gr\u00fcnde einfallen, es zu verwenden. Gestalten Sie es, passen Sie es an und teilen Sie Ihre Erfahrungen mit uns!<\/p>\n
Aufnahmequelle:  wpklik.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
Entdecken Sie, was eine WordPress-Benachrichtigungsleiste ist, und erfahren Sie, wie Sie sie schnell und einfach einrichten.<\/p>\n","protected":false},"author":1,"featured_media":363820,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[567],"tags":[845],"class_list":["post-368975","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-grundlagen","tag-affiai-de"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts\/368975","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/comments?post=368975"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts\/368975\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/media\/363820"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/media?parent=368975"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/categories?post=368975"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/tags?post=368975"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}