10 apr. 2011

Twitter si Facebook butoane


Am vorbit deja despre indexarea blogului, despre etichete si cum sa creeam un nor de etichete deosebit, cum sa ascundem navbar si cum sa schimbam favicon. Dar acum as vrea sa va vorbesc cum sa adaugam butoane "tweet" si "share" de la facebook si twitter, ca utilizatorii blogului sa poata distribui blogul nostru in aceste retele sociale, ceea ce este important pentru noi si ce ne ajuta sa facem blogul mai renumit si vizitat. Deci in mod implicit aceste butoane deja exista sub fiecare postare, dar blogul nostru trebuie sa fie cel mai bun si nu ne multumim cu butoanele standart, avem nevoie de ceva deosebit. De exemplu butoanele care ne vor "urmari" oriunde ne vom afla, si vor atrage vederea vizitatorilor.
Este foarte simplu, vom avea nevoie de urmatorul cod:



<!-- floating page sharers Start bloggersentral.com-->
<style>
#pageshare {position:fixed; bottom:15%; margin-left:-15px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#ebebeb;padding:0 0 2px 0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style>
<div id='pageshare' title="Eucunosc.blogspot.com">
<div class='sbutton' id='fb'>
<a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
</div>
<div class='sbutton' id='rt'>
<script src="http://tweetmeme.com/i/scripts/button.js" type='text/javascript'></script>
</div>
<div style="clear: both;font-size: 9px;text-align:center;">
</div>
<div style="clear: both;font-size: 11px;text-align:center;"><a href="http://eucunosc.blogspot.com/2011/04/twitter-si-facebook-butoane.html">Vrei si tu?</a></div>
<!-- floating page sharers End --></div>

Acest cod al introducem intr-un obiect gadget HTML/JavaScript (Tablou de bord => Design, adaugam un obiect gadget), daca deja aveti obiect gadget de acest tip puteti sa-l complectati cu scriptul dat.
Dupa ce am introdus codul nostru, putem vizualiza blogul. Fiecare blog are design diferit, deaceea butoanele noastre pot sa apara la locul nepotrivit. In asa caz modificam putin codulul, anume ne intereseaza margin-left:-15px; aceasta secventa de cod ne indica distanta in pixeli a butoanelor de la marginea stanga a gadgetului nostru, astfel modificam distanta schimband valoarea, de semnul numarului depinde directia deplasarii butoanelor, daca numarul este cu semnul minus, adica negativ, butoanele se misca spre stanga, daca  pozitiv, invers  (daca doriti sa mutati butoanele spre stanga, in loc de -15 puneti un numar mai mic ca -15  de exemplu -100 daca doriti sa mutati in dreapta puneti 100, adica mai mare ca -15, daca veti pune 0 butoanele se vor plasa direct pe gadget).
Puteti adauga si alte butoane, aveti nevoie sa adaugati in script codul butonului in interiorul tagului "div" :
<div class='sbutton'>
CODUL BUTONULUI DVS.
</div>
Sper ca am explicat destul de clar si ca ati insusit totul. Daca apar neclaritati, intrebati. Va doresc mult succes in promovarea blogului dvs.

Niciun comentariu:

Trimiteți un comentariu