Plugin-Tipp: WP-Note Schöne Infoboxen für WordPress

Heute geht es mal wieder um ein Plugin für WordPress, das ich schon lange kenne und immer gerne genutzt habe: WP-Note. Damit lassen sich „Info-Kästen“ im Text unterbringen, für den Fall, dass man etwas Wichtiges hervorheben möchte. Ich hatte schon 2009 über WP-Note geschrieben, aber da es mittlerweile in einer aktualisierten Version vorliegt und ich denke, dass viele von Euch das Plugin und seine Möglichkeiten nicht auf dem Schirm haben, erkläre ich Euch hier nochmal ganz genau, was man damit alles anfangen kann.

Das Szenario

Ihr schreibt einen Text, der Hinweise und Tipps beinhaltet, vielleicht auch eine Warnung, eine Frage an die Allgemeinheit oder whatever. Beispiel: „Hier kannst Du für wenig Geld lecker essen…bla bla…“ oder „Möchtest Du in Zukunft häufiger solche Artikel lesen? Wenn ja, dann kannst Du…bla bla…“. Sowas in der Art. Natürlich kann man das mit Textformatierungen hervorheben, aber eine schicke Box, die den Besucher direkt anspringt, wäre doch auch fein, oder? WP-Note verrichtet diesen Dienst schon seit vielen Jahren, wurde aber irgendwann mal unbrauchbar, weil es mit PHP-Versionen oberhalb 7.0 nicht mehr funktionierte. Ein russischer Entwickler hat sich des Problems angenommen und WP-Note weiterentwickelt, sodass es auch mit PHP > 7.0 klar kommt.

Wie sieht’s denn überhaupt aus?

In der „Urform“ – also ohne Anpassungen – sehen die einzelnen Kästen so aus:

Da darf man sich natürlich nicht an den russischen Texten stören, das sind nur die Beispieltexte des Entwicklers. Aber wie Ihr seht, kann man für jede erdenkliche Art von Hinweis eine entsprechende Textbox anlegen. So weit, so gut.

Aber vielleicht gefallen Dir die Farben, die Icons oder die Schatten an den Kästen nicht. Falls Du die Frage mit „Ja!“ beantwortest, dann heißt es: anpassen! Im Plugin-Verzeichnis gibt es eine CSS-Datei, die nach Herzenslust verändert werden kann. Dort liegen auch die Grafiken bzw. Icons, die links neben dem Text angezeigt werden. Auch diese kann man austauschen, sie müssen im PNG-Format vorliegen und 48 x 48 Pixel groß sein. Schöne Icons findest Du beispielsweise bei flaticon. Da ich dort aber nicht fündig geworden bin, habe ich mir meine Icons selbst erstellt.

Wie arbeite ich mit dem Plugin?

Wenn es in WordPress installiert und aktiviert wurde, kannst Du die Texte, die Du in eine Box packen möchtest, mit folgenden Tags versehen:

Es gibt auch Tools, mit denen Du diese Befehle per Menü im Editor (in diesem Fall TinyMCE – also der normale Editor – , nicht Gutenberg) in Deinen Text einfügen kannst, z.B. Add Quicktag. Das ist natürlich praktisch, weil es Schreibarbeit spart, man sich keine Shortcodes merken muss und natürlich vermeidet es Tippfehler. Mit Add Quicktag definierst Du einfach die gewünschten Shortcodes und kannst sie dann beim Schreiben eines Artikels einfügen.

So sieht es bei mir aus

Das ist eine allgemeine Notiz

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est.

Das ist eine Info-Box

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est.

Das ist eine Warnung

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est.

Das ist eine Hilfe-Box

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est.

Das ist eine „Wichtig“-Box

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est.

Das gilt es zu beachten

  • Wenn Du Dich dazu entschließt, WP-Note irgendwann nicht mehr einzusetzen, dann haben alle Texte, die Du damit formatiert hast, die jeweiligen Shortcodes voranstehen. Das sieht natürlich unschön aus. Workaround: eine Datenbankabfrage machen und alle Artikel herausfiltern, in denen die Shortcodes vorkommen. Die kannst Du dann entweder händisch aus dem Text killen oder wiederum per Datanbankabfrage.
  • Ganz wichtig: Wenn Du die Icons und das Stylesheet für das Plugin geändert hast, sichere Dir diese Dateien unbedingt lokal! Denn bei jedem Update des Plugins werden diese Dateien mit den jeweiligen Originalen überschrieben. Hast Du aber eine Sicherung dieser Dateien, dann kannst Du sie wieder in das Plugin-Verzeichnis zurückspielen.

