Wie füge ich einen Bilderwechsel ein?

Wenn man wechselnde Bilder oder Banner einbinden möchte, die gleichzeitig verlinkt sind, kann man das z.B. mit einem Javascript lösen, was man in ein HTML/Javascript Gadget einbinden kann. Auch in einem Post funktioniert das Script, wie man unten sehen kann.

Das Script selbst sieht so aus:

<script language="JavaScript"> <!-- var Bilder = new Array("http://Bild1","http://Bild2","http://Bild3"); var URL = new Array("http://Link1", "http://Link2", "http://Link3"); var Delay = 5000; var BildAnzahl = Bilder.length; var number = 0; BildFolge = new Image(); BildFolge.src = Bilder[number]; function change() { number++; if (number == BildAnzahl) number = 0; BildFolge.src = Bilder[number]; document.austausch.src = BildFolge.src; document.getElementById('link' ).href = URL[number]; } setInterval("change()", Delay); //--> </script> <a href="http://Link2" id="link" target="_blank"><img src="Bild2" name="austausch" /></a>

Das Script ist für 3 Bilder ausgelegt. Möchte man man mehr Bilder einfügen, kann man diese in den Bereich:

var Bilder = new Array("http://Bild1","http://Bild2","http://Bild3");
var URL = new Array("http://Link1", "http://Link2", "http://Link3");

ergänzen. In diesem Bereich müssen auch die Links eingefügt werden. Zum einen die Links zu den Bildern, zum anderen die Links zu den Webseiten. Link 1 gehört zu Bild 1, Link 2 zu Bild 2, und so weiter.

Möchte man die Geschindigkeit des Bilderwechsels ändern, kann man es an der Stelle machen:

var Delay = 5000;

Je Größer die Zahl, um so langsamer der Wechsel.

Und so sollte der Bilderwechsel dann aussehen:



Alle Angaben ohne Gewähr, Einbau auf eigene Gefahr!

Wie binde ich zwei oder drei kleine Buttons nebeneinander in der Sidebar ein?

Wenn du mehrere kleine Bilder nebeneinander in die Sidebar setzen willst, die auf andere Webseiten oder Profile verweisen, musst du zuerst die Bilder erstellen. Für jeden Link benötigst du ein einzelnes Bild. Achte darauf, dass die Bilder möglichst gleichgroß sind, zumindest aber gleich hoch.

Sind die Bilder fertig, lädst du sie in dein Picasa-Album oder auf einen anderen Webspace, deiner Wahl. Dann kopierst du dir die Links zu den Bildern. Achte darauf, dass ein Bild auch am Ende des Links ein .jpg oder .gif oder auch .png haben sollte. Hat dein Link ein .html am Ende, hast du den Link zum Album und nicht zum Bild. Am besten kannst du es feststellen, wenn du den Link im Browser einträgst und öffnest. Siehst du nur das Bild, ist der Link richtig. Siehst du eine Webseite mit dem Bild z.B. in einem Album, hast du den falschen Link.

Dann benötigst du noch die Links zu den Webseiten, die mit den Buttons verlinkt sein sollen. Dafür rufst du die Webseiten auf, die du verlinken möchtest, und kopierst im Browser den Link.

Danach gehst du auf deinen Blog und ziehst unter "Design"/ "Seitenelemente" bzw. "Layout" ein "HTML/ Javascript Gadget" in die Sidebar.
Dort fügst du folgendes ein:

<a href="http://Link Seite 1"><img src="http://Link zum 1. Bild" /></a><a href="http://Link Seite 2"><img src="http://Link zum 2. Bild" /></a><a href="http://Link Seite 3"><img src="http://Link zum 3. Bild" /></a>

Die "Platzhalter" musst du natürlich ersetzen, also bei "Link Seite 1" muss der Link zu der Webseite eingetragen werden, bei "Link zum 1. Bild" musst du den Link zum Bild einfügen. Das machst du bei den anderen Links genauso. Willst du mehr als 3 Bilder einfügen, musst du den Abschnitt für ein Link/Bild kopieren und zusätzlich einfügen.

Möchtest du die Bilder in der Mitte stehen haben, setzt du vor den Code ein <center> und dahinter ein </center>, also:

<center><a href="http://Link Seite 1"><img src="http://Link zum 1. Bild" /></a><a href="http://Link Seite 2"><img src="http://Link zum 2. Bild" /></a><a href="http://Link Seite 3"><img src="http://Link zum 3. Bild" /></a></center>

Wichtig ist, dass zwischen den einzelnen Bildern höchstens Leerzeichen, nicht aber Leerzeilen stehen, denn sonst sind die Bilder unter- und nicht nebeneinander. Willst du nur einen Button einbinden, kannst du besser ein Bilder-Gadget einbinden.

Wie kann ich eine kleine "To do - Liste" in meinen Blog einbinden?

Wenn du eine Liste in deiner Sidebar haben möchtest, die etwa so aussieht:

Einkaufen
Buch lesen
Artikel über "To do - Liste" schreiben

dann geht das recht einfach. Du fügst deiner Sidebar ein HTML/ Javascript-Gadget hinzu und trägst dort folgenden Code ein:

<input type="checkbox" /> Sache 1 <br/> <input type="checkbox" /> Sache 2 <br/> <input type="checkbox" /> Sache 3 <br/>

Sobald du eine Sache erledigt hast, ergänzt du die jeweilige Checkbox mit dem Begriff "checked". Hast du z.B. Sache 2 erledigt, würde dein Code dann so aussehen:

<input type="checkbox" /> Sache 1 <br/> <input type="checkbox" checked/> Sache 2 <br/> <input type="checkbox" /> Sache 3 <br/>

Du kannst die Liste natürlich beliebig erweitern. Die "br/" zwischen den Checkboxen sind Zeilenumbrüche, damit die Boxen auch untereinander und nicht nebeneinander im Gadget erscheinen.

Natürlich kannst du die Liste auch in einen Post setzen. Dafür wechselst du in dem Post-Editor von "Verfassen" auf "HTML bearbeiten" und setzt dort den Code an der richtigen Stelle ein.

Weil im Post die Zeilenumbrüche meist automatisch gesetzt werden, kannst du dieses im Code weg lassen und nur die Checkboxen eintragen, also:

<input type="checkbox" /> Sache 1 <input type="checkbox" /> Sache 2 <input type="checkbox" /> Sache 3

Alle Gadgets sind ohne Gewähr. Der Einbau erfolgt auf eigene Gefahr!

Gadget: Uhrzeit

Wenn du in deinem Blog die Uhrzeit anzeigen lassen willst, kannst du das z.B. mit einem JavaScript machen. Füge das folgende Script in ein HTML/JavaScript - Gadget ein.

<script language="javascript"> <!-- function zeit(){ var datum = new Date() var stunde = datum.getHours() var minute = datum.getMinutes() var sekunde = datum.getSeconds() if (stunde<10) stunde="0"+stunde; if (minute<10) minute="0"+minute; if (sekunde<10) sekunde="0"+sekunde; document.getElementById("uhrzeit").innerText = (stunde + ":" +minute + ":" + sekunde); } var aufruf = window.setInterval("zeit()", 1000) //--> </script> <div id="uhrzeit"></div>


Wenn du Ahnung von CSS hast, kannst du die Uhr auch noch formatieren. Der entsprechende Codeteil sollte #uhrzeit heißen und kann unter Design/ HTML bearbeiten hinzugefügt werden.

Beispiel:

#uhrzeit {
color: #996644;
}

Alle Gadgets sind ohne Gewähr. Der Einbau erfolgt auf eigene Gefahr!