Stulle's kleines Lesebuch

WordPress PlugIn: flickrRSS

Nachdem ich nun einige Zeit damit verbracht habe mich mit den Gepflogenheiten von WordPress auseinander zu setzen, habe ich in der Sidebar nun direkt ein kleines PlugIn zur Darstellung der letzten flickr Fotos mit eingebunden: flickrRSS.

In dieser Blogeintrag möchte ich ein wenig darauf eingehen, wie das Skript angepaßt werden muss und wo ihr z.B. die Anpassungen am Layout machen könnt.

Das flickrRSS PlugIn könnt ihr direkt unter dem Link zum Autoren herunterladen.

Diese müsst ihr entpacken und anschließend in das PlugIn-Verzeichniss eurer WordPress Installation kopieren. Anschließend braucht ihr das PlugIn nur noch zu aktiveren.

Im Adminbereich habt ihr nun unter dem Menupunkt Einstellungen eine weitere Option: flickrRSS. Hier könnt ihr komfortabel alle relevanten Einstellungen an eurem PlugIn vornehmen. Es ist hierbei jedoch sehr wichtig zu betonen, dass die flickrID nicht Euer flickr-Name ist. Wer seine flickrID herausfinden will, ist mit diesem Link bestens bedient.

Im HTML Builder innerhalb eurer Konfiguration, könnt ihr nun sowohl HTML vor, als auch hinter dem Output des PlugIns definieren. Ich habe hier folgendes gemacht:

Zuerst möchte ich um die Ausgabe des PlugIns einen eigenen Container legen, um diesen anschließend unabhänig layouten zu können. Ihr könnt dies auch über eine Klasse oder direkt in den Formatierungen des PlugIns machen, ich finde aber eine solche Trennung recht sinning.

Before List:

<div id="flickrRSS_container">

After List:

  <a href="http://www.flickr.com/photos/derstulle/"
           target="_blank"
           title="See all my flickr pictures!">
    See all
  </a>
</div>

Dies führt dazu, dass ihr euren flickr Container schließt und noch einen abschließenden Link auf Eure flickr Bilder setzt. (Der Benutzername muss natürlich angepasst werden. Und ja ich meine hier wirklich den Namen und nicht die ID!)

Nun müsst ihr noch eure eigentlichen Links definieren. Hier könnt ihr auf diverse Vorlagen des flickrRSS Plugins zurückgreifen, welches die Bilder versucht von flickr einzubinden.

Item HTML:

<a href="%flickr_page%" title="%title%" target="_blank">
  <img src="%image_square%" alt="%title%"/>
</a>
<br />

Somit laßt ihr Euch eure Bilder im flcikr Format suqare anzeigen und setzt einen entsprechenden Link auf dieses Bild bei flickr. Ferner übernehmt ihr auch den flickr Titel als title Attribut für Euren Link.

Nachdem das PlugIn nun installiert, aktiviert und konfiguriert ist, müssen noch Änderungen an der sidebar.php und der style.css vorgenommen werden.

Änderungen an der sidebar.php

<li><h2><span>flickr</span></h2>
 <ul>
  <?php
   if(function_exists(get_flickrRSS))
    get_flickrRSS();
  ?>
 </ul>
</li>

Damit hättet ihr sowohl geprüft, ob Eure WordPress-Installation die Funktion und somit das PlugIn kennt oder ob dies nicht der Fall ist und ihr die Funktion somit auch gar nicht aufrufen könntet.

In der style.css könnt ihr dann den Container flickrRSS_container nach Eurem CI anpassen.

Änderungen an der styles.css

/** flickrRSS IDs and Styles **/
#flickrRSS_container {
 list-style-type: none;
}

#flickrRSS_container img {
 margin: 0 0 10px 0;
 border: none;
}

In meinem Fall habe ich für die Listenitems den Style abgeschaltet und für das Bild einen Versatz gesetzt und den Rahmen abgeschaltet.

Ich hoffe, Euch hat dieses kleine Tutorial geholfen und ihr laßt mir einen kleinen Kommentar hier.

LG Stulle

Dieser Beitrag wurde 2009-07-04 um 02:49 unter der Kategorie Coding gespeichert. Du kannst Kommentare zu diesem Beitrag mit Hilfe vom RSS 2.0 Feed verfolgen. Du kannst einen Kommentar abgeben, oder ein Trackback von Deiner eigenen Seite.