News Ticker

Ditty News Ticker (Free),

ein Plug-in, welches sich nicht von selbst versteht,

aber sich arrangieren lässt.


imageEs mag auch ganz nett sein, bestimmte Texte, welche punktuell zusammenpassen anstatt eines längeren Aneinanderreihens die kompakte Form modernen Tickers im Ablauf von sogenanntem „Rotieren“ wie hier diesem Beispiel. (Anmerkung: Zur Darstellung ähnlicher Inhalte ist Übersichts besser ein Tab-Menü ⇔ geeignet). Im Großen und Ganzen ist ein Ticker zur gewissen Aufmerksamkeitsmachung von Textzeilen, ganzer Nachricht und Slider für Bilder hindurch automatisches Rotieren, einfacher Laufschrift in beliebiger Richtung auf Seiten/Beiträge sowie mit eigenem News-Widget für die Seitenleisten und Footer-Widget-Bereich, jeweils mit einer Menge Darstellungsmöglichkeit des Ein- und Ausblendens – ja, anzuwenden.

Also ist dieser Begründung zur Installation eines Plug-ins, besser … des Plug-ins News-Ticker. Das Plug-in ist erweiterbar s. Ditty-News-Ticker (free) ⇒ Read more. Vorab, die Beschreibung ist im Plug-in durchwegs in Deutsch. Motto: Einer für vieles, bei für sich schlanken Code für die Performance ;-)

Anmerkung: Bei Darstellung Schriftvergrößerung wird der Inhalt unteren Teils abgeschnitten und auch die Darstellung im Lesemodus ist nicht konform.

In Hinsicht SEO werden in Suchmaschine(n) – meiner Beobachtung* „bing“ – die Inhalte von Ticks indexiert.

* … meiner Beobachtung: weil dieser Website derweil nur die Suchmaschine „bing“ eingeladen ist.

Erstellung

Ein Ticker wird erstellt über Dashboard/News-Ticker,Gefüge ist ähnlich Seite/Beitrag. Unter „Ticker-Typ“, „Ticker-Modus“ und sog. „Globale-Einstellungen“. Die Ticks selbiger Seite (Ticker-Typ) werden jeweils mit dem (+) angefügt.

Anhand des Titels kann man sodann im Ticker-Widget Entsprechendes aufrufen und in einer Seitenleiste bzw. Footer-Widget-Bereich illustrieren oder über den Shortcode, der auf der Erstellerseite angezeigt wird, in Seite/Beitrag einspielen. Es gäbe auch die sog. „Direkte Funkton“, editiert würde angezeigter Code in Theme PHP-Datei.
Anmerkungen:
  • „Vorschau-Button“: Die Anzeige der Ticks in vorschau funktioniert erst nach Abspeicherung bzw. Aktualisierung und nur bei Status „Veröffentlicht“ und Sichtbarkeit „Öffentlich“.
  • Im Zusammenhang mit Plugin Relevanssi ⇔ und „Suchergebnissen“ die veröffentlichen Ticks nicht zusätzlich aufzurufen: Relevanssi-Sucheinstellungen „Indizierung-Einstellungen“ obligat für ditty_news_ticker kein Häkchen.

Laufschrift

Die Laufschrift (beiderseitig) und Scroll-Richtung nach oben oder unten und mit Überfahren der Maus kann der Text pausiert werden auch Button mit Abspielen/Pause möglich. Meist restliche Konfigurierung entspricht dem Design von Abständen. Ja, die Scrollgeschwindigkeit sollte einem sinnvollen Wert zwischen 1/sehr langsam bis 10/schnell sein.

Rotieren

Die Erstellung sogenanntem Rotieren ist ebenso interessant wie hier im Beispiel. Nur ist darauf zu achten, dass unter „Ticker-Typ“ neben Button „Standard“, über Button „Divers“ auch die jeweilige Anzahl der Ticks von „Standard“ aktiviert und somit angezeigt sein sollen.

Der List Stil ist wie einer Linkliste.

HTML

  • Die Tickfenster zum Erstellen sind schmal gehalten, daher sollte größeres Textvolumen im Editor (Beitrag/Seite) vorbereitet werden, allein dessen zur Übersicht von Text und Übertragung der HTML-Auszeichnung eine Vorlage praktikabel ist.
  • Bei mittiger Ausrichtung von Text eines Ticks mit (p style=“text-align: center;“) ist konformer darauf zu achten, die anderen Ticks ebenso mit (p) auszuzeichnen, so es auch für erweiterten Zeilenabstand zum Gebrauch finden kann.
  • Die „Beispielsweise-HTML-Darstellung“ ist nicht möglich, weil das Programm ähnliches &lt ; &gt ; in korrektes HTML umwandelt, im sowohl als auch wenn den Spitzklammern (< >*) ein Leerzeichen eingefügt wird.
    * Die Darstellung von Spitzklammern ist nur einmalige Abspeicherung durch &lt ; &gt ; möglich, aber in Kombination mit HTML-Elementen wiederum als Makup ausgeführt werden.
  • imageIm empfehlenswerten Modus „Zeilenumbrüche erzwingen“, Merke: Dass die normalen Abstände zur Überschrift übertragen werden und die Aufzählungszeichen zur stimmigen Darstellung finden, müssen Text sowie Auszeichnungen aneinandergereiht sein und im Textmodus abgespeicht werden. Zur Wiederbearbeitung dessen Ticks muss vorerst eine Seite/Beitrag im Textmodus einer tatsächlicher Änderung abgespeichet werden, weil bei Öffnung des Ticks im Textmodus und erneuter Abspeicherung die Aneinanderreihung der HTML-Auszeichnung verloren geht.

CSS

Ein paar Auszeichnungen zur individuellen Anpassung im CSS Stylesheet Editor. Die Zahl nach dem Selektor ist die ID*, welche einen Tick anspricht. Die Auszeichnungen zur Schrift könnte ebenso über HTML erfolgen. Eine generelle Auszeichnung der Ticks erfolgte mit: .mtphr-dnt
*Die ID findet sich Dashboard/News Ticker ebd.

#mtphr-dnt-182 {
padding: 4px 0;
margin-top: 10px;
background-color: #ececec;
color: green;
font-size: 16px;
text-align: center;
}
padding: Größe des Textfeldes durch Abstand vom Text, wobei der zweite Attributwert den Abstand links und rechts vom Text darstellt. Bspw. 4px (Abstand oben/unten vom Text) 8px; (Text vom Rand eingerückt).
margin-top: Abstand des Textfeldes vom vorhergehenden Text.
background-color: Hintergrundfarbe Textfeld.
color: Textfarbe.
font-size: Textgröße.
text-align: Textausrichtung (als Textausrichtung kommt Center in Frage, weil anderes ohnehin in den Einstellungen festgelegt wird).

 

– Danksagung dem Ersteller des großzügigen Plug-ins.

Für professionellen Anspruch können mit Pro-Version die Erweiterungen mithin das Design gestaltet werden.

Aktualisiert am 25.09.2016