Najlepsze dodatki na bloga

Ten wpis będzie kontynuacją poprzedniego o dodawaniu obrazków do bocznej szpalty. Pomyślałam, że omawianie tych kwestii razem zajmie za dużo miejsca i może niektórych zniechęcić nadmiarem informacji. Wolę to omówić szczegółowo i dokładnie, niż szybko i po łebkach. Więc do dzieła.

PO CO NAM LINKI W BOCZNEJ SZPALCIE?

Najpierw napiszę, po co nam potrzebne linki w bocznej szpalcie. Oczywiście wszystko zależy od naszej pomysłowości i odpowiedzi jest bardzo wiele. Ja wykorzystałam linki w bocznej szpalcie na moim blogu książkowym, by miniaturki okładek książek oraz tytuły książek i nazwiska autorów były jednocześnie odnośnikami do recenzji na ich temat. Omówię więc tutaj nie tylko, jak dodać link do bocznej szpalty, ale również, jak z obrazka zrobić link. Dzięki takiemu rozwiązaniu możemy zrobić obrazkowe menu czy spis treści bloga, w którym każda pozycja na liście będzie linkiem do podstrony.

JAK DODAĆ LINK DO BOCZNEJ SZPALTY NA BLOGU?

Są na to dwa sposoby. Jeden dla początkujących, drugi dla zaawansowanych lub lubiących się uczyć (to prawie to samo).

Pierwszy sposób:

Wyobraź sobie, że chcesz dodać LINK do wpisu w zaawansowanym edytorze tekstowym. Zrób to w taki sposób, w jaki robiłeś to zawsze (kliknij kolejno: EDYTUJ -> NOWY WPIS -> wpisz swój tekst -> zaznacz go lewym przyciskiem myszki -> DODAJ/EDYTUJ LINK -> wklej adres URL -> potwierdź, klikając WSTAW). Na końcu skopiuj powstały kod HTML, klikając przycisk HTML i wklej kod w zakładce USTAWIENIA -> BOCZNA SZPALTA w POLU NA DODATKOWY HTML. Potwierdź, klikając ZAPISZ ZMIANY. Gotowe!

Tu przykład kodu linku zrobionego tym sposobem wzięty z mojego książkowego bloga:



Drugi sposób:

Tekst, który ma być linkiem „ubieramy” w znaczniki HTML. Tak naprawdę potrzebny będzie jeden, najważniejszy „a”:



<a href="ADRES URL">TWÓJ TEKST</a>



Dla przypomnienia: adres URL to ten zaczynający się od http://, znajdziemy go w pasku adresu przeglądarki po otwarciu strony, do ktorej ma prowadzić nasz link. Fioletowy tekst należy oczywiście zastąpić własnym.

Kod mamy. Teraz wklejamy go w POLU NA DODATKOWY HTML w zakładce USTAWIENIA -> BOCZNA SZPALTA. Potwierdzamy klikając ZAPISZ ZMIANY. I gotowe.

ZAMIANA OBRAZKA W LINK

Sposób pierwszy:

W edytorze tekstu dodajemy obrazek (jak to zrobić opisałam szczegółowo we wpisie o dodawaniu obrazków do bocznej szpalty), a potem zamieniamy go w link (zaznaczamy prawym przyciskiem myszki cały obrazek i klikamy WSTAW/EDYTUJ LINK, wklejamy adres URL, potwierdzamy klikając WSTAW). Następnie klikamy przycisk HTML i kopiujemy kod. Później wklejamy go w zakładce USTAWIENIA -> BOCZNA SZPALTA -> POLE NA DODATKOWY HTML.

Tu przykład kodu obrazka będącego linkiem:



Sposób drugi:

Dodajemy kolejny znacznik HTML. Tym razem img, znany nam już z poprzedniego wpisu.



<a href="ADRES URL STRONY"><img src="ADRES URL OBRAZKA" /></a>



Adres URL strony, do której ma prowadzić link kopiujemy z paska adresu przeglądarki, po otwarciu tej strony. Natomiast adres URL obrazka najłatwiej wziąć z zasobów naszego bloga, tylko wcześniej trzeba dodać tam plik (EDYTUJ ->  zakładka WPISY -> PLIKI -> klikamy dwa razy NOWY PLIK i wybieramy odpowiedni obrazek z komputera -> potwierdzamy klikając OTWÓRZ).

Kod mamy. Teraz wklejamy go w POLU NA DODATKOWY HTML w zakładce USTAWIENIA -> BOCZNA SZPALTA. Potwierdzamy klikając ZAPISZ ZMIANY. I gotowe.

POŁĄCZENIE OBRAZKA I TEKSTU W LINK

W HTML będzie wyglądać następująco:



<a href="ADRES URL STRONY"><img src="ADRES URL OBRAZKA" />TWÓJ TEKST</a>



Oczywiście można to również zrobić w edytorze w analogiczny sposób do tego, co opisałam wyżej. Będzie to wyglądało np. tak:

DODATKOWE OPCJE

Do tego pierwszego, podstawowego sposobu dodawania linku możemy dołączyć różne wariacje. Plusem tego rozwiązania jest to, że nie trzeba znać HTML, a wystarczy umieć obsługiwać zaawansowany edytor tekstowy i osiągniemy te same efekty, co jakbyśmy znali HTML.

Przydatne może się okazać dodanie tytułu do linku, żeby np. poinformować czytelników, do jakiej strony zostaną przekierowani. Albo dodanie opcji otwierania odsyłacza w nowej karcie, wtedy czytelnik nie opuści naszego bloga. Wszystkie te możliwości daje nam okienko w edytorze tekstu po kliknięciu przycisku DODAJ/EDYTUJ LINK.

Można również pogrubić niektóre elementy tekstu lub zmienić w pisane kursywą, czy podkreślone. Dodać odstępy. Możemy zrobić wszystko, co tylko można w edytorze wykonać. Potem wystarczy już tylko skopiować HTML i umieścić go w bocznej szpalcie.

WYGLĄD LINKÓW W BOCZNEJ SZPALCIE

Aby wstawione w boczną szpaltę linki ładnie wyglądały również należy się posłużyć albo edytorem albo wprost znacznikami HTML. Najważniejsze znaczniki: br, center opisałam we wpisie o bocznej szpalcie. Polecam również dodawanie boksów, które opisałam w tym samym wpisie.

U mnie, kiedy dodałam pogrubienie tekstu, odstęp między autorem i tytułem, a do tego otwarcie linku w nowej karcie i tytuł po najechaniu myszką, a i jeszcze tekst alternatywny dla niewidomych, wygląda to tak:



<p><a href="http://cowartoprzeczytac.blox.pl/2011/10/Orson-Scott-Card-Tropiciel.html" target="_blank"><img title="Tropiciel, Orson Scott Card" src="http://cowartoprzeczytac.blox.pl/resource/Tropiciel_150x150.jpg" alt="Tropiciel, Orson Scott Card" /><br /><b>Orson Scott Card</b><br />Tropiciel</a></p>

W razie niejasności proszę o wszystko pytać w komentarzach. Chętnie pomogę początkującym :-). Starałam się pisać możliwie jasno, ale temat jest szeroki jak rzeka i czuję, że mogłabym o tym książkę napisać ;-).