"Sexy-bookmarks" pentru Blogger care foloseste site-uri sociale romanesti

Acum cateva zile va prezentam widget-ul Sexy bokmarks pentru Blogger, in care site-urile sociale folosite erau toate straine. Astazi am sa prezint acelasi widget dar cu site-uri romanesti.

Ideea mi-a venit cand am vazut acest articol despre un plugin Wordpress numit Ro Social Bookmarks si care faciliteaza bookmark-ul postarilor catre 13 site-uri sociale romanesti, gen FTW, VoxRo, Ghidoo, Recomanda, Proddit, etc.

Asa ca am modificat cate ceva prin codul CSS creat de CSSReflex si cate ceva prin codul html care genereaza butoanele si face trimiterea catre site-urile sociale romanesti.
De asemenea o modificare importanta a fost aplicata si pozei care cuprinde butoanele. A fost greu pentru ca nu sunt chiar avansat in Photoshop si nu am gasit nici pe net vreo serie de icoane dedicate acestor site-uri.
Daca cineva care se pricepe bine la Photoshop e dispus sa faca niste icoane 32 pe 28 pentru aceste site-uri il rog sa ma contacteze.

Inainte sa trecem la instalare trebuie sa va mai spun ca widget-ul cuprinde butoane catre 11 site-uri sociale si v-a apare la sfarsitul fiecarei postari.

Demo

Instalarea primului widget de social bookmarking pentru Blogger care foloseste site-uri romanesti
1. Intrati la Aspect --> Editati Html si faceti o copie a actualului sablon, in caz ca ceva nu merge cum trebuie sa puteti reveni la el prin simpla incarcare a lui.

2. Bifati casuta care extinde codul sablonului (important)

3. Cu ajutorul combinatiei de taste Ctrl+F cautati urmatorul cod:

</head>

si inainte de el adaugati urmatorul cod CSS:

