2009. október 29.

Megosztás ikonok a blogodba

A weboldal tartalmának továbbosztását segítik az úgynevezett bookmarklet ikonok. Számos ilyen szolgáltató létezik már a weben, melyek egyszerű widget beillesztéssel segítik a blogger és az olvasók életét, hogy az éppen látott tartalom továbbküldhető legyen Facebook, Twitter, iWiW és Startlap irányba, vagy akár CitroMail segítségével továbbküldve. A kész dolgoknak megvan a maga hátránya, sajátot készíteni pedig macerás. Ezért megosztom a sajátomat, ha már megdolgoztam vele. Minden blog bejegyzésem mellett/felett látsz pár kis ikont, ezek az alábbi kód beszúrásával kerültek ki a helyükre.
<a target="_blank" href="http://www.twitter.com/" onclick="javascript:pageTracker._trackPageview('/share/twitter');window.open('http://twitter.com/home?status='+encodeURIComponent(document.title)+' '+encodeURIComponent(location.href));return false;" title="Add a Twitter-hez"><img border="0" width="16" alt="Add a Twitter-hez" src="http://sancho.hu/files/blog/content/shareicons/twitter.png" height="16" /></a>

<a target="_blank" href="http://www.facebook.com/" onclick="javascript:pageTracker._trackPageview('/share/facebook');window.open('http://www.facebook.com/share.php?u='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title));return false;" title="Add a Facebook-hoz"><img border="0" width="16" alt="Add a Facebook-hoz" src="http://sancho.hu/files/blog/content/shareicons/facebook.png" height="16" /></a>

<a target="_blank" href="http://www.startlap.hu/" onclick="javascript:pageTracker._trackPageview('/share/startlap');window.open('http://www.startlap.hu/sajat_linkek/addlink.php?url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title));return false;" title="Add a Startlaphoz"><img border="0" width="16" alt="Add a Startlaphoz" src="http://sancho.hu/files/blog/content/shareicons/startlap.png" / height="16" /></a>

<a onclick="javascript:pageTracker._trackPageview('/share/citromail');" style="border: 0px!important;" href="javascript:(function(){S='';D=document;W=window;if(D.selection) {Q=D.selection.createRange().text;} else if (W.getSelection) {Q=W.getSelection();} else if (W.getSelection) {Q=W.getSelection();}; var url=W.top.location.href;var title=window.top.document.title||'';var wn=title.replace(/[^a-zA-Z0-9]/gi,'_');window.open('http://citromail.hu/share/?url='+encodeURIComponent(url)+'&amp;subject='+encodeURIComponent(title)+'&amp;body='+escape(Q),wn,'width=490,height=395,toolbar=0,resizable=no,location=0,status=0,menubar=0,directories=0');})();"><img style="border: 0px!important;" src="http://img.citromail.hu/2.0/img/share/kek_4.png" alt="Oszd meg a Citromail-lel!" title="Oszd meg a Citromail-lel!" /></a>

<a target="_blank" href="http://www.iwiw.hu/" onclick="javascript:pageTracker._trackPageview('/share/iwiw');window.open('http://iwiw.hu/pages/share/share.jsp?u='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title));return false;" title="Add az iWiW-hez"><img border="0" width="16" alt="Add az iWiW-hez" src="http://sancho.hu/files/blog/content/shareicons/iwiw.png" height="16" /></a>

<a class="google-share" href="javascript:var%20b=document.body;var%20GR________bookmarklet_domain='http://www.google.com';if(b&amp;&amp;!document.xmlVersion){void(z=document.createElement('script'));void(z.src='http://www.google.com/reader/ui/link-bookmarklet.js');void(b.appendChild(z));}else{}" title="Add a Google Reader-hez" onclick="javascript:pageTracker._trackPageview('/share/greader');"><img border="0" width="16" alt="Add a Google Reader-hez" src="http://sancho.hu/files/blog/content/shareicons/greader.png" height="16" /></a>

<a target="_blank" href="http://feeds.feedburner.com/SanchoBlogja" rel="alternate" title="Add az RSS olvasódhoz" type="application/rss+xml" onclick="javascript:pageTracker._trackPageview('/share/rss');"><img border="0" width="16" alt="Add az RSS olvasódhoz" src="http://sancho.hu/files/blog/content/shareicons/rss.png" height="16" /></a>

A kódot a weboldalad azon részébe kell beilleszteni, ahová ki szeretnéd tenni az ikonokat. A sárgával kiemelt részre figyelj, mert oda a saját weboldalad RSS Feed linkjét kell beilleszteni. A többi weboldal és webmotor független, elvileg mindenhol működik. Amennyiben másik ikonképeket szeretnél alkalmazni, mindössze a kódokban a .png képek linkjeit kell kicserélned másra.

Update 2010-07-01
Bekerült a kódba egy kicsi kód, mely lehetővé teszi, hogy a Google Analytics statisztika rendszerben mérhesd, hányan kattintják le a megosztás ikonokat. Erről bővebben itt írok:
Bekerült egy új megosztás ikon, mely a CitroMail levelezőt használóknak segít a könnyű tartalom továbbküldésben. Erről itt olvashatsz bővebben: http://webmester.citromail.hu