2007. május 29., kedd

Digg, del.icio.us és egyéb gombok berakása a Blogger bejegyzésekhez

No, ha már Web 2.0 meg blog meg ilyenek, akkor használjuk ki a lehetőségeket! Amikor az ember minden nap több különböző gépet használ, akkor igencsak előnyös, ha nem kell az összes internetes beállítását magával cipelnie vagy mindenütt beállítania. Szerencsére ma már van egy csomó jó eszköz, ami megkímél minket ettől, és a Web 2.0, AJAX és hasonló varázstechnológiáknak köszönhetően egyre több ilyet használhatunk.

Az ilyen alkalmazások közül az egyik kedvencem a del.icio.us lett. Alapvetően ez egy úgynevezett social bookmarking szolgáltatás, ami azért nagyon-nagyon jó, mert ma amiben benne van a social szó, az csak jó lehet. No mindegy, a lényeg, hogy az ember elmentegetheti a különböző — webes — könyvjelzőit, és bárhonnan elérheti őket. Persze — mivel az egész social alapon működik — különféle kapcsolatokat építgethetünk más emberekkel, ráadásul a rendszer még azt is nyilvántartja, hogy az általunk bejegyzett címet hány másik ember vette már fel a saját könyvjelzői közé. És ha még ez sem lenne elég, akkor lehetőség van arra, hogy egyes könyvjelzőket úgymond ne osszunk meg másokkal, azaz ha valaki a mi nevünkre kattint a rendszerben, akkor nem jelenik meg az adott könyvjelző a nevünkhöz társított listában — hadd ne mondjam, hogy ez mennyire hasznos ;)

A másik aranyos szolgáltatás a Digg!, ami nagyon hasonlít a del.icio.usra, de én úgy vettem észre, hogy a Digg! esetén inkább a hivatkozások mögött lévő tartalmon van a hangsúly. Szerintem ez arra jó, hogy az emberek a világ minden táján a netet böngészve felhívhassák mások figyelmét egyes érdekes dolgokra. Na mindegy, ha valakit érdekel, akkor majd utánaolvas.

Amiért az eddigieket leírtam, az az, hogy jelen blog elindítása után egy nagyon fontos ide vágó kérdéssel találtam szembe magamat. Nevezetesen, hogy hogy a fenébe lehet megoldani a Blogger lehetőségeivel, hogy minden egyes blogbejegyzésemet lehessen diggelni és hozzá lehessen őket adni a saját del.icio.us könyvjelzőinkhez? A Bloggerben akárhogy pakolásztam az elemeket, sehogy sem jöttem rá, hogy merre lehet ilyet csinálni, legfőképpen azért, mert az előre definiált elemeket rakosgathatom ugyan, de a Blogbejegyzések nevű esetén nem találtam olyan beállítást, hogy ezt meg ezt tegyük minden bejegyzésnek a végére.

Egy kis Google túrás után meg is lett az eredmény, amit most megosztok.

Ugyebár a Blogger lehetőségei között van egy olyan menüpont, hogy Template, aminél a blog által használt sablon beállításait lehet piszkálni. Ezen belül az első menüpont (Page Elements) alatt különböző dobozkákat lehet rakosgatni jobbra-balra, a második meg (Fonts and colors) a nevéhez híven mindenféle szín- és betűtípusbeállításokat tartalmaz. A harmadik fül az Edit HTML névre hallgat, ahol első ránézésre az előző két fül beállításait lehet látni HTML-ben és CSS-ben, esetleg lehet az egészen szerkeszteni.

Most jön a csavar a dologban: van egy olyan jelölőnégyzet, aminek a felirata Expand Widget Templates. Ha ezt kiválasztjuk, akkor egy halom előzőleg nem látható elemet is belerak a kódba, nevezetesen az egyes kis (az első fülön húzogatott) dobozkáknak a forrásával bővíti azt. Ez az, ami bőven elegendő a hozzá nem értőnek, hogy elmenjen a kedve a blogmotor sötét bugyraiban való turkálástól, és szintén ez az, ami kedvet csinál az egyszeri informatikusnak egy kis haxoláshoz. Utóbbi lévén meg is tettem, mégpedig a következőket.

Megkerestem, hogy hova is kellene berakni egy-két dolgot, hogy az minden bejegyzés után megjelenjen, mégpedig a bejegyzésre vonatkozó egyedi tartalommal. Ezt a helyet egy

<p class='post-footer-line post-footer-line-3'>

sor után találtam meg egy blogbejegyzés alapján. Már csak azt kellett kitalálni, hogy mit írjak. Avatott informatikusnak ez sem okoz nagy gondot, gyorsan meg is lett az első kódrészlet, ami a Digg! sorsát rendezi le egyszer és mindenkorra:

<a expr:href='"http://digg.com/submit?phase=2&amp;url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='DiggIt!' src='http://digg.com/img/badges/100x20-digg-button.png'/>
</a>

Ugye, milyen szép? :) Igazából annyira kellett rájönni, hogy hogyan lehet kombinálni a sablonszöveget, ami itt ugyebár a Digg!-re vonatkozó dolgokat jelenti, az egyes bejegyzésekhez tartozó adattal. Hát így :) Fontos, hogy az <a> elem href attribútuma előtt van egy expr: előtag! Ez teszi lehetővé ugyanis, hogy használjuk a data:post.title és data:post.url értékeket (ezek változók).

A del.icio.us esete ugyanez, csak ott előbb kellett vadásznom egy gombképet, mert sehogy sem találtam kifejezetten erre a célra ajánlottat a del.icio.us oldalain. Ez pedig a del.icio.us fejlécében található kép lett. Remélem egy darabig otthagyják :) így tehát az idevágó kódrészlet:

<a expr:href='"http://del.icio.us/post?v=4;url=" + data:post.url + ";title=" + data:post.title' target='_blank'><img height='20' src='http://images.del.icio.us/static/img/delicious.42px.gif' width='20'/></a>

A végeredményt pedig mindenki láthatja egy picit lejjebb, a bejegyzés alatt...

Nincsenek megjegyzések: