BloggerLatein

Wo gibt es tolle Gadgets für Blogger Blogspot? Wie erstellt man animierten Text für einen Blogger Blogspot Blog? Wie kann man animierte Schrift anzeigen lassen bei Blogspot? Wie erstellt man einen Lauftext (Laufanzeige) wie bei einem Newsticker in einem Blogger Blogspot Blog?

Mit ein paar HTML Tricks lassen sich eigene Gadgets selbst erstellen und nicht immer ist es nötig seinen Blog mit Javascripts zu überladen. Nimmt man noch etwas CSS dazu, dann lassen sich tolle Rezepte zur Bloggestaltung kreieren.

Die gleich folgenden Beispiele für Lauftext (wie bei einem Newsticker) lassen sich in einem Blogger Blogspot Blog überall dort einbinden, wo man ein HTML/JavaScript Gadget hinzufügen kann.

Man kann aber auch seinen Post verschönern. Schreibt man einen neuen Post oder bearbeitet einen vorhandenen Post, befindet man sich im Editor im Schreibmodus Verfassen. Hat man den entsprechenden Code ausgewählt wechselt man im Editor in den Schreibmodus HTML (bearbeiten) und fügt an gewünschter Stelle den Code ein.

Text der horizontal gescrollt wird

1. von rechts nach links

Code:
<marquee direction="left">Dieser Text wird von rechts nach links gescrollt</marquee>

2. von rechts nach links mit anderer Textfarbe

Code:
<marquee direction="left"><font color="#FF00FF"> Dieser Text wird von rechts nach links gescrollt – rosa Textfarbe</font></marquee>

• <font color="#FF00FF"> Textfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

3. von rechts nach links mit Hintergrundfarbe

Code:
<marquee direction="left" bgcolor="#00bfff">Dieser Text wird von rechts nach links gescrollt - blaue Hintergrundfarbe</marquee>

• bgcolor="#00bfff" Hintergrundfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

4. von rechts nach links mit Hintergrundfarbe und anderer Textfarbe

Dieser Text wird von rechts nach links gescrollt - blaue Hintergrundfarbe - gelbe Textfarbe

Code:
<marquee direction="left" bgcolor="#00bfff"><font color="#ffff00">Dieser Text wird von rechts nach links gescrollt - blaue Hintergrundfarbe - gelbe Textfarbe</font></marquee>

• bgcolor="#00bfff" Hintergrundfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen
• <font color="#ffff00"> Textfarbe: die rot markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

5. von links nach rechts

Code:
<marquee direction="right">Dieser Text wird von links nach rechts gescrollt</marquee>

6. von links nach rechts mit anderer Textfarbe

Code:
<marquee direction="right"><font color="#FF00FF"> Dieser Text wird von links nach rechts gescrollt – rosa Textfarbe</font></marquee>

• <font color="#FF00FF"> Textfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

7. von links nach rechts mit Hintergrundfarbe

Code:
<marquee direction="right" bgcolor="#00bfff">Dieser Text wird von links nach rechts gescrollt - blaue Hintergrundfarbe</marquee>

• bgcolor="#00bfff" Hintergrundfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

8. von links nach rechts mit Hintergrundfarbe und anderer Textfarbe

Dieser Text wird von links nach rechts gescrollt - blaue Hintergrundfarbe - gelbe Textfarbe

Code:
<marquee direction="right" bgcolor="#00bfff"><font color="#ffff00">Dieser Text wird von links nach rechts gescrollt - blaue Hintergrundfarbe - gelbe Textfarbe</font></marquee>

• bgcolor="#00bfff" Hintergrundfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen
• <font color="#ffff00"> Textfarbe: die rot markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

Text der vertikal gescrollt wird

1. von unten nach oben

Code:
<marquee direction="up">Dieser Text wird von unten nach oben gescrollt</marquee>

2. von unten nach oben mit anderer Textfarbe

Code:
<marquee direction="up"><font color="#FF00FF"> Dieser Text wird von unten nach oben gescrollt – rosa Textfarbe</font></marquee>

• <font color="#FF00FF"> Textfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

3. von unten nach oben mit Hintergrundfarbe

Code:
<marquee direction="up" bgcolor="#00bfff">Dieser Text wird von unten nach oben gescrollt - blaue Hintergrundfarbe</marquee>

• bgcolor="#00bfff" Hintergrundfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

4. von unten nach oben mit Hintergrundfarbe und anderer Textfarbe

