Schöner Bloggen

Mittwoch, 19. August 2020

Alien inside Twoday (Release 1.10)

alien/alienv110.jpg

Hinweis

Dieser Artikel ergänzt die vorangegangenen Blogbeiträge:

Seiteneffekte in der Programmierung sind unbeabsichtigte Auswirkungen im Programmcode, die dadurch entstehen, dass man an einer eher harmlosen Stelle etwas ändert, aber die Auswirkungen an einer anderen Stelle übersieht. Das ist ungefähr so, als würde man am Wochenende die Samentauschbörse der Gartenfreunde Feuerbach e.V. in aufgeregter Stimmung besuchen, weil man glaubt, da ginge es mal richtig zur Sache. Die Seiteneffekte sind dabei die Ohrfeigen, die man von jeder Gartenfreundin bekommt, weil man im sanft vorgetragenen persönlichen Tauschangebot einen schweren Denkfehler eingebaut hat. Aber ich schweife ab...

Dieses neue Alien-Release mit Nummer 1.10.0 behandelt auch einige durch Seiteneffekte entstandene Probleme, als da wären:

  • Beim Lesen der vorhandenen Twoday-Beiträge kam es zu Fehlern, wenn der Beitragstitel ein bestimmtes Sonderzeichen "|" enthielt (Gruß an Frau Zucker ;). Dies ist mit dem neuen Release korrigiert.
  • Nachdem das Tool einen User zu einem externen Blog umgeleitet hatte, erfolgte der Rücksprung (Zurück-Taste des Browsers) immer wieder zur Twoday-Blog-Adresse, welche dann sofort erneut eine Umleitung anstieß. Nun wird die Twoday-Adresse in der Browserhistorie vollständig ersetzt, so dass ein Rücksprung nicht in einer Schleife endet.
  • Für Twodays "Login-Status" sind Blogeigentümer auch nur "Administratoren". Das Alien-Tool fragte bislang nur diese Information ab und ließ so für alle Administratoren zu, dass man im Twoday-Blog blieb und dort die Synchronisierung gestartet wurde.

    Problem: Da auch alle internen Antville- und Twoday-Plattformbevollmächtigte automatisch Administrator in allen Twoday-Blogs sind, führte dies dazu, dass der Besuch von z.B. User "Antville.org" in einem Alien-Blog unbeabsichtigt eine Synchronisierung auslöste, evtl. mit seinem User neue Artikel anlegte oder aktualisierte (obwohl der Blogeigner das vielleicht noch gar nicht plante).

    Mit dem neuen Release ist das Tool im Standard nun so eingestellt, dass es nur für den Blogeigentümer (d.h. den User, der das Blog ursprünglich angelegt hat) den Synchronisierungsprozess startet. Eine irrtümliche Aktualisierung durch andere Administratoren kann damit nicht mehr stattfinden.

Dieses neue Synchronisierungsverhalten wird durch einen neuen Einstellparameter gesteuert. Im Standard (oder wenn der Eintrag fehlt) gilt, dass nur der Blogersteller synchronisieren darf — es kann aber auch eingestellt werden, dass weiterhin alle Administratoren synchronisieren dürfen.

Die gesamten Einstellmöglichkeiten der Alien-Software via Parameter sind im Beitrag zu Release 1.9 vollständig aktuell dokumentiert. Der neu hinzugekommene ist:

Parameter/Feldname Bezeichnung/Mögliche Werte
needUpdateLevel

Dieser Parameter legt fest, welche Mindestautorisierungsstufe ein an­ge­mel­deter Blog­besucher haben muss, um eine Synchro­nisierung des Blogs (und damit eine evtl. Aktua­lisierung der Blog­roll) auszulösen. Mögliche Werte sind Owner (Standard) und Admin.

Ist der Parameterwert "Owner", dann darf ausschließlich der Blog-Eigentümer (aka "creator") die Aktua­lisierung auslösen, Admini­stratoren hingegen werden dann auch auf die externe Seite umgeleitet. Beim Wert "Admin" dürfen auch alle Admini­stratoren des Blogs eine Aktualisierung initiieren.

Hinweis: Falls Sie mehrere Benutzer-IDs besitzen und nicht mehr wissen, mit welchem Sie den betreffenden Blog angelegt haben, können Sie dies unter Menüeintrag AdminWeblog herausfinden.

In der rechten Spalte sehen sie die Ersteller-ID unter Übersicht, "erstellt von...".

Wichtig Prüfen Sie vor dem Releasewechsel auf 1.10, ob Sie mit der Ersteller-ID dieses Blogs angemeldet sind, sonst werden Sie vor der automatischen Wiederherstellung Ihrer Einstellwerte auf den externen Blog umgeleitet — und das solange, bis Sie sich mit der richtigen UserId angemeldet haben. ;)

Ich biete an, den Releasewechsel individuell für Alien-Nutzer durchzuführen, bitte aber vorher um eine Bestätigung (per Mail oder hier als Kommentar), dass ich das machen soll. Ansonsten gilt weiterhin die Do-it-yourself-Anleitung hier im Kapitel "Installation des neuen Release". Fragen oder Unklarheiten bitte hier als Kommentar hinterlassen.

Dieses Tool ist Open Source — Lizenz MIT — Code Github

Freitag, 19. Juni 2020

Alien inside Twoday - new release v1.9

alien/alienv19.jpg

Hinweis

Dieser Artikel ist eine ergänzende Dokumentation zum originären Blogbeitrag "Alien inside Twoday" und beschreibt schwerpunktmäßig die Änderungen im jetzt aktuellen Release (Version 1.9). Zum besseren Verständnis über Sinn und Zweck des Tools bzw. seiner Erstinstallation verweise ich auf jenen ersten Beitrag aus dem Juni 2018.

Aus dem Ergebnis dieser Diskussion ergaben sich folgende Anforderungen, die ich nun in die neueste Alien-Tool-Version integriert habe:

  1. Für alle Besucher eines Twoday-Alien-Blogs (mit Ausnahme der eingeloggten Eigner/Administratoren) gilt: es wird direkt auf die neue Bloginstanz (z.B. Wordpress-Blog) umgeleitet. Dadurch verschwindet der bisherige Effekt, dass für Besucher der externe Blog unter einer Twoday-URL angezeigt wird.
  2. Die Verwendung des Tools ist mit der neuen Version zunächst auf die bestehenden Nutzer beschränkt worden. Falls jemand den unwiderstehlichen Wunsch verspürt, das Tool zu testen oder einzusetzen, schreibe er/sie/divers mir ein Mail, woraufhin ich das wohlwollend prüfe und dann freischalte.

Mit der neuen Version ist ein Releasewechsel noch einfacher geworden, da die bestehenden individuellen Einstellparameter (URLs, Feed, Farbeinstellungen, etc.) nun gesichert und automatisch in den neu ausgelieferten Stand eingemischt (neudeutsch: gemerged) werden.

Installation des neuen Release

1 Sobald eine neue Programmversion auf der Open Source Plattform Github verfügbar ist, wird dies einem Blogadministrator beim nächstfolgenden Aufruf seines Blogs angezeigt:

alien/alien10.jpg

2 Sie können nun mit Klick auf Aktualisieren das Update des Programms beginnen oder mit Jetzt nicht! die Aktualisierung vertagen (standardmäßig wird nach Ablauf von 2 Tagen ein Update erneut vorgeschlagen; siehe hierzu auch Parametereinstellung delayNewRelease).

3 Bei gewünschter Aktualisierung wird folgende Nachricht mit einer festen Schrittfolge angezeigt:

alien/alien11.jpg

Klicken Sie zunächst auf die erste Schaltfläche, um Ihre eigenen Alien-Einstellungen zu sichern. Diese werden im lokalen Speicher Ihres verwendeten Browsers hinterlegt. Eine grüne Nachricht bestätigt die abgeschlossene Sicherung.

Laden Sie danach über die zweite Schaltfläche das neue Programm (als Layout-Zip-Datei) herunter. Speichern Sie die Zip-Datei in ein beliebiges Verzeichnis (z.B. das Downloads-Verzeichnis) Ihres Rechners.

Über die dritte Schaltfläche wechseln Sie schließlich direkt zur Layoutverwaltung. Aktivieren Sie dort zunächst Ihr früheres, altes Twoday-Layout. Damit wird der Weg frei, das bestehende AlienInsideTwoday-Layout zu löschen (Sie wollen es ja durch die neue Version ersetzen). Nachdem Sie das Alien-Layout durch Klick auf "Löschen" entfernt haben, klicken Sie oben auf Layout importieren..., wählen die eben heruntergeladene Zip-Datei aus und klicken dann ganz unten auf Importieren.

alien/alien12.jpg
alien/alien13.jpg

Ein erfolgreicher Import wird mit einer gelben Twoday-Nachricht angezeigt. Aktivieren Sie danach wieder das soeben importierte AlienInsideTwoday-Layout durch Klick auf "Aktivieren".

alien/alien14.jpg

Klicken Sie nun auf "Weblog ansehen", um die Startseite Ihres Blogs aufzurufen.

4 Zwar wird der Default-Blog (Platzhalter) angezeigt, allerdings merkt das Tool, dass ein neues Release eingespielt wurde und aktualisiert im Hintergrund Ihre alten eigenen Einstellungen.

alien/alien15.jpg

Führen Sie nun abschließend einen Hard-Reload aus (Windows: Strg-F5, Mac: Cmd-R) und Ihr Blog sollte wieder wie gewohnt erscheinen.

5 Klicken Sie oben rechts auf das Hamburger-Icon und dann im Menü links auf den Eintrag Parameter/Einstellungen, um zu den Einstellwerten zu gelangen.

alien/alien04.jpg

6 Sie befinden sich nun im Edit-Modus zum Skin Site.implant, der alle Einstellparameter enthält:

alien/alien16.jpg

In der nachstehenden Tabelle finden Sie die Informationen zu den jeweiligen Einstellparametern und welche Inhalte Sie dort eingeben können. Sie können jederzeit die Parameterwerte nach Ihren Wünschen anpassen (Sichern Sie dann Ihre Änderungen)!

Parameter/Feldname Bezeichnung/Mögliche Werte
targetUrl

Die URL Ihres neuen Blogs. Einige Beispiele:

https://dasgruselkabinett.de
https://weltentanz.blogspot.com
https://www.kohlenspott.de
https://www.re-actio.com/wordpress/
usw.
rssFeedUrl

Die Teil-URL des RSS Feeds. Beispiele:

'feed' (Default) für Wordpress-Blogs
'feeds/posts/default?alt=rss' für Blogspot-Blogs
'rss' für Tumblr-Blogs
titleField

RSS-Feldname für den Beitragstitel (i.d.R. 'title')

publishedField

RSS-Feldname für das Publikationsdatum eines Beitrags (i.d.R. 'pubDate')

