Jak dodać inicjał do postów na Bloggerze?

Jak dodać inicjał do postów na Bloggerze?

Jak dodać inicjał do postów na Bloggerze?
Adam Kaczmarek
24.05.2009 13:00

Wczoraj napisałem jak zainstalować chmurę tagów na blogach Blogger. Dziś kolejny hack, a dokładniej modyfikacja kodu pozwalająca na wyświetlanie inicjału rozpoczynającego wpis.

Wczoraj napisałem jak zainstalować chmurę tagów na blogach Blogger. Dziś kolejny hack, a dokładniej modyfikacja kodu pozwalająca na wyświetlanie inicjału rozpoczynającego wpis.

Hack o którym chcę napisać nie wymaga takiej ingerencji co chmura tagów.

  1. Wejdź w Panel Nawigacyjny > Układ > Edytuj kod HTML
  1. Wklej poniższy tekst tak jak jest to pokazane na obrazku. Zazwyczaj po *<b:skin><![CDATA[/ i po informacji o autorze szablonu czyli w miejscu gdzie określasz rozmiary czcionek i innych elementów bloga. Tak jak na obrazku poniżej kodu.

.initialcap{

float: left;

font-size: 40px;

line-height: 35px;

font-family: Georgia, "Times New Roman", Times, serif;

color: #2583ad;

padding-right: 5px;

}

[cytat]Przykład:

snap14
snap14
  1. Teraz wystarczy dopasować krój czcionki oraz jej kolor i rozmiar.

Zmień font-family: Georgia, "Times New Roman", Times, serif; na czcionkę jakiej używasz na swoim blogu lub na taką, która po prostu będzie ładnie się wpasowywała w design.

Zmień kolor poprzez modyfikację color: #2583ad;. Ta strona pomoże Ci dopasować jej kolor.

Zmień rozmiar czcionki modyfikując font-size: 40px; a wysokość wierszy, które zajmie inicjał przez line-height: 35px;.

Dodatkowo możesz zmniejszyć bądź zwiększyć przerwę pomiędzy literami zmieniając wartość padding-right: 5px;

  1. Zapisz szablon. Koniec modyfikacji.

Teraz kiedy będziesz pisał posta, musisz dodać kawałek kodu pomiędzy pierwszą literą.

  1. Zrobisz to wchodząc w zakładkę Edytuj kod HTML w Zamieszczanie postów > Utwórz.
  1. Teraz wklej <span class="initialcap"> na samym początku i </span> po pierwszej literze tak jak jest to pokazane na obrazku poniżej.
snap23
snap23

Końcowy efekt powinien wyglądać mniej więcej tak:

snap31
snap31

Pamiętaj, że przy zmianie szablonu, musisz ponownie dodać powyższy kod.

Źródło: Web Nudge

Źródło artykułu:WP Gadżetomania
Oceń jakość naszego artykułuTwoja opinia pozwala nam tworzyć lepsze treści.
Wybrane dla Ciebie
Komentarze (0)