<style type='text/css'> div.sexy-widget { height:54px; background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAZw3aEnJ3YDog4bzqQC99i2NFAjtCPZ2e-6R0iztl1WrKoHzRu0WkQjCULM-Hfd-JikyjWfqzhEbAjcudPjqNSwqmMm-75Z5HYWlyin77ux8Szz81NJmKRYwdmc1KhD33VR7v1d0uSks/s1600/sexxy2.png') no-repeat left bottom; position:relative; width:540px; }
div.sexy-widget span.sexy-parteadreapta { width:17px; height:54px; background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAZw3aEnJ3YDog4bzqQC99i2NFAjtCPZ2e-6R0iztl1WrKoHzRu0WkQjCULM-Hfd-JikyjWfqzhEbAjcudPjqNSwqmMm-75Z5HYWlyin77ux8Szz81NJmKRYwdmc1KhD33VR7v1d0uSks/s1600/sexxy2.png') no-repeat right bottom; position:absolute; right:-17px; }
div.sexy-widget ul.social { margin:0 !important; padding:0 !important; position:absolute; bottom:0; left:10px; }
div.sexy-widget ul.social li { display:inline-block !important; float:left !important; list-style-type:none !important; margin:0 !important; height:29px !important; width:48px !important; cursor:pointer !important; padding:0 !important; }
div.sexy-widget ul.social a { display:block !important; width:48px !important; height:29px !important; font-size:0 !important; color:transparent !important; }
.sexy-bookmark9, .sexy-bookmark9:hover, .sexy-bookmark2, .sexy-bookmark2:hover, .sexy-bookmark4, .sexy-bookmark4:hover, .sexy-bookmark5, .sexy-bookmark5:hover, .sexy-bookmark1, .sexy-bookmark1:hover, .sexy-yahoo, .sexy-yahoo:hover, .sexy-blinklist, .sexy-blinklist:hover, .sexy-bookmark3, .sexy-bookmark3:hover, .sexy-bookmark7, .sexy-bookmark7:hover, .sexy-bookmark8, .sexy-bookmark8:hover, .sexy-myspace, .sexy-myspace:hover, .sexy-bookmark10, .sexy-bookmark10:hover, .sexy-script-style, .sexy-script-style:hover, .sexy-bookmark6, .sexy-bookmark6:hover, .sexy-syndicate, .sexy-syndicate:hover, .sexy-bookmark11, .sexy-bookmark11:hover { background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi78JJbMlYnz3nX0oh72V-VnDI1rZKrhJkeSyTr5Qf2TuRugB3qmscFFRcEVwWZuTKeZ6uMg-8TWdQQRHWCBG4s001rKCaa4ZOGWk_k-UZQPKgr3yXhnLuCPxmMXz3lfdvaVZFbmAQhiZk/s1600/sexy.jpg') no-repeat !important; }
.sexy-bookmark9 { background-position:-300px top !important; }
.sexy-bookmark9:hover { background-position:-300px bottom !important; }
.sexy-bookmark2 { background-position:-500px top !important; }
.sexy-bookmark2:hover { background-position:-500px bottom !important; }
.sexy-bookmark4 { background-position:-100px top !important; }
.sexy-bookmark4:hover { background-position:-100px bottom !important; }
.sexy-bookmark5 { background-position:-50px top !important; }
.sexy-bookmark5:hover { background-position:-50px bottom !important; }
.sexy-bookmark1 { background-position:left top !important; }
.sexy-bookmark1:hover { background-position:left bottom !important; }
.sexy-yahoo { background-position:-650px top !important; }
.sexy-yahoo:hover { background-position:-650px bottom !important; }
.sexy-blinklist { background-position:-600px top !important; }
.sexy-blinklist:hover { background-position:-600px bottom !important; }
.sexy-blogpoint { background-position:-700px top !important; }
.sexy-blogpoint:hover { background-position:-700px bottom !important; }
.sexy-myspace { background-position:-200px top !important; }
.sexy-myspace:hover { background-position:-200px bottom !important; }
.sexy-bookmark8 { background-position:-350px top !important; }
.sexy-bookmark8:hover { background-position:-350px bottom !important; }
.sexy-bookmark7 { background-position:-450px top !important; }
.sexy-bookmark7:hover { background-position:-450px bottom !important; }
.sexy-bookmark10 { background-position:-250px top !important; }
.sexy-bookmark10:hover { background-position:-250px bottom !important; }
.sexy-script-style { background-position:-400px top !important; }
.sexy-script-style:hover { background-position:-400px bottom !important; }
.sexy-bookmark6 { background-position:-550px top !important; }
.sexy-bookmark6:hover { background-position:-550px bottom !important; }
.sexy-bookmark3 { background-position:-150px top !important; }
.sexy-bookmark3:hover { background-position:-150px bottom !important; }
.sexy-bookmark11 { background-position:-753px top !important; }
.sexy-bookmark11:hover { background-position:-753px bottom !important; }
 </style>

4. Din nou folosindu-va de combinatia de taste Ctrl+F cautati acest cod:

<data:post.body/>

si imediat dupa el adaugati acest cod:

 <div class='sexy-widget'><ul class='social'>
<li class='sexy-bookmark1'><a expr:href='&quot;http://digg.ro/adauga-articol?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Adauga la DiggRo'/></li>
<li class='sexy-bookmark2'><a expr:href='&quot; http://www.recomanda.ro/recomanda_club/adauga?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Adauga la Recomanda'/></li>
<li class='sexy-bookmark3'><a expr:href='&quot; http://blogro.info/submit.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Adauga la BlogRO'/></li>
<li class='sexy-bookmark4'><a expr:href='&quot; http://blogpoint.ro/add_url.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Adauga la BlogPoint'/></li>
<li class='sexy-bookmark5'><a expr:href='&quot; http://www.ftw.ro/node/add/drigg/?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Adauga la FTW'/></li>
<li class='sexy-bookmark6'><a expr:href='&quot;http://preferate.net/add.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Adauga la Preferate'/></li>
<li class='sexy-bookmark7'><a expr:href='&quot; http://proddit.com/submit?url=&quot; +  data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Adauga la Proddit'/></li>
<li class='sexy-bookmark8'><a expr:href='&quot; http://voxro.com/node/add/drigg/?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Adauga la Vox.Ro'/></li>
<li class='sexy-bookmark9'><a expr:href='&quot; http://zilei.ro/submit/?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Adauga la Zilei.Ro'/></li>
<li class='sexy-bookmark10'><a expr:href='&quot; http://www.ghidoo.ro/nodes/new?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Adauga la Ghidoo'/></li>
<li class='sexy-bookmark11'><a expr:href='&quot; http://polimedia.us/fain/submit.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Adauga la Polimedia'/></li>
</ul><span class='sexy-parteadreapta'/></div>

Previzualizati si daca widget-ul apare pe blog puteti salva sablonul si apoi il puteti testa.

Observatii si indicatii:
- daca widget-ul depaseste latimea coloanei de postare de pe blogul vostru atunci stergeti una sau mai multe linii de cod din codul de la punctul 4.
Exemplu:

<li class='sexy-furl'><a expr:href='&quot; http://www.furl.net/storeIt.jsp?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share on Furl'/></li>

Stergand una din aceste linii practic stergeti unul din butonoanele din widget.
Apoi ca widget-ul sa arate bine v-a trebui sa modificati latimea acestuia. Pentru a schimba latimea trebuie sa umblati la numarul scris cu verde in codul de la punctul 3.
- daca dupa acest cod: <data:post.body/>  mai aveti alt widget adaugat, puteti incerca sa puneti codul de la punctul 4 dupa codul widget-ului respectiv.
- puteti incerca sa puneti codul de la punctul 4 si dupa sau inainte de una din aceste linii:

<div class='post-footer-line post-footer-line-1'>

<div class='post-footer-line post-footer-line-2'>

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

- daca vreti ca widget-ul sa nu apara pe pagina de pornire ci doar in pagina postarii atunci codul de la punctul 4 il puneti intre aceste doua linii astfel:

<b:if cond='data:blog.pageType == &quot;item&quot;'>

Codul de la punctul 4

</b:if>

- La accesarea anumitor site-uri de social bookmarks, dupa logare s-ar putea sa nu fiti redirectionati catre pagina de propunere a articolului. Nu este o problema din widget, ci din platforma utilizata de respectivul site.
Solutie: mai dati o data clic pe iconita site-ului respectiv, in pagina cu articolul dvs.
Anumite site-uri de social bookmarking pot face update la functiile platformei utilizate, rezultand o alta structura a linkurilor sau restrictionarea anumitor linkuri. In acest caz va trebui sa promovati manual articolul pe un astfel de site.(textul de la aceasta linie e copiat de pe blogul Dream Webdesign)