commentsField

RSS-Feldname für Kommentarinformationen. Der Default ist 'comments'

colorAlias

Setzt die Farbe für den Blog-Alias links oben im Menü (6-stelliger Farbcode mit vorangehendem Hashtag '#' oder ein zulässiger Farbname)

Beispiele: '#f04124' Farbcode einer hellroten Farbe
'yellow' Farbname für gelb
colorNavIcon

Setzt die Farbe für das Menüsymbol (Hamburger-Icon) rechts oben (6-stelliger Farbcode mit vorangehendem Hashtag '#' oder ein zulässiger Farbname). Das Menüsymbol überlagert den Blog (ausschließlich für Blog-Eigentümer/-Admins) und kann farblich angepasst werden.

Beispiele: '#ffffff' Farbcode für Weiß
'cyan' Farbname für cyan
menuOffsetTop

Definiert ein vertikales Offset (in Pixel) für das Menüsymbol, ausgehend vom oberen Rand (8 Pixel). Die Offsetangabe darf auch negativ sein.

Beispiele: 0 Standard
30 Das Menüsymbol wird 30 Pixel weiter unten angezeigt.
-5 Das Menüsymbol wird 5 Pixel weiter oben angezeigt.
menuOffsetRight

Definiert ein horizontales Offset (in Pixel) für das Menüsymbol, ausgehend vom rechten Rand (25 Pixel). Die Offsetangabe darf auch negativ sein.

Beispiele: 0 Standard
15 Das Menüsymbol wird 15 Pixel weiter links angezeigt.
-10 Das Menüsymbol wird 10 Pixel weiter rechts angezeigt.
pauseChecks

Definiert eine Wartezeit (in Millisekunden), in der keine neue Abfrage des RSS Feeds erfolgt. Der Standard ist auf 2 Minuten eingestellt.

Beispiele: 1000*60*2 Standard 2 Minuten (in Millisekunden) Wartezeit
1000*60*30 Der RSS Feed wird nur alle 30 Minuten neu gelesen, selbst, wenn Sie Ihre Twoday-Blogseite öfter aufrufen.
syncStories

Definiert die Anzahl der aktuellsten Beiträge, die mit Twoday synchronisiert werden. Der Standard ist auf 3 eingestellt, da auch nur maximal 3 Beiträge in der Twoday-Blogroll angezeigt werden.

3 Standard für 3 zu synchronisierende Beiträge
0 Ein Wert von Null unterbindet die Synchronisation. Es findet keine Neuanlage/Aktualisierung von Twoday-Beiträgen statt.
targetStory

Legt fest, ob ein Klick in der Twoday-Blogroll auf einen bestimmten Beitrag sofort auch den Beitrag im externen Blog anzeigt (Wert true) oder ob stets die Hauptseite des externen Blogs aufgerufen werden soll (Wert false). Die Standardeinstellung ist true.

titlePrefix

Definiert eine Zeichenkette, die vorne vor den Beitragstitel eingefügt wird. Dies kann z.B. sinnvoll sein, wenn man die aktuelle Kommentaranzahl in der Blogroll anzeigen möchte. Die Kommentarzahl wird über die Variable $comments gezogen, die an beliebiger Stelle der Zeichenkette als Platzhalter stehen kann. Beispiel: Ist titlePrefix in den Einstellungen mit '\u2709 $comments - ' definiert (Standard), und lautet der Beitragstitel 'Hallo Welt!' und die aktuelle Kommentaranzahl 3, so wird ein Beitragstitel '\u2709 3 - Hallo Welt!' generiert, wobei \u2709 dem Unicode-Zeichen für Mail entspricht. titlePrefix kann auch eine leere Zeichenkette sein.

titlePostfix

Definiert eine Zeichenkette, die hinten an den Beitragstitel eingefügt wird. Dies kann z.B. sinnvoll sein, wenn man die aktuelle Kommentaranzahl in der Blogroll anzeigen möchte. Die Kommentarzahl wird über die Variable $comments gezogen, die an beliebiger Stelle der Zeichenkette als Platzhalter stehen kann. Beispiel: Ist titlePostfix in den Einstellungen mit '| \u2709 $comments' definiert, und lautet der Beitragstitel 'Cheers Twoday!' und die aktuelle Kommentaranzahl 10, so wird ein Beitragstitel 'Cheers Twoday | \u2709 10' generiert, wobei \u2709 dem Unicode-Zeichen für Mail entspricht. titlePostfix kann auch eine leere Zeichenkette sein.

positionToast

Legt die Position fest, an der die Nachrichten des Tools ausgegeben werden.

toast-top-full-width Standard für Nachrichten oben in voller Breite
toast-top-right für Nachrichten oben rechts
toast-bottom-full-width für Nachrichten unten in voller Breite
[weitere Werte siehe auch hier zum Feldnamen "Position"]
delayNewRelease

Legt fest, wann das Tool frühestens wieder an eine mögliche Aktualisierung erinnert, wenn der Benutzer die Update-Information mit "Jetzt nicht!" weggeklickt hat. Die Zeitangabe erfolgt in Millisekunden: 5 Tage würde man als 1000*60*60*24*5 kodieren.

delayBetweenUpdates

Bestimmt, wie lange das Tool zwischen Serverzugriffen pausiert, um keinen Stress auf dem Server zu erzeugen, z.B. wenn mehrere neue Beiträge automatisch angelegt werden müssen. Die Zeitangabe erfolgt in Millisekunden: 400 ms sind als Standard eingestellt. Der Wert sollte prinzipiell nicht verändert werden.

redirectToNewSite

Dieser Parameter steht standardmäßig auf true und reflektiert die Vereinbarung, dass Nicht-Admins sofort und automatisch auf den neuen Blog umgeleitet werden. Die Twoday-Plattform wird verlassen und die URL in der Browserzeile ändert sich auf die externe Blogadresse. Der Wert false dient nur zu Testzwecken (Verbleib im Twoday-iframe) und sollte im Normalfall nicht mehr verwendet werden!

needUpdateLevel
(seit Version 1.10.0)

Dieser Parameter legt fest, welche Mindestautorisierungsstufe ein angemeldeter Blogbesucher haben muss, um eine Synchronisierung des Blogs (und damit eine evtl. Aktualisierung der Blogroll) auszulösen. Mögliche Werte sind Owner (Standard) und Admin. Ist der Parameterwert "Owner", dann darf ausschließlich der Blog-Eigentümer (aka "creator") die Aktualisierung auslösen, Administratoren hingegen werden dann auch auf die externe Seite umgeleitet. Beim Wert "Admin" dürfen auch alle Administratoren des Blogs eine Aktualisierung initiieren.

debug

Auch hier sind mögliche Einstellwerte true und false. True erzeugt zusätzliche Console-Nachrichten für den Test/Fehlersuche, false unterdrückt diese Nachrichten (Standard).

Funktionsweise

Um das Menü angezeigt zu bekommen, müssen Sie als Owner/Admin des Twoday-Blogs eingeloggt sein. Erst dann erhalten Sie z.B. Zugang zu Parameter/Einstellungen. Normale User/Besucher sehen kein Menü, sondern werden direkt auf den neuen, externen Blog umgeleitet.

Jedesmal, wenn Sie als angemeldeter Admin Ihren Twoday-Blog aufrufen, läuft folgender Prozess ab:

  • der RSS Feed des neuen Blogs wird gelesen
  • die Titel, das Publikationsdatum und die Kommentaranzahl (soweit vorhanden) der Beiträge werden extrahiert
  • es wird geprüft, ob eine Veränderung stattgefunden hat, z.B. ein neuer Beitrag oder ein neuer Kommentar
  • ein neuer Beitrag wird auch in Twoday neu angelegt, jedoch nur mit Titel und Publikationsdatum sowie einigen (nicht sichtbaren) Metadaten im Text. Da der Twoday-Blog ja nicht mehr angezeigt wird, wird der Beitragstext selbst nicht kopiert (Titel und Veröffentlichungsdatum reichen, um in die Blogroll zu kommen).
  • bei einem neuen Kommentar wird ein Update auf den bestehenden Beitrag in Twoday gemacht (Veränderung der Metadaten).

Jede Neuanlage oder Veränderung eines Beitrags wird durch entsprechende Nachrichten auf dem Bildschirm angezeigt. Es wird auch eine Infonachricht gezeigt, wenn keine Neuerungen gefunden wurden.

Ergänzende Tipps

Twoday-Anmeldung wo?

Bedingt durch die Regel, dass Normalbesucher nun unmittelbar auf das neue, externe Weblog umgeleitet werden, ist es nicht mehr möglich, sich erst auf dem eigenen Blog anzumelden. Die richtige Reihenfolge für Eigentümer/Admins ist nun: 1. Twoday-Hauptseite aufrufen 2. Anmeldung dort ausführen 3. Erst dann den eigenen Twoday-Blog aufrufen. Das Script erkennt, dass Sie angemeldeter Eigentümer/Admin sind, belässt Sie auf Twoday und startet die üblichen Beitragsaktualisierungsarbeiten.

Beitragsänderung- oder -löschung wie?

Möchte man als Alien-Blog-Admin eigene (generierte) Beiträge ändern oder löschen (z.B. bei Doppelgenerierung), ist dies der empfohlene Weg: 1. Layouts-Seite (/layouts) aufrufen 2. das frühere/alte Layout testweise aktivieren 3. Beitragsübersicht aufrufen (/stories) 4. Änderungen/Löschungen vornehmen 5. Test des alten Layouts wieder beenden.

Dieses Tool ist Open Source — Lizenz MIT — Code Github

Donnerstag, 21. Juni 2018

Alien inside Twoday

alien.jpg

Im Grunde ist das Tool, das ich hiermit vorstelle, eine professionalisierte Weiterentwicklung der ehemaligen "Wordpress heiratet Twoday"-Lösung — und evtl. hat es nur noch eine sehr maue Lebensspanne von gerade mal 7 Tagen, eben bis dann auch der Juni abgelaufen sein wird, jener Monat, in welchem Twoday nun endgültig sterben soll. So ist das zumindest avisiert.

Aber wer weiß das schon alles so genau. Todgeweihte leben hierorts ja überraschend lange jenseits ihres Planexekutionstermins. Und vielleicht geht es ja ganz unbemerkt und friedlich in den Juli weiter. Ecco! ;)

Ich hätte das Tool auch "An Englishman in New York" taufen können, aber "Alien inside Twoday" war doch irgendwie wirklichkeitsnäher und infamer. Wer nämlich schon ein neues Blog sein eigen nennt, kann dieses jetzt in Twoday einpflanzen, quasi implantieren, und Twoday zeigt fortan nur diesen neuen (externen) Blog an. So wie ein Alien die menschliche Hülle nutzt, so nutzt das Tool Twoday, um mittels <iframe> den neuen Blog vollflächig im gesamten Fenster anzuzeigen. Das ist durchaus sehr angenehm, weil man fortan Beiträge und Kommentare nur noch an einem zentralen Ort hat — nämlich dem neuen Blog.

