flattr compact button wordpress post title head finish Flattr Button neben den Wordpress Post Titel
Also, Ziel soll es sein den Flattr Button im Post Kopf anzuzeigen, wie in meinem Blog. Das Flattr Plugin für WordPress bietet normalerweise nur das Ende des Beitrags an und selbst da sieht es dann katastrophal aus. Also am besten unter oder neben den Post Titel.

Zuerst braucht ihr das Flattr Plugin für WordPress. Die Installation wie immer, Upload, aktivieren. In den Flattr Optionen tragt ihr eure ID ein, wählt “text” beim Post Typ, “German” bei der Sprache (ausser ihr schreibt englische Artikel) flattr settings id 140x81 Flattr Button neben den Wordpress Post Titelund setzt das Häkchen bei “compact button”. Die restlichen Optionen werden nicht aktiviert, da kümmern wir uns jetzt drum.
Eure Flattr ID steht übrigends in euren Flattr Settings, bei User Information.

Nun öffnet die index.php eures Blog Designs. Entweder über “Appearance”->”Editor” oder über euren FTP Server. Sucht dort den Teil, der den Kopf eures Posts erstellt. Der Teil müsste recht weit oben stehen und beinhaltet wahrscheinlich Wörter wie “Head”, “title”, “Author” und “edit” ;)

Bei mir dieser Teil:

<div class="PostHead">
<h1><a title="Permanent Link to <?php the_title(); ?>" href="< ?php the_permalink() ?>" rel="bookmark">< ?php the_title(); ?></a></h1>
<small class="PostAuthor">Author: < ?php the_author() ?> < ?php edit_post_link('Edit'); ?></small></div>

So, nun einfach den folgenden Code in etwa auf die Höhe gepackt, wo ihr den Button sehen wollt:

<div class="flattr">< ?php the_flattr_permalink(); ?></div>

Exakt das Selbe macht ihr in der single.php nochmal. An der selben Stelle.

flattr compact button wordpress post title head 140x49 Flattr Button neben den Wordpress Post TitelBei mir war das also auf Höhe von Author und Edit, also dahinter geklatscht.
Das sieht dann noch nicht wirklich schön aus also rein in eure style.css des Designs und folgende Zeile hinzugefügt:

.flattr { position:relative; top:13px; left:0px; float: right; z-index:99; }

Speichert alles ab und schaut euch das Resultat an. Ihr müsst jetzt noch mit top: und left: solange hantieren, bis der Button richtig sitzt, ändert einfach die Werte entsprechend.

Das wars, sieht doch cool aus oder nicht? Bei Fragen oder Verbesserungen, comment below!