Newsticker für Homepage erstellen - so geht's

Newsticker online erstellen

Wenn Sie in Ihrer Website einen Newsticker einbauen möchten und sich nicht mit JavaScript und/oder HTML auskennen, können Sie über den Newsticker Generator von Homepage-Total schnell und einfach einen individuellen Newsticker  gestalten.

1. Rufen Sie dafür den Generator über Ihren Webbrowser auf.
2. Geben Sie nun in den ersten Feldern jeweils einen Text ein. Falls Sie weniger oder mehr als vier Nachrichten verwenden möchten, können Sie dies später noch manuell einstellen (siehe Schritt 10).
3. Ändern Sie danach optional noch die Schriftart, -größe und -farbe sowie die Hintergrundfarbe des Newstickers.
4. Legen Sie dann noch die Geschwindigkeit und die Pause zwischen den einzelnen Texten fest.


Ohne JavaScript eine Laufschrift erzeugen - mit HTML funktioniert's so

Falls Sie auf Ihrer Webseite einen simplen Newsticker erstellen oder auf eine wichtige Nachricht …

5. Klicken Sie dann auf "Quelltext & Vorschau".
6. Daraufhin öffnet sich ein kleines Fenster in Ihrem Browser, in welchem Sie den eben erstellten Newsticker sehen. Falls Ihnen dieser noch nicht gefallen sollte, ändern Sie die jeweiligen Einstellungen und klicken Sie dann erneut auf "Quelltext & Vorschau".
7. Schließen Sie das kleine Fenster und klicken Sie in das Feld unterhalb der Buttons, um den Quellcode zu markieren. Sollte dieser nicht blau hinterlegt werden, drücken Sie Strg+A, um alles zu markieren.
8. Drücken Sie nun Strg+C, um den Quellcode zu kopieren.
9. Erstellen Sie eine neue HTML-Datei und fügen Sie den Quellcode mit Strg+V ein. Falls Sie den Newsticker in eine bereits existierende HTML-Datei einfügen möchten, müssen Sie lediglich den JavaScript-Teil in den Head-Bereich Ihrer Datei kopieren (also alles ab ""), den Body-Tag mit "" ersetzen und das Formular kopieren (also alles ab "" bis "").
10. Falls Sie die Anzahl der anzuzeigenden Texte noch verändern möchten, müssten Sie dies etwa in der Mitte des JavaScript-Teils bei "tl=new textlist" machen. Sie müssen dabei jeweils den Text in Anführungszeichen schreiben und danach ein Komma setzen, wobei nach dem letzten Eintrag kein Komma folgen darf. Schreiben Sie also zum Beispiel innerhalb der Klammern "Text 1", "Text 2", "Text 3"
11. Speichern Sie Ihre HTML-Datei ab. Gegebenenfalls müssen Sie diese noch auf Ihren Webserver hochladen, damit die Änderung wirksam umgesetzt wird.

Eigenen Newsticker für die Homepage gestalten

Alternativ könnten Sie auch einen einfachen Newsticker für Ihre Homepage schnell und einfach mit einer Zeile HTML-Code programmieren.

1. Öffnen Sie dafür Ihre HTML-Datei oder erstellen Sie eine neue HTML-Datei mit dem benötigten Grundgerüst.
2. Gehen Sie nun innerhalb dieser HTML-Datei an die Stelle, an der Sie den Newsticker anzeigen lassen möchten.
3. Geben Sie nun "Text 1 - Text 2 - ..." ein, wobei Sie den Text zwischen den beiden Tags nach Ihren Wünschen anpassen müssen.
4. Dadurch erzeugen Sie einen laufenden Text. Diesen können Sie noch weiter bearbeiten, indem Sie dem Tag "" weitere Attribute zuweisen. Mit "direction" legen Sie die Laufrichtung fest, sodass Sie zum Beispiel mit direction="left" einen Text von rechts nach links laufen lassen. Mit "scrollamount" können Sie die Geschwindigkeit verändern, also zum Beispiel für einen langsamen Text scrollamount="2" oder für einen schnellen Text scrollamount="10" schreiben. 
5. Falls Sie den Text noch etwas gestalten möchten, müssten Sie dies mit CSS machen. Dazu brauchen Sie lediglich im Head-Bereich einen CSS-Bereich mit "" definieren und innerhalb diesen Bereichs eine neue Klasse erstellen, zum Beispiel ".newsticker". Um dann beispielsweise die Schriftart auf Rot zu ändern und einen schwarzen Rahmen zu setzen, müssen Sie schreiben: .newsticker { color: red; border: 1px solod black;}. Zuletzt müssen Sie die Klasse dann Ihrem Newsticker zuweisen, indem Sie schreiben "".
6. Speichern Sie zum Schluss Ihre HTML-Datei ab und laden Sie diese auf Ihren Webserver hoch.