Das war in der Tat auch schon mit dem alten Wordpress-Heiratstool möglich, jedoch hatte dies damals den Nachteil, dass die Twoday Blogroll nicht mehr aktualisiert wurde, da die simple Einbindung nichts von Aktualisierungen auf der Wordpress-Seite (z.B. neue Beiträge oder neue Kommentare) mitbekam.

Vor 3 Tagen blitzten meine Synapsen mal wieder (leider nur) kurz auf und dann war auch dieses letzte Problem gelöst. Nun prüft das Tool zusätzlich, ob sich im neuen Blog relevante Veränderungen ergeben haben und spielt diese selbsttätig in Twoday ein, sobald man als eingeloggter Admin seinen eigenen Blog besucht. Das Alien pulsiert sozusagen und hält die Hülle am Leben.

Primär ist das Tool für Wordpress konfiguriert, jedoch können es tatsächlich alle Blogsysteme nutzen, die einen sog. RSS Feed bereitstellen — und diesen liefern beinahe alle, u.a. auch Blogspot (blogger.com) und Tumblr.

Installation

1 Das Alien-Template ist komplett in einem eigenen Layout gekapselt. Wer schon das Export-Tool installiert und genutzt hat, kann sein Wissen analog anwenden, denn das Alien-Layout wird exakt genauso importiert. Wer das nochmal nachlesen möchte, kann das unter Blog Export (Die Exportlösung installieren) tun. Zu importieren ist diese Layout-Datei:

 Alien-Layout (Zip-Datei) herunterladen

2 Im Gegensatz zum Export-Layout muss das Alien-Inside-Twoday-Layout nach seinem Import aktiviert werden.

Wählen Sie im Topmenü AdminLayoutMeine Layouts und dann neben dem AlienInsideTwoday-Layout auf "aktivieren" klicken.

alien/alien01.jpg

3 Rufen Sie nun Ihren Blog durch Klick auf Weblog ansehen auf. Sie sehen einen Platzhalterblog "die-netzialisten.de" und eine gelbe Hinweisnachricht, dass Sie im Menü noch die Parameter/Einstellungen auf Ihre Daten anpassen müssen.

alien/alien02.jpg

4 Klicken Sie nun oben rechts auf das Menü-Symbol ("Hamburger-Icon"), um das versteckte Menü zu öffnen:

alien/alien03.jpg

5 Klicken Sie im Menü links auf den Eintrag Parameter/Einstellungen, um zu den Einstellwerten zu gelangen.

alien/alien04.jpg

6 Sie befinden sich nun im Edit-Modus zum Skin Site.implant, der alle Einstellparameter enthält:

alien/alien05.jpg

In der nachstehenden Tabelle finden Sie die Informationen zu den jeweiligen Einstellparametern und welche Inhalte Sie dort eingeben können. Passen Sie die Parameterwerte nach Ihren Wünschen an und sichern Sie dann Ihre Änderungen! Sie müssen auf jeden Fall die Adresse Ihres neuen externen Blogs unter targetUrl sowie evtl. die rssFeedUrl und das commentsField (wenn Sie keinen Wordpress-Blog haben) abändern — alles andere können Sie zunächst so belassen und bei Bedarf auch später noch anpassen (z.B. die Farben).

Parameter/Feldname Bezeichnung/Mögliche Werte
targetUrl

Die URL Ihres neuen Blogs. Einige Beispiele:

https://dasgruselkabinett.de
https://omaschlafmuetze.wordpress.com
https://asiaspots.blogspot.com
https://spetzerfehn.tumblr.com
//www.kohlenspott.de
usw.
rssFeedUrl

Die Teil-URL des RSS Feeds. Beispiele:

feed (Default) für Wordpress-Blogs
feeds/posts/default?alt=rss für Blogspot-Blogs
rss für Tumblr-Blogs
commentsField

RSS-Feldname für Kommentarinformationen. Dieses Feld liefert die Information über die Anzahl der Kommentare zu einem Beitrag.

comments (Default) für Wordpress-Blogs
total für Blogspot-Blogs
{leer} für Tumblr-Blogs
forceHttp

Erzwingt einen Wechsel nach HTTP. Falls Ihr Zielblog nur unter http zu erreichen ist, dann muss forceHttp auf "true" gesetzt werden.

false (Default) HTTPS-Modus
true HTTP-Modus
colorAlias

Setzt die Farbe für den Blog-Alias links oben im Menü (6-stelliger Farbcode mit vorangehendem Hashtag '#' oder ein zulässiger Farbname)

#f04124 Farbcode einer hellroten Farbe
yellow Farbname für gelb
colorNavIcon

Setzt die Farbe für das Menüsymbol (Hamburger-Icon) rechts oben (6-stelliger Farbcode mit vorangehendem Hashtag '#' oder ein zulässiger Farbname). Das Menüsymbol überlagert Ihren Blog und kann damit farblich angepasst werden.

#ffffff Farbcode für Weiß
cyan Farbname für cyan
menuOffsetTop

Definiert ein vertikales Offset (Pixel) für das Menüsymbol, ausgehend vom oberen Rand (8 Pixel). Die Offsetangabe darf auch negativ sein.

0 Standard
30 Das Menüsymbol wird 30 Pixel weiter unten angezeigt.
-5 Das Menüsymbol wird 5 Pixel weiter oben angezeigt.
menuOffsetRight

Definiert ein horizontales Offset (Pixel) für das Menüsymbol, ausgehend vom rechten Rand (25 Pixel). Die Offsetangabe darf auch negativ sein.

0 Standard
15 Das Menüsymbol wird 15 Pixel weiter links angezeigt.
-10 Das Menüsymbol wird 10 Pixel weiter rechts angezeigt.
pauseChecks

Definiert eine Wartezeit (in Millisekunden), in der keine neue Abfrage des RSS Feeds erfolgt. Der Standard ist auf 2 Minuten eingestellt.

1000*60*2 Standard 2 Minuten (in Millisekunden) Wartezeit
1000*60*30 Der RSS Feed wird nur alle 30 Minuten neu gelesen, selbst, wenn Sie Ihre Twoday-Blogseite öfter aufrufen.
syncStories

Definiert die Anzahl der aktuellsten Beiträge, die mit Twoday synchronisiert werden. Der Standard ist auf 3 eingestellt, da auch nur maximal 3 Beiträge in der Twoday-Blogroll angezeigt werden.

3 Standard für 3 zu synchronisierende Beiträge
0 Ein Wert von Null unterbindet die Synchronisation. Es findet keine Neuanlage/Aktualisierung von Twoday-Beiträgen statt.
positionToast

Legt die Position fest, an der die Nachrichten des Tools ausgegeben werden.

toast-top-full-width Standard für Nachrichten oben in voller Breite
toast-top-right für Nachrichten oben rechts
toast-bottom-full-width für Nachrichten unten in voller Breite
[weitere Werte siehe auch hier zum Feldnamen "Position"]

Das soll für den Anfang genügen. Falls Twoday doch noch unerwartet länger lebt, ergänze ich noch Information zum Aktualisierungsprozess für das Tool. ;)

Funktionsweise

Um das vollständige Menü angezeigt zu bekommen, müssen Sie als Owner/Admin Ihres Twoday-Blogs eingeloggt sein. Erst dann erhalten Sie z.B. Zugang zu Parameter/Einstellungen. Normale User/Besucher sehen ein verkürztes Menü.

Jedesmal, wenn Sie als angemeldeter Admin Ihren Twoday-Blog aufrufen, läuft folgender Prozess ab:

  • der RSS Feed des neuen Blogs wird gelesen
  • die Titel, das Publikationsdatum und die Kommentaranzahl (soweit vorhanden) der Beiträge werden extrahiert
  • es wird geprüft, ob eine Veränderung stattgefunden hat, z.B. ein neuer Beitrag oder ein neuer Kommentar
  • ein neuer Beitrag wird auch in Twoday neu angelegt, jedoch nur mit Titel und Publikationsdatum sowie einigen (nicht sichtbaren) Metadaten im Text. Da der Twoday-Blog ja nicht mehr angezeigt wird, wird der Beitragstext selbst nicht kopiert (Titel und Veröffentlichungsdatum reichen, um in die Blogroll zu kommen).
  • bei einem neuen Kommentar wird ein Update auf den bestehenden Beitrag in Twoday gemacht (Veränderung der Metadaten).

Hinweis: Um herauszufinden, ob ein Beitrag in Twoday neu angelegt oder nur aktualisiert werden muss, prüft das Tool, ob ein Beitrag bereits in Twoday vorhanden ist. Da Publikationsdatum/-uhrzeit keine verlässliche Information ist, um die Gleichheitsprüfung durchzuführen (z.B. wenn man den Artikel zeitverzögert auf beiden Blogs gepostet hat), verwendet das Tool ausschließlich den Titeltext. Es ist also hilfreich, stets eineindeutige Titeltexte für Beiträge zu verwenden.

Jede Neuanlage oder Veränderung eines Beitrags wird durch entsprechende Nachrichten auf dem Bildschirm angezeigt. Es wird auch eine Infonachricht gezeigt, wenn keine Neuerungen gefunden wurden.

Natürlich kann man jederzeit zurück auf sein altes Layout wechseln, sollte es überraschend doch noch 10 Jahre weitergehen hier bei Twoday. ;)

Dieses Tool ist Open Source — Lizenz MIT — Code Github

Dienstag, 6. Februar 2018

Die Blogaufräum-Heldenliste

Wichtiger Hinweis

Schlechte Zeiten für Bloghelden: Mit der Bekannt­gabe des Abschalt­datums von Twoday zum 31.05.2018 ist diese Initiative zur Blog­bereinigung obsolet geworden. Nutzen Sie die ver­bleibende Zeit zur Sicherung Ihrer Blog­inhalte, z.B. mit diesem Tool.

https-ergebnisse.jpg

Jede Initiative, und besonders eine zur Verbesserung dieser Blogplattform, ist sinnlos, wenn man nicht deren Wirksamkeit misst, mindestens um zu analysieren, ob der Aufwand sich gelohnt hat, oder ob man die Maßnahme vielleicht verbessern kann, oder — ganz elementar — ob überhaupt noch Interesse an einer organisierten Heilung von Mängeln besteht.

Nun ist von den inaktiven Blogs (die habe ich für mich mal definiert als die Blogs, bei denen die letzten 90 Tage kein neuer Artikel hinzugekommen ist) wahrscheinlich eh nichts mehr zu erwarten, aber immerhin bleiben noch aktive Blogs, deren Besitzer:Innen noch ein Interesse an der Fehler­freiheit und einer minimalen Erhal­tungs­pflege dieser Plattform haben könnten.

