Ikonka zamiast gadżetu "Obserwatorzy"? + darmowe social ikonki

Kilka osób wczoraj mnie prosiło o instrukcję jak dodać ikonkę zamiast gadżetu obserwatorzy. Sama dodałam taką u góry strony ("GFC") w razie gdyby gadżet standardowy nie działał.

Dodanie takiej ikonki jest niezwykle proste. Oczywiście najpierw musimy sobie stworzyć obrazek, a następnie podlinkować.

Wszystko teraz zależy od tego czy ikonka ma być zwykłym obrazkiem bez efektów, czy ma się zmieniać po najechaniu myszką. Jeśli interesuje Cię druga opcja możesz skorzystać z tego kodu:

<a href="ADRES STRONY"><img src="OBRAZEK1" border="0" onmouseover="this.src='OBRAZEK2'" onmouseout="this.src='OBRAZEK1'" /></a>

OBRAZEK1 - obrazek standardowy

OBRAZEK2 - obrazek po najechaniu myszką.

Jeśli chcesz dodać zwykły obrazek bez żadnych bajerów możesz po prostu wgrać swoją ikonę jako gadżet "Obraz" i podlinkować do odpowiedniej strony. Jeśli nie chcesz by ten obrazek miał jakikolwiek tytuł, w jego miejsce wpisz <!> 

Do czego jednak podlinkować?

Link będzie wyglądał następująco:

http://www.blogger.com/follow-blog.g?blogID=IDBLOGA 

Skąd wziąć ID BLOGA?

Wystarczy, że wejdziecie w pulpit nawigacyjny bloga. W pasku przeglądarki odnajdźcie ciąg numerów - to wasze ID.

W miejsce IDBLOGA wklejcie swój ciąg numerów.

Gotowe!

------

 

Jeśli chcecie skorzystać z moich gotowych obracających się ikonek (które są u góry strony) to skopiujcie ten gotowy kod i dodajcie na blogu jako gadżet HTML/JAVA:

<style> #social a:hover {background-color: transparent; opacity:0.1;} #social img { -moz-transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; -ms-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } #social img:hover { -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } </style> <div id="social"> <center>

<a href="ADRES FACEBOOK" target="_blank"><img src="http://img824.imageshack.us/img824/2375/jibd.png" border="0" alt="FB" /></a>

<a href="ADRES BLOGLOVIN" target="_blank"><img src="http://i1331.photobucket.com/albums/w582/yagoda_she/blofg_zps5c039aca.png" border="0" alt="bloglovin" /></a>

<a href="ADRES G+" target="_blank"><img src="http://img833.imageshack.us/img833/2130/nqcp.png" border="0" alt="g+" /></a >

<a href="ADRES KONTAKT" target="_blank"><img src="http://img713.imageshack.us/img713/3996/ogp1.png" border="1" alt="kontakt" /></a >

<a href="ADRES RSS"><img src="http://img163.imageshack.us/img163/8186/mrse.png" border="0" alt="rss" /></a >

<a href="ADRES DO OBSERWACJI"><img src="http://i1331.photobucket.com/albums/w582/yagoda_she/socialgfc_zps146d0f47.png~original" border="0" alt="GFC" />
</a>
<a href="ADRES DO ASKA"><img src="http://i1331.photobucket.com/albums/w582/yagoda_she/ask_zpsefc663f2.png~original" border="0" alt="ASK" />
</a>
<a href="ADRES DO INSTAGRAMU"><img src="http://i1331.photobucket.com/albums/w582/yagoda_she/insata_zps1334b2df.png~original" border="0" alt="Instagram" />
</a>
  <a href="ADRES DO PINGERA"><img src="http://i1331.photobucket.com/albums/w582/yagoda_she/pinger_zpsb8180ac4.png~original" border="0" alt="Pinger" />
</a>
</center> </div>

Jeśli nie potrzebujecie wszystkich ikonek wystarczy usunąć wybraną linijkę. Każdy obrazek zaczyna się od <a href=... a kończy </a>