Dienstag, 21. April 2020
Hintergrundinfo/Spoiler
In diesem Blog habe ich einen interessanten Artikel gelesen. Er beschreibt, wie man einfach mit HTML aufklappbare Zusatzinformationen in seinen Blog integrieren kann. Natürlich will ich das hier ausprobieren.
Klick mich
Hier wird Hintergrundinformation angezeigt oder Text, den man nur sichtbar machen will, wenn jemand darauf klickt.
Aha. So auf Anhieb funktioniert das nicht. Ich kann nicht einfach im CKEditor auf Quellcode umstellen und den HTML-Code einfügen. Der Code wird automatisch entfernt. 
<details>
<summary>
Klick mich
</summary>
<p>
Hier wird Hintergrundinformation angezeigt oder Text, den man nur sichtbar machen will, wenn jemand darauf klickt.
</p>
</details>
Mit dem Icon "Codeschnipsel einfügen" klappt es auch nicht (siehe oben).
Hmmm... ich komme nicht weiter... Zumindest zeigen kann ich es. Das Problem dabei ist, dass man nach dem abspeichern den Beitrag nie mehr ändern darf, denn dann sind die HTML-Befehle weg...
Hier wird Hintergrundinformation angezeigt oder Text, den man nur sichtbar machen will, wenn jemand darauf klickt. Dieser Text sollte zur besseren Erkennung auch anders formatiert werden als der Beitragstext. z.B. kleiner Schriffont, kursiv oder mit Hintergrundfarbe. Das sollte mit CSS machbar sein.
Klick das Dreieck
Nein, ich bring's nicht "permanent" hin...
Vermutlich komme ich mit "Tooltips" eher zum Ziel. Das ist zwar nicht ganz das Gleiche, doch immerhin so ähnlich... Vielleicht sogar noch eher das, was mir vorschwebt... (man sollte relativ einfach im Fliesstext zusätzliche Detailinformationen mitgeben können). Ich installiere mal das Ereignis-Plugin "serendipity_event_tooltips"
Dieser Link ist nicht aktiv. Er enthält eine kopierbare Trackback-URI, um manuell ein Ping- und Trackback zu diesem Eintrag für ältere Blogsysteme zu generieren; zB (immer noch valide) über das zur Verfügung gestellte Eintragsfeld des serendipity_event_trackback Plugins. Serendipity und andere Blogsysteme erkennen die Trackback-URL heutzutage aber automatisch anhand der Artikel-URL. Die Trackback-URI für ihren Link des Sender-Eintrages lautet daher wie folgt: »https://www.blog.dokumenzi.ch/2637-HintergrundinfoSpoiler.html«
Kommentare
Ansicht der Kommentare: Linear | Verschachtelt
Ian Styx am :
Ich weiß nicht wie viele Jahre ich immer wieder über die CKEditor ACF Funktion sprechen muss, ... gefühlte Zehn. Es gibt einfach Bedingungen für klares Auto Markup über die sich die wenigsten Leute Gedanken machen.
ACF dient dazu HTML tags bzw attribute code, die nicht erlaubt sind, zu entfernen, bzw nur feste Regeln zuzulassen. Ein Sicherheitsfeature und sicher auch eine Erfahrung aus den langen Jahren des Umgangs mt Microsoft Produkten wie Word etc, die haufenweise furchtbares HTML Zeug schreiben, einfügen. Außerdem räumt er hinter Usern her die nicht streng die HTML Vorgaben erfüllen wollen oder können. Alles in allem ein Butler, der für klare Verhältnisse sorgt. (und mit sowas kennst du dich ja aus..!)
Willst du details und summary tags erlauben, weil du so etwas viel und oft nutzen willst, so musst du dese explizit als Ausnahmen in die Extra Allowed Content [EAC] aufnehmen, siehe line 76 ff der ckeditor/cke_config.js. Und das bei jedem Update. Jeden unbedarften User komplett selbstbestimmt darin herumfummeln zu lassen ist meines Erachtens nicht anzuraten und würde den Aufwand der Generierung für alle erhöhen.
Ansonsten gibt es nur diese eine Möglichkeit, die ja genau deiner gemachten Erfahrung entspricht. Schreibe deinen Text bis er komplett fertig ist, öffne dann den Quellcode und füge den details / summary part ein und gehe direkt auf abspeichern. Dann ist im Eintragstext alles so wie du es haben willst. In dem Moment wo dieses Markup wieder aus der Datenbank ausgelesen wird oder du vom Quellcode in den WYSIWYG Modus schaltest, ist der ACF schon aktiv geworden.
Ja, im CKEplus Plugin lässt sich ACF komplett abschalten. No risc, no fun! ?
Ich würde es aber nicht raten und machen, denn er hilft mehr als das er einen behindert! Wirklich!
Ab hier nur noch an den Osterhasen... ?
Nun kommen die "Oberschlauen" und sagen: Hey Serendipity hat doch dieses tolle Pluginsystem ... Ich knalle mir einfach noch ein paar weitere Plugins hinzu...
Aber jene beachten nicht, dass jedes Plugin an den Systemressourcen nagt, roundabout 15 MB, die einen mehr die anderen weniger. Jedes Plugin das auch noch so entfente Fälle abdeckt, schließt sich in den Reigen der zu durchlaufenden event hooks. BEI JEDEM REQUEST ! Ich meine dass das nicht nötig ist.
tooltips sind ja eigentlich nichts weiter als title Attribute. Da p, div und span tags mit Attributen ja erlaubt sind, kannst du von Hand title="ich bin ein tooltip" einfügen - viel schneller, effektiver und genauer als ein ständig laufendes Plugin. Das sollte vom ACF unangetastet bleiben.
Es kommt eben darauf an was dir so im genauen vorschwebt und ob das ein Alltagsinstrument sein soll. Wozu muss das in einen Blogeintrag als ständig vorhaltbares Instrumentarium?
Details / Summary Seiten kommen doch auf eher "statischen" HTML Seiten zur Anwendung. Vielleicht. Oder eben in Backends bei bestimmten Aufgaben/Anwendungen. Ihr markup beziehen sie statisch aus der template Vorlage, auch wenn sie in Teilen dynamisch generiert bzw geloopt werden. Wenn Blogeinträge sich als Standard Umfang eher einer kompletten HTML Seite (an-) nähern, so sollte man besser lernen gleich HTML zu schreiben und auf Rich-Text Editoren zu verzichten, bzw sich ein anderes System zu wählen das für solche Gegebenheiten gebaut ist.
Beat Post author am :
Ich habe wohl derzeit einfach zuviel Corona-Freizeit...??
Du hast natürlich mit allem recht. Es ist ja auch nicht so, dass mir Tooltip oder ein ähnliches Feature in den letzten Jahren gefehlt hätte.
Ich fand die Tooltip-Idee, Zusatzinformationen hinter dem vordergründig sichtbaren Text zu verstecken einfach noch smart. Man könnte z.B. quere Gedankengänge, Witze oder Widersprüche hinterlegen. Oder ein Bild zu einem Wort. Nur so als Idee.
Die Spoiler-Funktion (ein beschrifteter Button öffnet ein zusätzliches Textfeld) kenne ich vor allem aus Foren und das gefällt mir auch... ohne dass ich einen klaren Vorteil/Nutzen innerhalb eines Blogs sehe. Doch manche Funktionen muss man erst ein paar mal nutzen, bis man sie eben sinnvoll einzusetzen weiss.
Das erscheint mir als ein sehr interessanter Ansatz. Das werde ich in den nächsten Tagen mal austesten.
Vielen Dank für die Mühe und Arbeit, die Du Dir mit diesem ausführlichen Kommentar gemacht hast. ?
Ian Styx am :
Diese Info Button sind vorallem da relevant wo es um Formulare oder Formularfelder geht, oder wo man sie als head Erklärung für eine Seiten/System Verhalten benötigt. Unter dem Motto: Einmal gesehen sollen sie einen nicht weiter belästigen.
Für quere Gedankengänge bzw andere Abschweifungen muss man sich halt etwas überlegen. Man kann Technik auch als Erzähltechnik verwenden. Das mit dem Bild läßt sich mit dem normalen Instrumentarium erledigen. Ein Link erstellen und als Text ein Bild einfügen oder umgekehrt, jeweils mit kurzen Korrekturen per Hand, wenn man es nicht gleich einfacher per Hand in den Quelltext schreibt.