Doppelt schade, wenn man nach doch angemessener Zeit feststellt, dass nur wenige Mutige das Angebot aufgegriffen haben und die bei weitem überwiegende Menge bislang nicht bereit war, das wenige eigene Mögliche beizusteuern, um Twoday zumindest graduell zu verbessern (oder sagen wir besser: nicht weiter absinken zu lassen).

Sieben. Obwohl, eigentlich sind's nur sechs, da Frau Araxe gleich zwei ihrer Blogs in der Liste verantwortet. Sechs also haben mitgemacht. Hm, tatsächlich nicht besonders ermutigend, wenn eine Lösung von weniger als derjenigen genutzt wird, für die sie gemacht wurde. Daher geht mein Dank an die Sechs, die Bloghelden, die Technik-Avantgardisten, die Nicht-Aufgeber, die Anpacker und Macher, die, die nicht nur rumnörgeln, sondern selbst einen Beitrag leisten (Bonuslob an der Stelle für Herrn Blödbabbler für die 100%-Abdeckung, zweites Bonuslob für Frau Araxe als einzige teilnehmende Frau ;).

 Stand:

Aktive Blogs Inaktive Blogs
Übersicht
  • Letzte Änderung <=
  • Twoday Blogs
  • davon mit http-Urls
  • und mit altem rootStat-Skin
  • bereinigt wurden:
  • Letzte Änderung >
  • Twoday Blogs
  • davon mit http-Urls
  • und mit altem rootStat-Skin
  • bereinigt wurden:
HTTP-Referenzen bereinigt?
Skin root.statsCounter bereinigt?
Die ultimative Heldenliste

heldenkranz.png

 Diese großherzigen, lösungsorientierten, avantgardistischen, community-unterstützenden Vorreiter-Blogs haben ihre Blog-Bereinigung bereits erfolgreich durchgeführt (mit Herrn Blödbabbler als primus inter pares, weil Doppel-ja rules!!! Respekt!!). 

Blogheld Referenzen bereinigt? root.statsCounter bereinigt?

Sie wollen auch auf die Heldenliste? Hier startet der sichere Weg dahin.

Motivationshilfe für Nachzügler

Womöglich sind sich einige Blogger:Innen noch gar nicht recht bewusst, was der https-Modus für ihr Blog bedeutet und dass die meisten ihrer Besucher dort sehr viele leere Stellen bzw. nicht funktionierende Sidebar-Elemente sehen. Ein Aufruf des eigenen Blogs mit vorangehendem https://-Kürzel hilft beim Erkennen der Probleme. Insbesondere den folgenden Top10-Bloggern mit den meisten unwirksamen http-Urls wäre dies ans Herz zu legen:

Blog Unwirksame http-Urls https-Blogadresse (Check)

Anmerkung: quh und corum sind mit ihren Blogs bereits umgezogen.

Weitere Informationen zu den Detailproblemen in den Blogs kann man hier finden — ansonsten gerne Frage als Kommentar hinterlassen oder ein Mail senden.

Donnerstag, 25. Januar 2018

Korrigiert Eure Blogs! Jetzt!

Wichtiger Hinweis

Schlechte Zeiten für Bloghelden: Mit der Bekannt­gabe des Abschalt­datums von Twoday zum 31.05.2018 ist diese Initiative zur Blog­bereinigung obsolet geworden. Nutzen Sie die ver­bleibende Zeit zur Sicherung Ihrer Blog­inhalte, z.B. mit diesem Tool.

https-umstellung.jpg

Ihre Blogcounter- und Statistiklösungen funktionieren nicht mehr richtig? Ihre Sidebar-Widgets erscheinen nicht? Eingebettete Videos werden mal angezeigt — und dann wieder nicht? Hier finden Sie die Lösung dieser Probleme, die übrigens auch zu der viel kritisierten Google-Penalty beitragen. Ein Grund mehr für alle Twoday-BloggerInnen, zumindest mal diesen Stein des Anstoßes aktiv beiseite zu räumen.

Vor ziemlich genau einem Jahr hat Twoday auf einen zweigleisigen Protokollbetrieb umgestellt: seither können alle Blog- und Plattformseiten entweder im http- oder im https-Modus aufgerufen werden.

Leider gibt es keine strikte Festlegung, welcher Modus verlässlich genutzt wird und so ist man, je nachdem, mit welchem Aufruf man zu twoday.net gelangt ist, mal im unsicheren http, mal im sicheren (weil verschlüsselten) https Mode:

URL-Aufruf im Browser Aktivierter Modus
twoday.net http
//twoday.net http
www.twoday.net https
//www.twoday.net https
https://twoday.net https
https://www.twoday.net https

Da man so nicht sicherstellen kann, in welchem Modus Besucher auf das eigene Blog gelangen (und die Wahr­schein­lich­keit für https zudem deutlich größer ist), hat das gravierende Auswirkungen auf die Blog­funktio­na­li­tät. Ist ein Besucher nämlich im sicheren https-Modus, verweigert der Browser die Ausführung und Anzeige aller Ressourcen, die im Blog per "unsicherer" http-URL aufgerufen werden, z.B.

  • script-Aufrufe (z.B. Counter, Statistiken, IP-Anzeigen)
  • embed-Befehle (z.B. Youtube-Videos)
  • iframe-Einbettungen (z.B. Wetter-Widgets, Facebook, FeedJit Live Traffic)

Dies bedeutet, dass Ihre Counter-/Statistik-Skripte nicht ausgeführt werden, Embed-Videos schwarz bleiben und iframe-Einbettungen nicht erscheinen! Die Lösung dieses Problems ist im Grunde einfach:

Nur URLs, die mit https beginnen, werden immer (d.h. in allen Modi) ausgeführt!

Ein Besucherzähler, der nur Besucher zählt, die über http auf den Blog kommen, ist sinnlos, ebenso wie ein embed-YouTube-Video, das bei einem Besucher angezeigt wird und beim nächsten nicht.

TippStellen Sie alle script-, embed- und iframe-Aufrufe in Ihrem Blog auf https:// um.

Im Prinzip ist diese Umstellung sehr einfach: Sie müssen die unwirksamen http-Referenzen identifizieren und im Blog (= Ihren Twoday Skins oder Beiträgen) finden, dann prüfen, ob der Anbieter auch https bereitstellt, um anschließend das http-Kürzel auf https zu ändern. Im folgenden beschreibe ich, wie das am effektivsten geht.

1. Unwirksame http-Referenzen identifizieren

Zur Unterstützung habe ich ein kleines Tool entwickelt, das für die zuletzt geänderten 750 Twoday-Blogs (das sind die ersten fünfzig Seiten der Twoday-Blogroll) alle unwirksamen http-Aufrufe findet und auflistet.

Das Tool durchsucht dabei nicht Ihren gesamten Blog, sondern nur die aktuelle Homepage und die derzeit dort angezeigten Beiträge. Die Analyseergebnisse werden nicht realtime ermittelt, sondern reflektieren die Resultate des letzten Analyselaufs vom .

Zeige Analyseläufe bisher 

Lauf Datum
#

Wenn Sie Änderungen in Ihrem Blog vornehmen, werden diese erst nach dem nächsten Analyselauf hier angezeigt!

Bitte wählen Sie in der nachstehenden Auswahlbox Ihren Blog aus, um unwirksame http-Aufrufe anzuzeigen, die in Ihrer Homepage verwendet werden:

http-Referenzen von Twoday-Blogs (Stand: )
Icon
https://

.twoday.net
https.jpg
Lade Bloginformationen...

Falls Sie eine grüne Nachricht erhalten: Prima! Ihre Homepage und die dort angezeigten Beiträge enthalten keine unwirksamen http-Aufrufe. Sie brauchen nichts zu unternehmen.

Eine rote Nachricht zeigt an, dass in Ihrem Blog unwirksame http-Aufrufe gefunden wurden. Diese werden unter der Nachrichtenbox vollständig mit dem jeweiligem HTML-Befehl und der verwendeten (hier evtl. verkürzt angezeigten) URL gelistet.

2. Stellt der Anbieter den Dienst auch per HTTPS bereit?

Zunächst macht es Sinn, zu prüfen, ob die verwendete http-URL überhaupt noch existiert. Mancher Anbieter ist aus dem Markt gegangen oder von anderen Unternehmen übernommen worden (Bsp. sitemeter.com, formspring.me). Falls die URL-Adresse gültig ist und Sie dieses Angebot/diese Funktion weiter in Ihrem Blog nutzen möchten, ist zu prüfen, ob dieser Service auch im sicheren HTTPS Modus verfügbar ist.

Für die wichtigsten und am häufigsten verwendeten Dienste finden Sie nachstehend diese Information — für andere müssen Sie diese ggf. selbst ermitteln. Ist die URL jedoch nicht mehr sinnvoll nutzbar, entfernen Sie die Referenz (z.B. den Script-Aufruf) aus dem Skin und speichern ihn neu ab.

Infos zu den am häufigsten benutzten Diensten anzeigen 


URL / Domäne Häufigkeit Existiert noch? Bietet HTTPS? Empfehlung
3. http-Referenzen im Blog finden

Twoday-Blogs setzen sich aus sog. Skins zusammen, welche das Layout und die Darstellung des Blogs bestimmen. Der wichtigste Skin, in dem wohl die meisten http-Referenzen zu finden sein werden, ist der Skin der Hauptseite Site.page.

Zu den Skins gelangen Sie über Klick auf Admin1)LayoutSkins (HTML). Die von Ihnen in der Vergangenheit bearbeiteten (d.h. irgendwann einmal veränderten) Skins finden Sie aufgelistet, wenn Sie auf Bearbeitete Skins klicken. Alle dort angezeigten Skins könnten http-Referenzen enthalten, oft z.B. in Story.display oder Site.weblogStatus.

1) Falls Sie Ihre Menüleiste ausgeblendet haben, kommen Sie mit {ihrblogname}.twoday.net/manage in den Admin-Bereich

Weitere potenzielle Fundorte von gesuchten http-Referenzen sind die Sidebar-Module. Klicken Sie auf der Admin-Seite oben auf den Tab Module2) und prüfen Sie z.B. den Inhalt der Freetext-Module (1-5) oder das Web-Counter Modul, ob dort eine der unwirksamen http-URLs verwendet wird.

2) Zu den Sidebar-Modulen gelangen Sie auch über die URL {ihrblogname}.twoday.net/modules/sidebar

Außer in den Skins und Modulen können unwirksame http-Referenzen auch in den Beiträgen selbst vorkommen, wobei dies dann meist embed-Befehle sind (script / iframe sind in Beiträgen ja generell verboten). Wenn Sie embed-Befehle finden, stellen Sie sicher, dass diese nur noch https-Quellen (z.B. Videos) aufrufen.

