Jak dodać odsyłacz obrazkowy na bloga bądź stronę

Na każdym blogu bądź stronie internetowej często znajdują się różnego rodzaju linki które po kliknięciu odsyłają użytkownika do różnych miejsc na naszej stronie bądź w inne miejsca w sieci. Prosto pisząc linki do "droga na skróty" do różnych miejsc i są niezbędnym elementem każdej strony internetowej.

Takie linki można umieszczać wprost we wpisach, artykułach oraz  w innej treści a głównie stosowane są w tekście jako uzupełnienie wpisów i często przekierowania do dalszej części artykułu bądź szybkiego odesłania użytkownika do jakiegoś starszego postu związanego z konkretnym tematem na naszej stronie internetowej.

Nie każdy jednak wie ze linki odsyłające można również stosować w obrazkach, grafice lub zdjęciach w które po kliknięciu przekieruje użytkownika w konkretne miejsce na naszej stronie internetowej bądź w inne miejsce w sieci.

Odsyłacz obrazkowy z linkiem  często również stosuje się podczas zarabiania na swojej stronie internetowej gdyż można w nim ukryć link przekierowujący na przykład do jakieś strony związanej z programem  partnerskim w którym uczestniczymy.

Taka forma odsyłacza znajdującego się w obrazku czy grafice jest pewnego rodzaju urozmaiceniem oraz podwójnym zastosowaniem linku odsyłającego. Taką formę linku obrazkowego można zastosować w dowolnym miejscu na blogu bądź stronie internetowej a nawet w głównym jego szablonie.

Jednak często nie wiemy jak taki odsyłacz zrobić by działał prawidłowo a sam niedawno miałem z tym  problem a że w końcu udało mi się to poprawnie wykonać zrodził się pomysł na kolejny pomocny wpis poradnikowy.

Tak więc jak poprawnie wykonać link zamieszczony w obrazku:

Jak wykonać odsyłacz z linkiem w obrazku:

1. W pierwszej kolejności potrzebujemy kod HTML a dokładnie kod taki jak poniżej:

<a href="gdzie obrazek ma odsyłać"><img src="adres obrazka" alt="tekstalternatywny" /></a>


<center><a href="gdzie obrazek ma odsyłać"><img src="adres obrazka" alt="tekstalternatywny" /></a></center>

Ten kod można skopiować i wkleić go na przykład do notatnika oraz zapisać na przyszłość aby go mieć w razie potrzeby użycia zawsze pod ręką. Miejsca pogrubione w kodzie zostaną zastąpione linkami:

Powyżej przedstawiam dwa rodzaje tego kodu. Jeżeli zastosujemy znacznik <center> na początku kodu oraz znacznik </center> na końcu kodu, obrazek zostanie zawsze automatycznie umieszczony na środku strony bądź konkretnego wpisu. W popularnej platformie blogger mamy również możliwość wypośrodkowania obrazka w edytorze postu.

Bez zastosowania tego znacznika, obrazek będzie się zawsze znajdował automatycznie po lewej stronie.

Oznaczenia:

Gdzie obrazek ma odsyłać - czyli tu wklejamy link do strony lub podstrony lub miejsca gdzie po kliknięciu w obrazek czytelnik zostanie odesłany.

Link obrazka - czyli adres obrazka - obrazek trzeba gdzieś umieścić może to być jakiś darmowy hosting obrazków bądź inne miejsce. Link obrazka kopiujemy i wklejamy do kodu.

Tekst alternatywny - tu można wpisać cokolwiek jeżeli chcemy na przykład jakąś nazwę obrazka. Jeżeli nie chcemy nazwy obrazka to kasujemy tekst alternatywny lub go zostawiamy ponieważ i tak się nie będzie wyświetlał.

2. Tak przygotowany kod z wklejonymi linkami kopiujemy i wklejamy w edytorze tekstu w poście jako kod HTML w miejscu gdzie chcemy aby obrazek się wyświetlał.

Pamiętajmy że kod wklejamy w trybie edycji HTML posta, gdyż zwykły edytor tekstowy nie umożliwia nam wklejania kodów HTML. Jeżeli wkleimy w zwykłym edytorze obrazek nie będzie dział poprawnie i nie będzie się wyświetlał.

Podsumowanie:

Tak więc odsyłacz obrazkowy to tuż obok popularnych linków tekstowych  bardzo funkcjonalna forma na przekierowanie użytkownika w konkretne miejsce na naszej stronie internetowej bądź każde inne miejsce w sieci warto z takiej możliwości skorzystać.

Pozdrawiam!