Blogger to platforma wielu możliwości. Ludzie zaczęli to doceniać, stąd też pojawiło się zapotrzebowanie na poradniki, które pomogą eksperymentować z kodem HTML. W dniu dzisiejszym przedstawiam bardzo pożądaną ostatnim czasem instrukcję, dzięki której nudny tekst "Czytaj dalej" przenoszący nas do rozwinięcia posta możemy zamienić na jakąś interesującą i przyciągającą uwagę grafikę.
1. Na samym początku tworzymy napis, który zastąpi nam wprowadzone przez bloggera "Czytaj dalej". Może to być obrazek, ale i słowo. W moim przypadku jest to ta sama nazwa, jaką przedstawiłam na początku, ale w graficznej wersji zaaranżowanej przeze mnie. Obrazek zastępujący "Czytaj dalej" możemy stworzyć w Paint'cie lub znaleźć gotowy w internecie.
2. Kolejnym istotnym krokiem jest wrzucenie naszego obrazka na serwer hostujący zdjęcia (może to być ImageShack lub Tinypic - jak wolicie) - potrzebny nam jest bowiem bezpośredni link do obrazka.
3. Teraz czeka nas standardowa procedura, którą znacie z poprzednich instrukcji. Wchodzimy kolejno w panel Bloggera > Projekt > Szablon > Edytuj kot HTML. Gotowe? Nie zgubiliście się? W takim razie jedziemy dalej.
4. Przed sobą widzimy calusieńki kod HTML naszego bloga. Klikamy obojętnie gdzie (w pole kodu), a następnie klikamy na klawiaturze ctrl + f. W prawym górnym rogu powinno wyskoczyć nam okienko "Search:". Wklejamy tam poniższą frazę, po czym klikamy enter.
<b:if cond='data:post.hasJumpLink'>
5. Wyskakuje nam powyżej pokazany tekst, który został podkreślony na żółto. Nas interesuje jednak ta część, którą otoczyłam różowym kolorkiem na poniższym screenie. Zaznaczamy ją, a w jej miejsce wklejamy następujący kod:
<div class='jump-link'> <a expr:href='data:post.url + "#more"'><p align='center'><img border='0' src='URL DO OBRAZKA'/></p> </a> </div> </b:if>
6. Zamiast "URL DO OBRAZKA" wklejamy wcześniej wygenerowany przez serwis hostujący zdjęcia kod. W moim przypadku ma on postać http://i60.tinypic.com/2jcy555.jpg. Jeśli chcemy podejrzeć czy wszystko w porządku, wybieramy opcję Podgląd szablonu.
7. Jeśli wszystko się zgadza, klikamy Zapisz szablon. Od tej pory możemy cieszyć się nowym odnośnikiem rozwijającym nasz post. Gotowe!
skasuj ostatnie i działa mi
OdpowiedzUsuńCoś jest nie tak?? O.o
UsuńBez "< /b :if >" ostatniego działa z nic nie działało.
UsuńW poprzednim komentarzu usunęło mi (< /b:if >) z wiadomości.
Wszystko sprawdziłam i instrukcja jest prawidłowa. Ważne, żeby tego (/b :if) nie było za dużo i żeby niczego mu nie brakowało.
UsuńJa tylko mówię że bi działa beż ostatniego (/b :if) z miałam error. ale tak to super robota. Jeszcze raz dzięki :)
Usuńnie działa mi no....
OdpowiedzUsuńKurczę, niemożliwe! Instrukcja na pewno jest dobrze napisana. Opisz proszę swój problem :)
UsuńNie mam tej linijki w kodzie. Ktoś wie dlaczego?
OdpowiedzUsuńTak wygląda prawidłowy kod: klik
UsuńNa szaro zaznaczyłam konkretnie fragment odpowiedzialny za "czytaj dalej". Spróbuj odnaleźć w html'u treści mu towarzyszące (post-footer, post-header...), a w razie potrzeby uzupełnić brakujący tekst. Radzę najpierw zapisać szablon na dysku.
działa jak najbardziej ;-) dobra instrukcja ;-)
OdpowiedzUsuń