Arbeiten Sie Ihre Liste der unwirksamen http-Referenzen ab, bis Sie alle Aufrufe gefunden und diese

  • entweder auf https geändert haben,
  • mit einem neuen Anbieter (z.B. ein neuer Counter) ersetzt haben,
  • oder aus dem Code entfernt haben.

4. Twodays Web-Counter Problem

Im Web Counter Modul bietet Twoday im Standard drei vordefinierte Counter-Einbindungen an: blogcounter.de, sitemeter.com und blogstats.de:

webcountermodul.jpg

Jede dieser drei Optionen ist mittlerweile unbrauchbar: blogcounter.de bietet keinen sicheren https-Modus an (und zählt daher nur http-Besuche), sitemeter.com und blogstats.de existieren nicht mehr. Sollten Sie eine dieser Optionen gewählt haben, deaktivieren Sie sie!

Nutzen Sie stattdessen die verbleibende Option "Anderer Counter" und kopieren Sie in das Textfeld den Code zur Einbindung des von Ihnen gewählten Counters mit https-Fähigkeit. Kostenlose Counter mit https-Eignung gibt es z.B. bei statcounter.com oder trendcounter.com (weitere Empfehlungen gerne hier als Kommentar posten).

Der jeweilige Counter-Anbieter gibt vor, welcher Einbettungscode von Ihnen in das Textfeld "Anderer Counter" zu kopieren ist.

5. Twodays Google Analytics Problem

Im nicht direkt zugreifbaren Skin root.statsCounter, der in jede Twoday-Blogseite eingebaut wird, liegt ein weiteres Problem verborgen: Twodays eigener Google-Analytics-Aufruf funktioniert nicht unter https, da die Skripteinbettung mit einer fixen http-Adresse gespeichert ist. Dadurch wird kein einziger Twoday-Besuch via https gezählt. Außerdem ist das derzeit gerufene Skript (urchin.js) schon ewig veraltet und sollte längst durch eine neue Version ersetzt worden sein (analytics.js). Dieses Problem können wir bei unserer Be­reini­gungs­aktion gleich mit beheben: wir ersetzen den veralteten Code im Skin root.statsCounter durch einen korrekten, aktuell gültigen Code.

Twoday Analytics Problem beheben für Blog:
Icon
https://

.twoday.net

Ich kann den Layout-Namen dieses Blogs nicht selbsttätig ermitteln, da Sie bei der Neu­anlage keinen eigenen Namen vergeben haben. Bitte ermitteln Sie den Layout-Namen daher selbst und geben Sie ihn in das unten angezeigte Feld ein!

meinlayoutname.gif

Schritt 2
Skin-Editor für root.statsCounter des Blogs aufrufen...

Damit der Link zum Skin-Editor funktioniert, müssen Sie bei Twoday angemeldet sein und für den ausgewählten Blog Administratorrechte besitzen. Im Skin-Editor angekommen, führen Sie bitte folgende Aktion aus:

  1. In das große (letzte) Textfeld klicken.
  2. Taste -A drücken, um den gesamten Inhalt zu markieren.
  3. Taste -V drücken, um den markierten Inhalt mit dem neuen zu ersetzen.
  4. Ganz unten auf Speichern und Schließen klicken.

Führen Sie diese zwei Schritte nacheinander für jedes Ihrer Blogs durch (respektive die Blogs, auf die Sie Administrator­zugriff besitzen).
6. Letzte Worte Tipps
  1. Verwenden Sie keine Ressourcen mehr, die nur über http erreichbar sind. Einzige Ausnahme sind Bilder, die (derzeit noch) im sicheren Modus angezeigt werden, auch wenn sie nur eine http-Url haben. Aber: Wenn der Bildspeicherplatz (wie z.B. Flickr, Cloudinary) ein https-Protokoll anbietet, nutzen Sie dieses und binden Bilder über https ein!
  2. Verwenden Sie keine Flash-Ressourcen mehr (SWF-Dateien). Flash ist tot, böse und steht mit dem Teufel im Bunde. Es hat Gründe, weshalb Chrome, Firefox u.a. die Ausführung von Flash im Browser mittlerweile standardmäßig gesperrt haben. Wirklich! Kein Flash mehr!
  3. Wenn Sie Videos noch über embed einbinden wollen, verwenden Sie nur noch https-Adressen. Nutzen Sie für Videos und andere Dienste von derzeit 20 Plattformen alternativ das bewährte Videoload-Tool, welches immer die korrekten https-Adressen generiert.

Ich werde die Analysedaten über die unwirksamen http-Adressen in unregelmäßigen Abständen aktualisieren. Sie können dann anhand der neuen Daten kontrollieren, ob Sie bereits alle Probleme erfolgreich bereinigt haben.

Dieses Tool ist Open Source — Lizenz MIT — Code Github

Mittwoch, 20. Dezember 2017

Videoload News: TED Talks und Umfragen mit Strawpoll

Quasi als kleine Twodayadventsüberraschung ist Videoload ab sofort in der Lage, auf dieser stoisch altbackenen Blogplattform auch beliebige TED-Talks der TED-Webseite in einem Beitrag anzuzeigen (zu sehen oben in Pamela Meyers Rede: How to spot a liar).

Falls der TED Talk deutsche Untertitel besitzt, können diese über einen Videoload-Parameter aktiviert werden (so wie z.B. im obigen Beispiel).

Zusätzlich habe ich auch die Umfrageplattform strawpoll.me in das Videoload-Tool integriert. Zwar bietet Twoday auch eine eigene Umfragemöglichkeit an, jedoch scheint mir die Strawpoll-Lösung etwas schneller umsetzbar und auch effizienter zu sein, da sie durch das wahlweise aktivierbare Google-Captcha weniger gut durch Bots manipulierbar ist.

Als anschauliches Beispiel hierfür eine aktuelle Befindlichkeitsumfrage zum Zustand Twodays (*harhar*):

Das Videoload2-Script wurde entsprechend erweitert und in dieser neuen Version auch schon hochgeladen/aktiviert. Bestehende Nutzer von Videoload2 können somit die neuen TED- und Strawpoll-Optionen ohne eigene Aktivität sofort nutzen (außer vielleicht den Browser-Cache einmalig zu löschen, damit die aktualisierte Version geladen werden kann). Mit diesen beiden Neuzugängen können nun Einbettungen von 20 verschiedenen Plattformen in Twoday-Beiträge integriert werden.

Wer Videoload und die damit verbundenen Möglichkeiten zukünftig nutzen möchte, kann sich hier über die Installation und Arbeitsweise informieren. Dort ist auch beschrieben, wie TED Talk Videos eingebunden werden bzw. wie eine neue Strawpoll-Umfrage angelegt und in einem Beitrag angezeigt werden kann. Dazu bitte im Beitrag den Abschnitt "Videoload verwenden" öffnen und dort etwas weiter unten auf einen der blauen Tabs TED bzw. Strawpoll klicken.

Wie immer gilt: Fragen und Probleme bitte gerne hier hinterlassen — ich versuche, diese zeitnah zu beantworten.

P.S. Wer in diesem Beitrag gelbe Fehlermeldungen zu sehen bekommt, muss einmal seinen Browser-Cache löschen bzw. einmal einen Hard Reload ausführen (Strg-F5 für Windows bzw. Cmd-Umschalt-R für Mac), um die aktuelle Videoload-Version zu laden.

Dienstag, 21. November 2017

Videoload News: Einbinden von Filmtrailern

filmstarts.jpg

Wer Filmtrailer des Filmportals filmstarts.de in seine Beiträge einbinden möchte, kann dies jetzt mithilfe des Videoload2-Tools auch bei Twoday tun.

Das Videoload2-Script habe ich entsprechend erweitert und in dieser neuen Version auch schon hochgeladen/aktiviert. Existierende Nutzer von Videoload2 können somit die neue Option ohne eigene Anpassungen sofort nutzen. Mit diesem Neuzugang können nun Videos und andere Einbettungen von 18 verschiedenen Plattformen auf einfache Weise in Twoday-Beiträge integriert werden.

Wer Videoload und die damit verbundenen Möglichkeiten zukünftig nutzen möchte, kann sich hier über die Installation und Arbeitsweise informieren.

Zur Veranschaulichung nachfolgend die Einbindung des Trailers "Aus dem Nichts" mit Diane Kruger:

Montag, 5. Dezember 2016

Videos reloaded - Neue Videoload-Version 2

Dieser Beitrag dokumentiert die nunmehr zweite, vollständig überarbeitete Version des Videoload-Werk­zeugs, mit dem sich in Twoday auf einfache Weise Video-, Audio- und andere Quell­formate einbinden lassen, die ansonsten mangels iframe-Möglich­keit unter Twoday draußen bleiben müssten. Er ersetzt voll­ständig die alte Doku­men­tation in diesem Beitrag vom Februar 2015.
Wichtige Infos für bisherige Videoload-Nutzer

1 Um die neue Videoload-Version nutzen zu können, müssen Sie den Aufruf des Scripts im Twoday-Skin Site.page einmalig ändern. Wie das geht, wird weiter unten im Abschnitt Upgrade auf Videoload Version #2 beschrieben.

2 Die alte Tool-Version bleibt zwar weiterhin abrufbar, wird jedoch nicht mehr gepflegt. Die neue Version ist um Größenordnungen schneller, beinhaltet außerdem neue Anbieter wie z.B. Bandcamp, dctp.tv, Slideshare sowie Speakerdeck und ist bereinigt um mittlerweile nicht mehr aktive Anbieter (z.B. myvideo.de). Ich rate wärmstens zum vertrauensvollen Umstieg auf Videoload #2! ;)

videoload/videoinst.jpg

In der IT ist das so eine Sache mit der Pflege und Wartung von Alt-Software. So schwankt man beim Wiederstudium von älteren eigenen JavaScript-Codeschnipseln zwischen sehr ambivalenten Gefühlen, die sich irgendwo zwischen "Diese in einem magischen Moment entstandene brillante Codestrecke verstehen nur noch Gott, Mark Zuckerberg oder mein früheres Ich!" und "War ich das? Wie schlecht ist das denn bitte programmiert?" bewegen.

Jeder hat eben das Recht, täglich etwas schlauer zu werden. Und so ist auch Videoload erwachsener geworden, sehr viel schlanker und auch deutlich schneller. Für interessierte Techies und Nerds gibt's hier weitere Informationen.

Warum Videoload und wozu dient es?

Seit die meisten Videoplattformen und Content-Anbieter den alten <embed>-Befehl zugunsten des mo­derneren <iframe>-Formats aufgegeben haben, ist eine Einbindung solcher Quellen mit Standardmitteln bei Twoday nicht mehr möglich. In Twoday-Beiträgen wird jeder mutige Versuch einer direkten iframe-Nutzung beim Speichern des Beitragstextes sofort wieder herausgefiltert.