Dieser Text wird von unten nach oben gescrollt - blaue Hintergrundfarbe - gelbe Textfarbe

Code:
<marquee direction="up" bgcolor="#00bfff"><font color="#ffff00">Dieser Text wird von unten nach oben gescrollt - blaue Hintergrundfarbe - gelbe Textfarbe</font></marquee>

• bgcolor="#00bfff" Hintergrundfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen
• <font color="#ffff00"> Textfarbe: die rot markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

5. von oben nach unten

Code:
<marquee direction="down">Dieser Text wird von oben nach unten gescrollt</marquee>

6. von oben nach unten mit anderer Textfarbe

Code:
<marquee direction="down"><font color="#FF00FF"> Dieser Text wird von oben nach unten gescrollt – rosa Textfarbe</font></marquee>

• <font color="#FF00FF"> Textfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

7. von oben nach unten mit Hintergrundfarbe

Code:
<marquee direction="down" bgcolor="#00bfff">Dieser Text wird von oben nach unten gescrollt - blaue Hintergrundfarbe</marquee>

• bgcolor="#00bfff" Hintergrundfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

8. von oben nach unten mit Hintergrundfarbe und anderer Textfarbe

Dieser Text wird von oben nach unten gescrollt - blaue Hintergrundfarbe - gelbe Textfarbe

Code:
<marquee direction="down" bgcolor="#00bfff"><font color="#ffff00">Dieser Text wird von oben nach unten gescrollt - blaue Hintergrundfarbe - gelbe Textfarbe</font></marquee>

• bgcolor="#00bfff" Hintergrundfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen
• <font color="#ffff00"> Textfarbe: die rot markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

Laufgeschwindigkeit einstellen 

Für Beispiel:

4. von rechts nach links mit Hintergrundfarbe und anderer Textfarbe – sehr langsam

Dieser Text wird von rechts nach links gescrollt - blaue Hintergrundfarbe - gelbe Textfarbe - sehr langsam

Code:
<marquee  direction="left" bgcolor="#00bfff" scrollamount="2"><font color="#ffff00">Dieser Text wird von rechts nach links gescrollt - blaue Hintergrundfarbe - gelbe Textfarbe - sehr langsam</font></marquee>

• scrollamount="2" Laufgeschwindigkeit: scrollamount wurde dem Code hinzugefügt die lila markierte Stelle kann mit anderen Werten ersetzt werden
• bgcolor="#00bfff" Hintergrundfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen
• <font color="#ffff00"> Textfarbe: die rot markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

Für Beispiel:

4. von rechts nach links mit Hintergrundfarbe und anderer Textfarbe – sehr schnell

Dieser Text wird von rechts nach links gescrollt - blaue Hintergrundfarbe - gelbe Textfarbe - sehr schnell

Code:
<marquee  direction="left" bgcolor="#00bfff" scrollamount="50"><font color="#ffff00">Dieser Text wird von rechts nach links gescrollt - blaue Hintergrundfarbe - gelbe Textfarbe – sehr schnell</font></marquee>

• scrollamount="50" Laufgeschwindigkeit: scrollamount wurde dem Code hinzugefügt die lila markierte Stelle kann mit anderen Werten ersetzt werden
• bgcolor="#00bfff" Hintergrundfarbe: die blau markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen
• <font color="#ffff00"> Textfarbe: die rot markierte Stelle kann mit anderen Farben ersetzt werden, in Farbtabellen die Spalte HEX wählen und den Wert einsetzen

Code anpassen und in ein HTML/JavaScript Gadget oder im Editor im Modus HTML einfügen. Blog neu laden und die animierte Schrift sollte zu sehen sein.

Gadget für HTML/JavaScript in der alten Blogger Oberfläche hinzufügen

• bei blogger.com einloggen und entsprechenden Blog aufsuchen
• Design >> Seitenelemente >> Gadget hinzufügen >> HTML/JavaScript auswählen und den Code für einen Lauftext einfügen >> Speichern
• Blog neu laden und der animierte Text sollte zu sehen sein

Gadget für HTML/JavaScript in der neuen Blogger Oberfläche hinzufügen

• bei blogger.com einloggen und entsprechenden Blog aufsuchen
• Layout >> Gadget hinzufügen >> HTML/JavaScript auswählen und den Code für einen Lauftext einfügen >> Speichern
• Blog neu laden und der animierte Text sollte zu sehen sein