Jak zrobić i wstawić ruchome banery na bloga

piątek, 8 stycznia 2016

Ostatnio bardzo dużo osób pytało się jak zrobić i wstawić ruchome banery na bloga. Nie wiem skąd nagle takie duże zainteresowanie, ale nie ważny jest powód. Najważniejsze jest to, że ta instrukcja pomoże nam zrobić porządek z dużą ilością banerów na naszym blogu, które tylko zajmują miejsce w kolumnie bocznej, przez co blog, potrafi ciągnąć się w nieskończoność. Między nami mówiąc, miałam nie publikować tej instrukcji z paru powodów, ale nie wnikajmy w to teraz. Mam nadzieję, że komuś się przyda ta instrukcja.

Instrukcja jest bardzo prosta i opierać się będzie tylko i wyłącznie na kodzie HTML/JavaScript i wrzuceniu zdjęć na hosting, więc nie ma opcji, abyśmy coś popsuli

1. Przygotowujemy sobie banery, które mają nam się wyświetlać + linki, aby po kliknięciu w baner odsyłało nas na daną stronę.

2. Przechodzimy do strony TinyPic, która umożliwia nam hosting zdjęć/plików graficznych i wklejamy po kolei nasze banery.

Zaznaczamy opcje "Dodaj plik ze swojego dysku", a następnie wybieramy "Wybierz plik".  Po wybraniu pliku wybierz "Prześlij".

Jest opcja wybrania wielu plików na raz (dokładnie to 2), ale u mnie to nie przeszło, możecie jednak próbować, może akurat Wam się uda :)

3. Kiedy nasze pliki już się pojawią, to pod obrazkiem będziemy mieli link, który będzie nam potrzebny. Musimy go skopiować i wkleić na chwilę do notatnika, aby się "nie zgubił".

4. Przechodzimy teraz do układ - dodaj gadżet - HTML/JavaScript i dodajemy poniższy kod:

<marquee behavior="scroll">
<a href="LINK DO STRONY"><img src="LINK DO OBRAZKA" />
</a>
<a href="LINK DO STRONY"><img src="LINK DO OBRAZKA" />
</a>
<a href="LINK DO STRONY"><img src="LINK DO OBRAZKA" />
</a>
</marquee>

Zdania pogrubione, odpowiednio podmieniamy. Jeśli chcemy mieć więcej niż 3 banery to po ostatnim </a>, a przed </marquee> wstawiamy:

<a href="LINK DO STRONY"><img src="LINK DO OBRAZKA" />
</a>

Jeśli spodobał Ci się wpis, przekaż go dalej :)