Aufgabe 3

Diese Aufgabe bestand darin, dass mittels des Twitter Widgets ein adaptiertes Twitterfeld auf meinem Blog eingebettet wird.

Für dieses Zweck bietet Twitter ein einfaches Widget welches über Google schnell zu finden ist. Mit diesem kann man verschiedene Einstellungen, wie Änderung der Hintergrundfarbe oder Linkfarbe, vorgenommen werden.

Je nach dem welche Art von Tweets man dargestellt haben möchte muss eine Auswahl getroffen werden. Hierbei kann man zwischen seinen eigenen Tweets, den abonierten Tweets oder einem gewünschten Begriff entscheiden.

Nachdem man die gewünschten Änderungen und Einstellungen vorgenommen hat, steht der Quellcode zum kopieren bereit.

<a class="twitter-timeline"  href="https://twitter.com/_ibib"  data-widget-id="417639233411506176">Tweets von @_ibib</a>
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

Im Blog muss dieses Stück des Quellcodes nun eingefügt werden. Um dies zu erreichen, navigiert man zu den Navigationspunkten: Layout - Skins (Skin des angewählten Layouts auswählen) - Site Layout - Main Page.

Nun ist ein Fenster zu sehen, welches den Code (HTML, JavaScript) des Blogaufbaus anzeigt. Da wir das Twitter Widget an einer bestimmten Stelle platzieren möchten muss erst der richtige Platz gefunden werden wo der vorher kopierte Code eingefügt werden kann.

Da wir es unten in der Navigationsleiste einfügen wollen müssen wir ihn direkt unter der Searchbox einfügen. Nach dem Abspeichern erscheint das Widget an der gewollten Stelle.

So einfach fügt man das Twitter Widget ein! ;)