2011. július 13., szerda

Google+1 és Flattr gombok „felvarrása”

Egy valamirevaló vBulletin fórum fejlécében megtalálható a Google+1 és a Flattr gomb. Ezek elhelyezése annyira egyszerű, hogy nem is érdemes plugin-t keresni hozzájuk. Mindössze kettő sablont kell kiegészítenünk.


Az adminisztrációs felületen keressünk rá azokra a sablonokra melyeknek a címében szerepel az, hogy „head”.

A headinclude_bottom nevű sablon végére helyeztem a scripteket:

<script type="text/javascript">
/* <![CDATA[ */
    (function() {
        var s = document.createElement('script'), t = document.getElementsByTagName('script')[0];
        s.type = 'text/javascript';
        s.async = true;
        s.src = 'http://api.flattr.com/js/0.6/load.js?mode=auto';
        t.parentNode.insertBefore(s, t);
    })();
/* ]]> */
</script>

<script src="https://apis.google.com/js/plusone.js" type="text/javascript">
  {lang: 'hu'}
</script>

A html kódokat pedig header sablon végre, az utolsó <hr/> elé:

<div style="position:absolute; right:-4px; top:36px; width:210px; text-align: right;">
  <a class="FlattrButton" style="display:none;" rev="flattr;button:compact;" href="http://veteran.forum.hu"></a>
  <g:plusone size="medium"></g:plusone>
</div>

Természetesen a Flattr kódjában szereplő veteran.forum.hu-t cseréld ki a saját azonosítódra, különben én kapom helyetted is a zsózsót. ;-) Ha csak az egyik gombra van szükséged, akkor a másik kódját hagyd ki. Mindkét helyen az első a Flattr és a második a +1.

A pozicionálással nem vacakoltam sokat, abszolút koordinátákkal helyeztem el a fejléc számomra legszimpatikusabb helyén. Természetesen máshová is tehető, a felbontás kezelésének függvényében valószínű egyébként is módosítanod kell rajta. Még szebb lenne, ha ezt a minimális css-t is az additional.css-be tennénk, de ez legyen házi feladat! :-)

Ahogy a korábbi bejegyzésemben írtam, az lenne az igazán szuper, ha fórum tagjait is lehetne Flattr gombokkal honorálni. Sajnos egyelőre esélytelennek érzem erre rávenni a Veterán fórum tagságát, pedig a megvalósítás fentiekhez hasonlóan egyszerű lenne.


0 megjegyzés:

Megjegyzés küldése