Videoload führt einen Ausgleich zwischen Twodays berechtigtem Sicherheitsinteresse und den Content-Wünschen der Nutzer herbei, indem es valide und überprüfbare iframe-Aufrufe für einen definierten Kreis von sicheren Anbietern erzeugt. Derzeit (Stand: Dezember 2020) generiert Videoload Verbindungen zu 19 verschiedenen Plattformen und bindet den gewünschten Inhalt (z.B. ein YouTube-Video) auf einfache Weise in den jeweiligen Blogbeitrag ein. Folgende Provider stehen zur Verfügung:

Klick auf Icon öffnet die jeweilige Anbieterseite

Videoload bietet nicht nur Zugriff auf die wichtigsten Videoanbieter, sondern stellt auch Audioinhalte (z.B. via Bandcamp, Soundcloud), Präsentationen (z.B. via Slides, Slideshare, Speakerdeck), GIFs (via Giphy), Code-Snippets (via Jsfiddle) oder eigene Umfragen (via Strawpoll) bereit.

Erstmalige Installation

Zur Installation Ihrer neuen Videoload-Möglichkeiten ist eine einmalige Anpassung des Twoday-Skins Site.page erforderlich:

  1. Melden Sie sich auf Twoday mit Ihrem Account an und rufen Sie Ihr Blog auf.
  2. Wählen Sie in der Menüzeile oben AdminLayout und dann Skins (HTML).
  3. Klicken Sie auf die Überschrift Hauptseite (Site.page), danach in das Feld mit dem Scrollbalken und wandern Sie ganz an das untere Ende der Anzeige.
  4. Kopieren Sie dort vor das abschließende </body>-Element folgende Zeilen hinein:
    <script type="text/javascript" src="<% staticURL %>cdn/files/videoload2-min-js.js"></script>
    <script type="text/javascript">video2day.run();</script>

    Wie kopiere ich das?

    Ihr Skin Site.page sollte nun in etwa so aussehen:

    videoload/install.jpg

    <% staticURL %> ist ein Twoday-Makro und steht für "https://static.twoday.net/", dem abgesicherten Blogspeicher für Twoday-Bilder oder -Dateien.

  5. Klicken Sie auf "Speichern und Schließen" um Ihre Änderungen zu sichern. Sie können nun zu jeder Zeit in Ihren Twoday-Beiträgen Video- und Audioelemente der aufgeführten Plattformanbieter einbinden. Wie das funktioniert, finden Sie im übernächsten Abschnitt Videoload verwenden.

Upgrade auf Videoload Version #2

Falls Sie bereits die Erstversion des Videoload-Scripts nutzen, sollten Sie auf die neue Version 2 umstellen. Hierzu ist der Aufruf von Videoload im Skin Site.page anzupassen bzw. zu ergänzen.

Bisher steht dort am Ende des Skins, vor dem abschließenden </body>-Befehl, folgender Eintrag:

<script type="text/javascript" src="<% staticURL %>cdn/files/videoload-min-js.js"></script>

Bitte ändern/erweitern Sie den Aufruf wie folgt:

<script type="text/javascript" src="<% staticURL %>cdn/files/videoload2-min-js.js"></script>
<script type="text/javascript">video2day.run();</script>

Wie kopiere ich das?

d.h. also in Zeile 1 den Scriptnamen videoload in videoload2 ändern und die zweite Zeile darunter ergänzen.

Selbstverständlich ist die Version #2 vollständig abwärtskompatibel zur Erstversion, d.h. alle bisherigen Videoeinbettungen funktionieren sofort und ohne Änderung mit der neuen Version problemlos weiter.

Videoload verwenden

Um ein Video in einem Beitrag anzuzeigen, verwenden Sie einen einfachen DIV-Befehl, der z.B. für ein YouTube-Video so aussieht:

<div class="html5video youtube" id="DyfM7oLIlp0"></div> …

An der feststehenden Zeichenkette html5video erkennt das Videoload-Script, dass es innerhalb dieses div-Elements eine Einbettung vornehmen soll. Die darauf folgende Anbieterkennung bezeichnet die Plattform, von der das anzuzeigende Objekt stammt. Im Beispiel oben soll ein Youtube-Video generiert werden. Im Attribut id legen Sie fest, welches Youtube-Video angezeigt wird (jedes Anbieterelement hat eine eindeutige Identifikation).

Die betreffende ID findet sich meist recht einfach im Einbettungs­code des Videoanbieters (dem <iframe>-Befehl) und besteht i.d.R. aus einer kurzen Kombination von Zahlen und Buchstaben. In der Tabelle "Individuelle Parameter je Anbieter" weiter unten finden Sie eine genaue Information, wie Sie die benötigte ID bei jedem Anbieter manuell ermitteln. Außerdem stelle ich im Folgekapitel ein Tool vor, das die notwendigen Daten voll­automatisch aus dem kopierten iframe-Einbettungs­code ermittelt und für Sie den korrekten Twoday-DIV-Befehl gebrauchsfertig zusammenstellt. Damit entfällt die manchmal etwas umständliche Suche nach der richtigen ID.

Die passende Kennung für einen der 19 möglichen Anbieter finden Sie unten als Beschriftung in den blauen Tabulatoren. Um also ein Vimeo-Video einzufügen, heißt der entsprechende DIV-Befehl

<div class="html5video vimeo" id="{eine-vimeo-id}"></div>

Für die Anzeige eines GIFs von giphy.com wäre das DIV-Element folgendermaßen zu schreiben:

<div class="html5video giphy" id="{eine-giphy-id}"></div>

Minimal benötigt eine Einbettung also stets drei Informationen: den feststehenden Bezeichner html5video, die Textkennung des gewünschten Anbieters und die eindeutige ID des anzuzeigenden Elements.

Ergänzende Einstellparameter

Es gibt weitere Parameter, mit denen Sie die Breite und das Seitenverhältnis des einzubettenden Elements beeinflussen können. Diese beiden Parameter sind für alle Anbieter zulässig.

Parameter bestehen mindestens aus dem Parameternamen und — soweit erforderlich — aus einem Parameterwert, verbunden durch einen Bindestrich. Eine Breitenangabe kann z.B. width-500 sein; ein Parameter zum Seitenverhältnis z.B. ratio-1.6834. Kommazahlen müssen dabei stets mit Punkt geschrieben werden.
width — Breite festlegen/begrenzen

Im oben gezeigten Beispiel nimmt das Youtube-Video die volle Breite des umgebenden Containers ein, d.h. es füllt die Twoday-Beitragsspalte horizontal vollkommen aus. Falls Sie das Video kleiner darstellen wollen, können Sie zusätzlich eine Breitenangabe mithilfe des width-Parameters machen. Für eine Breite von z.B. 350 Pixeln lautet der Befehl:

<div class="html5video youtube width-350" id="DyfM7oLIlp0"></div> …

ratio — Seitenverhältnis einstellen/korrigieren

Die meisten Videos haben ein Seitenverhältnis von 16:9, d.h. ein Verhältnis von Breite zu Höhe von 1,77778. Manche Videos haben noch ein 4:3 Verhältnis (1,33333) und wieder andere eine sehr individuelle Streckung (z.B. bei Breitbildformaten). Das Script verwendet im Standard die 16:9-Anzeige. Wenn das Video verzerrt dargestellt wird, können Sie ein eigenes Seitenverhältnis einstellen. Der Befehl für ein Vine-Video mit einem Seitenverhältnis von 1,0 und einer Breite von 400 Pixeln lautet dann:

<div class="html5video vine ratio-1 width-400" id="OTtQVYI2JY2"></div> …

Dies bewirkt in diesem Fall, dass das Video die gleiche Höhe wie Breite erhält, d.h. 400 Pixel breit und hoch ist.

Neben diesen beiden grundsätzlich verwendbaren Parametern gibt es je Plattform verschiedene individuelle Parameter, mit denen man bestimmte Funktionen oder Darstellungsweisen des Anbieters aktiviert. Diese sind je Plattform in den nachstehenden Tabs beschrieben.

Individuelle Parameter je Anbieter

Klick auf ein Tab öffnet die Dokumentation für diesen Anbieter

Einen Moment bitte, die Dokumentation wird geladen...

Videoload-Tool nutzen

Twoday-Videoload-Code automatisch generieren

Es ist evtl. etwas mühsam, die oben beschriebenen Parameter für jeden der 19 Anbieter im Kopf zu behalten oder erst wieder nachzuschlagen, wenn man sie benötigt. Aus diesem Grund habe ich zusätzlich ein kleines Online-Tool erstellt, das den Twoday-Code automatisch für Sie zusammenstellt.

Sie müssen nur noch den vom jeweiligen Anbieter bereitgestellten iframe-Einbettungscode in das Formularfeld iframe-Code des Tools kopieren 1. Dieses erkennt die jeweilige Quellplattform, extrahiert die korrekte ID des Elements sowie alle anderen erkannten Einstellparameter. Daraus generiert es den kopierfertigen HTML-Befehl für Ihren Twoday-Beitrag und zeigt diesen im Feld HTML-Code an 2.

videoload/videoload1.jpg

Beispiel: Bandcamp-Audio

Nehmen wir ein konkretes Beispiel: Sie möchten das Album "Love & War & The Sea In Between" (Josh Garrels) von der Plattform Bandcamp in einen neuen Twoday-Beitrag einbetten. Sie haben den entsprechenden iframe-Befehl auf seiner Albumseite ermittelt und in die Zwischenablage kopiert. Nach Aufruf des Videotools fügen Sie den kopierten iframe-Befehl in das Eingabefeld iframe-Code ein 1.

Das Videotool analysiert den übergebenen Befehl und stellt alle erkannten Parameter in einem speziellen DIV-Kommando2 zusammen, aus dem das Videoload-Script später wieder den eigentlichen Einbettungsbefehl erstellt.

videoload/videoload2.jpg

Unter dem HTML-Befehl zeigt das Tool das von Ihnen gewünschte Element an, und zwar so wie es später auch beim Aufruf des Beitrags zu sehen sein wird 3. Sie haben nun die Möglichkeit, die Anzeige weiter zu konfi­gurieren, z.B. Größe und Erscheinungsbild zu ändern oder weitere Parametereinstellungen vorzunehmen, die für diesen Anbieter zulässig sind. Klicken Sie hierfür auf die grüne Schaltfläche "Parameter ändern / manuell setzen...".

videoload/videoload3.jpg

Statt des iframe-Code-Feldes wird nun eine Detailansicht mit allen verfügbaren Einstellparametern angezeigt. Die einzelnen Felder sind bereits mit den Werten vorbelegt, die aus dem iframe-Befehl herausgelesen werden konnten. Ändern Sie eine Einstellung, wird der zugehörige HTML-Befehl sofort neu generiert und als Kopiervorlage angezeigt.

videoload/videoload4.jpg