Vielleicht ist dieses Plugin ja genau das, was Du gesucht hast? Falls ja, würde es mich freuen! Fragen und Anmerkungen wie immer gerne als Kommentar.

Wie hat Dir dieser Artikel gefallen? Bewerte ihn jetzt!

Durchschnittliche Bewertung / 5. Anzahl Bewertungen:

Bisher keine Bewertungen! Sei der Erste, der diesen Beitrag bewertet.

Es tut mir leid, dass Dir der Beitrag nicht gefallen hat.

Lass mich wissen, was ich verbessern kann!

Was kann ich verbessern?

Willst Du benachrichtigt werden, wenn es neue Artikel gibt? Abonniere den Newsletter!

Dieser Service ist DSGVO-konform - Deine E-Mail-Adresse wird zu keinem Zeitpunkt an Dritte weitergegeben und Du kannst Dich jederzeit abmelden. Den Link dazu findest Du in jedem Newsletter, den Du erhältst. Die Datenschutzerklärung findest Du rechts in der Sidebar.

Über Martin

Ich bin und war es immer, der Chefredakteur des alten und des neuen Loft 75, dem illustrierten Magazin aus dem 21. Jahrhundert. Geboren 1969 in einem kleinen Ort im Welterbe Oberes Mittelrheintal und somit gebürtiger Rheinland-Pfälzer. Ich habe mich bereits 1987 für Computer interessiert, bin stets kreativ und reduziere Dinge auf das Wesentliche, schreibe gerne und interessiere mich für Design, Einrichten, Internet, Kochen, Blogging und alles, was außergewöhnlich ist und außergewöhnlich gut aussieht. Privat wohnte ich in Koblenz am Rhein - in dem besagten Loft, das keins ist. Und seit einigen Jahren wohne ich im Bergischen Land. Ich freue mich, wenn Du dieses Magazin magst - lesen wir voneinander..?
Speichere in deinen Favoriten diesen permalink.

4 Kommentare

  1. Gutenberg war auch mein erster Gedanke, als ich deinen Artikel gelesen habe. Und mein zweiter war der, den du auch hast. Gutenberg! Ganz blödes Thema!

    LG
    Sabiene

    • Hallo Sabiene und schön, dass Du hierhin gefunden hast :-)

      Deinen Worten entnehme ich, dass Du mit Gutenberg auch nicht sehr befreundet bist, oder?

      Ich kann mich an das Konzept nicht gewöhnen. Ich benutze das Plugin TinyMCE Advanced, das den Editor sinnvoll erweitert und auch die Möglichkeit gibt, den alten Editor als Standard auszuwählen (es erweitert aber auch auf Wunsch Gutenberg).

  2. Das Plugin kenne ich auch und hatte es lange eingesetzt. Da ich aber jetzt schon seit Längerem mit Gutenberg und ein paar Block-Plugins arbeite, brauche ich das nicht mehr. Da gibts ja via Gutenberg irre Möglichkeiten, die heute kostenlos oder für kleines Geld geschaffen wurden. Ich habe das Gefühl, dass Gutenbergs sich inzwischen gemausert hat und dadurch auch an Akzeptanz bei den Nutzern.

    • Ich habe wirklich Probleme, mit Gutenberg zu arbeiten. Ich durchblicke zwar das Konzept irgendwie, aber das Arbeiten damit ist für mich ein Graus. Ich habe mich zwar versucht einzuarbeiten, aber es gefällt mir nicht. Irgendwann muss ich mich mal damit auseinandersetzen müssen, weil TinyMCE ja sicher nicht bis in alle Ewigkeit in WordPress enthalten sein wird.

      Aber ja, ich gebe zu, man hat verdammt viele Möglichkeiten mit Gutenberg.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.