Jak zrobić graficzne odnośniki odsyłające do postów oznaczonych daną etykietą lub podstron?

Dzisiaj notka specjalnie dla Eweliny i Sylwii :* Wczoraj próbowałam im wytłumaczyć jak zrobić graficzne odnośniki do danych etykiet na blogu a dzisiaj stwierdziłam, że po prostu zrobię o tym notkę. No to zaczynamy :)

Ja zawsze robię napisy do podstron jako grafika, bo w programie mam dużo większe pole manewru jeśli chodzi o czcionki niż w bloggerze.

1. Tworzymy grafikę, która ma nam się pokazywać na blogu i odsyłać do postów oznaczonych jedną etykietą. Posłużę się jedną zrobioną przeze mnie wcześniej. Umieszczamy ją na stronie do hostingu zdjęć i kopiujemy link, który jest do danej grafiki przypisany (w imageshack.com nazywa się to link bezpośredni lub w tej nowej wersji - Direct).

2. Kiedy już mamy gotową grafikę, przechodzimy do kodu. Link pokazujący nam się w pasku przeglądarki przy kliknięciu jakiejś etykiety to http://po-prostu-piekno.blogspot.com/search/label/nazwa etykiety. Spróbujcie kliknąć w jakąś etykietę u siebie na blogu i zobaczcie jak to działa :)

3. Przechodzimy do wstawiania danej grafiki z odsyłaczem na naszego bloga. W Projekcie -> Układ wybieramy "Dodaj gadżet" i klikamy "HTML/Java Script". Pojawia nam się okienko do uzupełnienia. Oczywiście nazwy nie wpisujemy żadnej, zostawiamy górne okienko puste.

4. W dolnym (większym okienku) wklejamy kod:

<a href="link odsyłający do postów z daną etykietą";"><img border="0" src="link obrazka odsyłającego " /></a>

Możemy również wzbogacić ten kod o wycentrowanie. Ja zawsze tak robię, ponieważ wyśrodkowane grafiki lepiej się prezentują niż takie wyrównane automatycznie do lewej strony. Kod wtedy wygląda tak: 

<center><a href="link odsyłający do postów z daną etykietą";"><img border="0" src="link obrazka odsyłającego " /></a></center>

Zapisujemy gadżet i gotowe :) Takim sposobem możemy zrobić zarówno pojedyncze grafiki jak i kilka obok siebie czy każdą pod sobą.

5. Jeśli chcemy zrobić kilka etykiet obok siebie (czyli coś na kształt menu pod nagłówkiem), musimy wkleić ten kod w jednym gadżecie obok siebie kilka razy, najlepiej oddzielając każdy kod kilkoma spacjami. Oczywiście każdy wklejony kod dostosujemy pod inną etykietę i wklejamy link do innego stworzonego przez nas obrazka odsyłającego.

 6. Jeśli chcemy zrobić kilka etykiet i każdą pod sobą po każdym kodzie musimy dać enter, którym w kodzie jest znacznik <br>. Jeden taki znacznik to jeden enter, możemy dać tyle ile nam się podoba a im więcej enterów, tym odstęp będzie większy :)

7. Tak samo tworzy się podstrony "kontakt", "współpraca" i podobne, tylko wtedy link do podstrony będzie wyglądał następująco: http://po-prostu-piekno.blogspot.com/p/nazwa podstrony.html. i taki wklejamy do kodu.

Mam nadzieję, że odrobinę Wam pomogłam. Dajcie znać w komentarzach czy udało Wam się stworzyć takie graficzne podstrony na swoim blogu  :)