Wenn Sie z.B. die Bandcamp-Linkfarbe ändern und zusätzlich eine Tracklist mit 6 Songs anzeigen wollen, stellen Sie dies in den zugehörigen Feldern ein. Unmittelbar passt das Tool auch den HTML-Befehl an die veränderten Einstellwerte an.

videoload/videoload5.jpg

Das tatsächliche Aussehen des Elements können Sie unterhalb des Codes kontrollieren. Entspricht alles Ihren Vorstellungen, markieren Sie den fertigen HTML-Befehl und kopieren ihn in die Zwischenablage.

videoload/videoload6.jpg

Navigieren Sie nun zu Ihrem Beitrag und fügen Sie den kopierten Code an der gewünschten Stelle in den Text ein:

videoload/videoload7.jpg

Dieser Ablauf funktioniert für jeden der 19 Anbieter identisch. Wollen Sie also ein YouTube-Video in Ihren Beitrag einfügen, kopieren Sie den entsprechenden iframe-Code des Videos und das Tool zeigt Ihnen das passende DIV-Kommando für die Einbettung im Twoday-Beitrag.

Das Videotool finden Sie dauerhaft unter folgender Linkadresse:

https://neonwilderness.twoday.net/stories/videotool2

oder per Schaltfläche hier im Beitrag sowie rechts unten in der Sidebar:

Videotool aufrufen...

Videoload parametrisieren (für erfahrene Nutzer)

Script-Verhalten über Parameter steuern

Im Aufruf des Videoload-Scripts video2day.run(); (siehe Abschnitt "Installation") müssen keine Parameter innerhalb der Klammer mitgegeben werden, wenn Sie die Standardeinstellungen nutzen wollen. Gleichwohl kennt das Script eine Reihe von Einstellparametern, mit denen Sie sein Verhalten beeinflussen können. Diese werden nachstehend erläutert. Parameter übergeben Sie stets in geschweiften Klammern, wobei die einzelnen Parameter durch Komma getrennt sind:

video2day.run( {parameter1: wert, parameter2: wert, ... , parameterx: wert} );

Um z.B. die Breite für alle Videoload-Elemente auf maximal 400 Pixel zu begrenzen und außerdem den Debug-Modus einzuschalten, muss der Videoload-Aufruf inkl. der entsprechenden Parameter folgendermaßen aussehen:

video2day.run( {maxWidth: 400, debug: true} );

Die Reihenfolge der Parameter untereinander ist beliebig. Folgende Möglichkeiten stehen zur Verfügung:

Script-ParameterStandardBedeutung/Wirkung
addFlexVideoClassfalsetrue aktiviert den "responsive"-Modus, in welchem alle Anbieterelemente responsiv, d.h. in Abhängigkeit einer sich verändernden Containergröße dargestellt werden. Dieser Modus wirkt sich nur innerhalb von responsiven Blog-Templates aus (die Standard-Templates von Twoday sind leider NICHT responsiv). Dieses Blog hier basiert auf einem eigenerstellten, responsiven Foundation-Template. Bei der Ansicht von Blogseiten mit Videoload-Elementen werden diese im Portrait- oder Landscape-Modus eines Tablets bzw. Mobile Phones anders dargestellt. Auch bei der Verkleinerung des Browserfensters am Desktop wird die Größe der Videoelemente dynamisch im richtigen Aspektverhältnis angepasst.
contentClass'storyContent'Dies ist die div-Klasse des Containers, der einen gesamten Blogbeitrag umfasst und seine maximale Breite festlegt. Bei Twoday heißt diese Klasse storyContent (Standard).
debugfalsetrue aktiviert den Debug-Modus, in welchem zusätzliche Nachrichten auf die Browser-Console ausgegeben werden. Im Fehlerfall oder bei Unstimmigkeiten können hiermit wichtige Zwischenergebnisse des Scripts protokolliert und kontrolliert werden.
maxWidth-1Mit maxWidth können Sie für alle auf Ihrem Blog angezeigten Videoload-Elemente eine maximale Breite festlegen. Wenn z.B. kein Element breiter als 440 Pixel breit sein soll, geben Sie beim Scriptstart den Parameter { maxWidth: 440 } mit. Dies erspart Ihnen in dem Fall eine Größenlimitierung in jedem einzelnen Element mitzugeben (z.B. per width-440 als Videoparameter).
position'bottom'Mit Hilfe des position-Parameters können Sie festlegen, wo der iframe des Anbieters eingefügt werden soll. Gültige Werte sind bottom, also am Ende des DIVs (das ist auch der Standard) oder top für den Anfang des DIVs. Text, der innerhalb des DIVs steht, wird also jeweils vor dem iframe (bei Einstellung bottom) oder nach dem iframe (bei Einstellung top) ausgegeben.
posterSize'cover'Für MP4-Videos (Videoload-Typ other) kann ein Posterbild angezeigt werden, solange der Nutzer das Video noch nicht gestartet hat. Über den Script-Parameter posterSize lässt sich einstellen, wie das Bild in der festgelegten Größe des Videorahmens angezeigt wird: cover streckt das gesamte Bild, so dass es den Videorahmen vollständig ausfüllt. contain skaliert das Bild auf die längste Seite (es können Ränder entstehen). Die Standardeinstellung ist { posterSize: 'cover' }.
selector'.html5video'Mit Hilfe des Selectors findet Videoload alle Stellen, in denen eine Einbettung eines Anbieterelements vorgenommen werden soll (z.B. ein YouTube-Video oder ein Bandcamp-Audio). Standardmäßig ist dafür die CSS-Klasse .html5video eingestellt.
useVideoJStrueFür die Anzeige beliebiger MP4-Videos wird der bewährte Videoplayer VideoJS genutzt. Dieser wird bei Vorliegen des Videoload-Typs other nachgeladen und mit dem Abspielen des Videos beauftragt. Allerdings beinhalten die meisten modernen Browser bereits eigene Routinen zum Abspielen von MP4-Videos (z.B. Chrome, Firefox), so dass man — wenn man das Problem für Nutzer älterer Browser ignoriert — eine separate Player-Lösung nicht bräuchte. Wer sich also nur auf den Browser als Abspielsoftware verlassen will, kann über die Einstellung { useVideoJS: false } das Nachladen eines universellen Players unterbinden und so noch ein paar Millisekunden Ladezeit einsparen.

Videotool 2

Anleitung: Kopieren Sie den Einbettungscode der Quellplattform in das Feld iframe-Code, um den entsprechenden Videoload2-Befehl zu erhalten. Ergänzend können Sie die Breite anpassen oder auch alle Parameter ändern bzw. vollständig selbst einstellen.

Den resultierenden HTML-Code kopieren Sie anschließend in Ihren Beitragstext (Videoload2-Script muss installiert sein!).

iframe-Code
HTML-Code für Twoday

Mittwoch, 11. März 2015

Twoday-Tipp #9 - Thalia Büchersuche repariert

thalia/thaliarepair.jpg

Datum Änderungen / Edits
27.01.2016 Anpassung der Büchersuche aufgrund struktureller Änderungen auf der thalia.at Webseite. Die aktualisierte Version 1.1 des Skins (module.modReadingSetup-v11.txt) muss neu installiert werden.

Beginnen wir mit einer Preisfrage: Was haben die Twoday-Büchersuche über Thalia.at und Amazon.de gemeinsam? Stimmt! Beide existierten einmal, aber keine davon funktioniert noch. Und trotz regelmäßiger Forumnachfrage sind Bemühungen zur baldigen Behebung des Dauer­brenners derzeit nicht erkennbar. Zeit, das Thema selbst in die Hand zu nehmen und auch ohne Server-Zugriff eine brauch­bare anwender­seitige Lösung zu schaffen.

Vor einigen Jahren hat Amazon bereits seine Bücher-/Produkt­suche für "normalen" Programmier­zugriff geschlossen. Für die Nutzung des Product Advertising APIs sind seither spezielle An­mel­dungen, Partner-IDs und Zugriffs­schlüssel erforderlich, was für eine Blog­plattform wenig Sinn macht, zumal die Anzahl der erlaubten Zugriffe limitiert ist. Bleibt also Thalia.at, die ihrer kürzlich neu entworfenen Webseite auch eine detaillierte, von außen ansteuerbare Suchfunktion spendiert haben.

Neue Büchersuche installieren

Das Skin module.modReadingSetup

Wie schon die alte Twoday-Standard-Büchersuche liegt auch die neue Funktion im Skin module.modReadingSetup. Im Gegensatz zu vielen anderen Skins, die über die Navigation AdminLayoutSkins (HTML) angesteuert und angepasst werden können, entzieht sich der für die Büchersuche zuständige Skin jedoch einem schnellen Zugriff. Um ihn ändern zu können, bedarf es der Anwendung eines kleinen Kniffs.

  1. Laden Sie zunächst einmalig den zukünftigen Inhalt des Büchersuche-Skins herunter. Klicken Sie dazu auf die nachfolgende Schaltfläche und speichern Sie die Textdatei in einem beliebigen Verzeichnis Ihrer Festplatte.

     module.modReadingSetup-v11.txt

  2. Öffnen Sie die Datei in einem Texteditor (z.B. Notepad, Notepad++, Wordpad, TextEdit) als reine Textdatei, markieren Sie den gesamten Inhalt (Strg-A für Windows, Cmd-A für Mac) und kopieren Sie diesen in die Zwischenablage (Strg-C für Windows, Cmd-C für Mac). Schließen Sie danach den Editor.

    thalia/thalia00.jpg

  3. Melden Sie sich auf Twoday mit Ihrem Account an und rufen Sie Ihr Blog auf.
  4. Wählen Sie in der Menüzeile oben AdminLayout und dann Skins (HTML)Falls Sie Ihre Menüzeile ausgeblendet haben, erreichen Sie die Skin­bearbeitung alternativ auch durch direkte Eingabe der Adresse //blogalias.twoday.net/layouts (blogalias = Ihr Blogname) und dann durch Klick auf Skins (HTML).
  5. Klicken Sie dort auf ein beliebiges Skin. Im Beispiel verwenden wir das Skin Dayheader (Story.dayheader). Es ist aber nicht wirklich wichtig, welches Skin verwendet wird, weil es nur als Vorlage für die Adresse dient.

    thalia/thalia01.jpg

  6. Oben in der Adresszeile des Browsers wird nun folgende Zeichenkette angezeigt — natürlich mit Ihrem Blogalias und Layoutnamen:

    thalia/thalia02.jpg

  7. Markieren Sie den gesamten Rest hinter key= und schreiben Sie stattdessen module.modReadingSetup hinter das Gleichheitszeichen:

    thalia/thalia03.jpg

  8. Betätigen Sie die Datenfreigabetaste (Return), um den bisherigen Inhalt des Skins module.modReadingSetup anzuzeigen. Klicken Sie in das Feld mit dem Scrollbalken und markieren den gesamten Inhalt des Skins (Strg-A für Windows, Cmd-A für Mac):

    thalia/thalia04.jpg

  9. Fügen Sie nun den neuen Büchersuche-Inhalt (welcher sich seit Schritt 2 in Ihrer Zwischenablage befindet) in das Textfeld ein und ersetzen damit den markierten alten Inhalt vollständig (Strg-V für Windows, Cmd-V für Mac):

    thalia/thalia05.jpg

    Klicken Sie abschließend auf Speichern und Schließen um Ihre Änderung zu sichern.

    Gratulation! Die neue Suchfunktion über Thalia.at ist nun installiert. Im folgenden Kapitel lesen Sie, wie Sie die neue Büchersuche ab sofort verwenden können.

