VGH: Jak zmienić ikonkę bullet

Ikonka bullet to nic nadzwyczajnego, po prostu kilku pikselowa mała grafika, która jest wyświetlana w nawigacji, shoutboxie, profilu i innych panelach strony, która jest w postaci trójkącika, kropki, strzałki lub jeszcze innej formy w różnych kolorach. Coś strasznego? Może nie, ale jeśli jesteś osobą, która edytowała nie jednokrotnie styl strony to często taka pomarańczowa bądź zielona ikona wszystko wizualnie psuła. Przedstawię ci bardzo prostu kod, za pomocą którego zmienisz tą ikonkę, na taką jaką chcesz.

1. Utwórz lub edytuj już istniejący panel (lewy lub prawy):
PA -> zarządzanie stroną -> Zarządzanie panelami

2. Skopiuj i wklej w panel kod:
<style type="text/css">
/*---Ikonka bullet---*/
/*---Modyfikacja przygotowana przez Fantagiro || fantidesign.blogspot.com---*/
img[src*="bullet.gif"] {
background-image: url(http://www.websitebullets.com/bullet/218/1.gif);
overflow:hidden;
padding-top: 11px;
width: 11px;
height:0;
}
</style>
3. Zapisz panel i pamiętaj aby był włączony.

W przykładzie posłużyłam się ikonką z websitebullets.com.

Ważne:
  • atrybuty padding-top i width ustawiamy na takie wartości jakie ma wymiary ikonka. W przykładzie ikonka ma rozmiar 11x11px.
  • atrybut height musi zawsze mieć wartość 0!

Brak komentarzy:

Prześlij komentarz