Büchersuche flexibel einsetzen

Büchersuche aufrufen

  1. Klicken Sie im Übersichtsbildschirm auf Module.

    thalia/thalia06.jpg

  2. Klicken Sie beim Eintrag "Bücherliste" auf Einstellungen.

    thalia/thalia07.jpg

  3. Unter der Überschrift Nach neuen Büchern suchen finden Sie den überarbeiteten Teil der Büchersuche, die nun über die Thalia.at Webseite erfolgt:

    thalia/thalia08.jpg

    Ein Büchersuche kann prinzipiell einfach oder strikt durchgeführt werden. Bei der einfachen Suche können Sie in jedem der beiden Eingabefelder beliebige, gemischte Suchwörter eingeben, unabhängig davon, ob sie zum Titel oder Autorennamen gehören. Bei der strikten Suche müssen die Suchwörter für Titel und Autor getrennt eingegeben werden. Standardmäßig ist die einfache Suche aktiviert (empfohlen).

  4. Einfache Suche
    Tippen Sie Nick Cave Munro in das Buchtitelfeld und klicken Sie anschließend auf die Jetzt auf Thalia.at suchen-Schaltfläche.
  5. Ein grafischer Indikator zeigt Ihnen an, dass die Suche gestartet ist. Nach kurzer Zeit werden die Suchergebnisse angezeigt. Jedes von Thalia gefundene Ergebnis wird in einem eigenen Kasten aufbereitet. Ein Klick auf das Buch führt direkt zur Webseite und weiteren Informationen.

    thalia/thalia09.jpg

    Um mehrfache Ergebnisse zu reduzieren, können Sie einen bestimmten Produkttyp einstellen, z.B. nur Bücher, oder nur eBooks, oder nur Hörbücher.

  6. Strikte Suche
    Für eine exakte Suche aktivieren Sie das Auswahlkästchen "Strikte Suche". Damit wird es erforderlich, Suchwörter strikt nach Titel bzw. Autorenname aufzuteilen. Beispiel: Tippen Sie Argo in das Titelfeld und Herbst in das Autorenfeld.

    thalia/thalia10.jpg

    Es kommt vor, dass Thalia bei der strikten Suche keine Suchergebnisse zurückliefert. Verwenden Sie dann die einfache Suche.

  7. Haben Sie Ihr gewünschtes Buch gefunden, können Sie es mit einem Klick auf das Pluszeichen automatisch in das Twoday-Eintragsformular übernehmen.

    thalia/thalia11.jpg

  8. Titel, Autor, Link und Bild werden in das Formular übernommen. Klicken Sie auf Hinzufügen, um das Buch endgültig in Ihre Bücherliste zu übernehmen.

    thalia/thalia12.jpg

  9. Alle Titel in Ihrer Bücherliste können Sie nach eigenen Wünschen umsortieren. Zum Abschluss klicken Sie auf Sichern um die Änderungen dauerhaft zu speichern.

    thalia/thalia13.jpg

Bücherliste in der Seitenleiste anzeigen

Das Modul "Bücherliste" in die Sidebar integrieren

Damit Ihre Bücherliste in der Seitenleiste Ihres Blogs angezeigt wird, sind folgende Schritte erforderlich:

  1. Klicken Sie in Ihrer Blog-Menüzeile oben auf AdminModule und dann auf Sidebar Module anordnen.Falls Sie Ihre Menüzeile ausgeblendet haben, erreichen Sie die Modul­anordnung alternativ auch durch direkte Eingabe der Adresse //blogalias.twoday.net/modules/order (blogalias = Ihr Blogname).

    thalia/thalia14.jpg

  2. Wählen Sie das Büchermodul aus (im Twoday-Standard hat dies die Textbezeichnung "Mein Lesestoff") und übertragen Sie es durch Klick auf die entsprechende Schaltfläche in die erste (Sidebar 1) oder zweite (Sidebar 2) Seitenleiste.

    thalia/thalia15.jpg

  3. Nachdem Sie das Büchermodul eingefügt haben, speichern Sie ihre Änderung durch Klick auf Sichern.

    thalia/thalia16.jpg

  4. Klicken Sie auf Weblog ansehen, um die Anzeige des Büchermoduls zu kontrollieren.

    thalia/thalia17.jpg

    In der Seitenleiste werden nun die übernommenen Buchtitel angezeigt. Die Coverbilder haben teilweise unterschiedliche Größen und Titel/Autor sind sehr klein formatiert. Im folgenden Kapitel lesen Sie, wie Sie die Bücher nach Ihren Wünschen formatieren können.

    thalia/thalia18.jpg

Bücher in der Seitenleiste formatieren

Drei weitere Skins anpassen

Für die optische Aufbereitung der Bücherliste sind drei weitere Skins verantwortlich: Site.modReadingItem für den einzelnen Buchtitel, Site.modReadingDivider für den Trennbereich zwischen zwei Büchern und Site.modReading für den gesamten Container der Bücherliste. Die Skins sind sehr schnell und einfach anzupassen.

  1. Klicken Sie in Ihrer Blog-Menüzeile oben auf AdminModule.Falls Sie Ihre Menüzeile ausgeblendet haben, erreichen Sie die Modul­liste alternativ auch durch direkte Eingabe der Adresse //blogalias.twoday.net/modules/sidebar (blogalias = Ihr Blogname).

    Klicken Sie im Eintrag Bücherliste auf Skins.

    thalia/thalia19.jpg

  2. Alle drei Skins benötigen kleine Anpassungen, um die einzelnen Bestandteile einer Buchtitelanzeige zukünftig besser formatieren zu können.

    thalia/thalia20.jpg

    Die Zahlen oben markieren die Reihenfolge der Änderungen. Klicken Sie also zunächst auf den Skin Site.modReadingItem.

  3. Markieren und kopieren Sie die nachstehenden Zeilen in die Zwischenablage, wechseln Sie in den geöffneten Skin Site.modReadingItem und ersetzen dort den gesamten Inhalt.
    <div class="sbBookItem">
        <% param.ReadingImage %>
        <div class="sbBookAuthor"><% param.ReadingAuthor %></div>
        <div class="sbBookTitle"><% param.ReadingTitle %></div>
    </div>

    Alter Inhalt

    thalia/thalia21.jpg

    Neuer Inhalt

    thalia/thalia22.jpg

    Klicken Sie auf Speichern und Schließen, um die Änderung zu sichern.

  4. Klicken Sie nun auf Site.modReadingDivider und entfernen Sie den gesamten Inhalt des Skins (im Standard ist dies ein einzelnes <br />).

    Alter Inhalt

    thalia/thalia23.jpg

    Neuer Inhalt

    thalia/thalia24.jpg

    Klicken Sie auf Speichern und Schließen, um diese Änderung zu sichern.

  5. Klicken Sie nun auf Site.modReading. Markieren/kopieren Sie die nachstehenden Zeilen in die Zwischenablage, wechseln Sie in den geöffneten Skin und ersetzen dort den gesamten Inhalt.
    <style>
    .sbBookContainer {}
    .sbBookItem { margin-bottom: 20px; font-size: 13px; }
    .sbBookItem img { box-shadow: 3px 4px 6px #ccc; max-height: 120px; }
    .sbBookAuthor { font-style: italic; margin-top: 10px; }
    .sbBookTitle {}
    </style>
    <div class="sbBookContainer">
        <% param.Reading %>
    </div>

    Alter Inhalt

    thalia/thalia25.jpg

    Neuer Inhalt

    thalia/thalia26.jpg

    Klicken Sie auf Speichern und Schließen, um auch diese Änderung zu sichern.

  6. Klicken Sie auf Weblog ansehen, um sich das Ergebnis der Änderungen anzusehen.

    thalia/thalia27.jpg

    Die im Skin Site.modReading definierten Formatanweisungen (CSS-Stile) haben folgendes bewirkt:

    .sbBookItem { margin-bottom: 20px; font-size: 13px; } definiert für jedes Buch einen unteren Abstand von 20 Pixel und stellt eine Zeichensatzgröße von 13 Pixel ein.

    .sbBookItem img { box-shadow: 3px 4px 6px #ccc; max-height: 120px; } erzeugt einen schmalen Schatten um das Buchcover und stellt die Höhe des Bildes auf maximal 120 Pixel ein (die Breite wird automatisch proportional angepasst).

    .sbBookAuthor { font-style: italic; margin-top: 10px; } stellt den Autorennamen in Kursiv dar und definiert einen oberen Abstand (zum Coverbild) von 10 Pixeln.

    Diese Vorbelegungen lassen sich jederzeit nach eigenen Wünschen anpassen. Rufen Sie dazu erneut den Skin Site.modReading auf und passen Sie die Stildefinitionen entsprechend an.
Probleme, Fragen, Ergänzungswünsche?

Falls Sie Probleme mit der Büchersuche bemerken, posten Sie diese bitte zusammen mit einem Screen­shot in die Kommentare.

Wichtiger Hinweis: Der Zugriff auf die Thalia.at Suchfunktion erfolgt über ein technisches Werkzeug (YQL), das von Yahoo bereitgestellt wird. Bei starker weltweiter Nutzung kann eine Überlastungssituation eintreten, in der das Tool keine Ergebnisse zurückmeldet. Wiederholen Sie dann einfach Ihre Suchabfrage.

Um diesen Beitrag zu drucken, klicken Sie bitte in der Menüzeile oben rechts auf das Druckersymbol

module.modReadingSetup, site.modReading/modReadingItem/modReadingDivider © 2015 NeonWilderness — lizensiert unter MIT.
Außergewöhnliches
Dinge, die gut sind
Entgleisungen
Gemalte Lebenserfahrung
Musik
Nachtgedanken
Neon-Award
Neon's Must-Have-Tools
Neon's Top10 List
Schöner Bloggen
Today I Learned
Wort des Tages
Profil
Abmelden
Weblog abonnieren
Meine bearbeiteten Skins
Hauptseite (Site.page)
Toolbar (Site.foundationToolbar)
Foundation 5 docs
Foundation Sites github
Font Awesome Cheatsheet