Chcesz urozmaicenia swojej strony głównej chomika? Chcesz mied przyciski z Twoimi ulubionymi
chomikami? A może chcesz zrobid wystawę okładek wrzuconych materiałów, które przekierują
odwiedzających do odpowiednich folderów? Nic prostszego. Pokażę Wam dziś krok po kroku jak to
zrobid.
Przyciski z polecanymi chomikami
1. Otwórz edycję profilu.
2. Przyciski wstawimy przy pomocy kodu HTML. Dlatego musisz otworzyd okno dialogowe, które
Ci to umożliwi.
3. Pojawi się następujące okno:
Na razie jest puste, ale zaraz to się zmieni.
For Evaluation Only.
Copyright (c) by Foxit Software Company, 2004 - 2007
Edited by Foxit PDF Editor
4. Wpisujemy po kolei co następuje:
<p> - to oznacza, że rozpoczynamy nowy akapit.
<a href=”adres chomika” target=”_blank”> - tu jest pierwsza częśd linku do polecanego przez
nas chomika, gdzie:
a – od ang. anchor (kotwica) mówi, że zaczynamy definiowanie linku (odnośnika)
href – skrót od ang. hyperlink referrer, czyli określenie miejsca docelowego, do którego
odnośnik prowadzi
adres chomika – ten widoczny w pasku adresu przeglądarki
target – precyzuje gdzie otworzy się strona. Wartośd „_blank” mówi, że otworzy się w
nowej stronie/karcie.
<img src=”adres obrazka” border=”0” /> - dzięki temu wstawimy obrazek prezentujący avatar
chomika. Części składowe:
img – oznacza, że będziemy wstawiad obrazek
src – skrót od ang. source (źródło). Między cudzysłowami powinien byd adres, pod którym
znajduje się obrazek. Poniżej pokazuję jak go znaleźd.
border – definiuje grubośd ramki otaczającej obrazek. Bardzo nieestetycznie to wygląda,
także zrezygnujemy z niej. Wpisujemy wartośd 0. Nie jest tu konieczne podawanie miary,
domyślnie stosowane są piksele.
Wszystko zamykamy znacznikiem „/” – tak nakazują właśnie nowe normy. Jest
wytłumaczenie dlaczego należy tak robid, ale nie jest tutaj ważne.
</a> - zamykamy odnośnik. Wszystko, co znajduje się między <a> oraz </a> jest widziane w
przeglądarce jako link. Można wstawiad tam zarówno obrazki, jak i tekst. Można też oba na raz.
Nie wolno jednak zapomnied o tym elemencie, gdyż bez niego wszystko na stronie będzie
traktowane jako link.
</p> - kooczymy akapit
Przykładowy adres, który należy wpisad w miejsce kropek w cudzysłowie w następującym wyrażeniu: <a
href="...">
For Evaluation Only.
Copyright (c) by Foxit Software Company, 2004 - 2007
Edited by Foxit PDF Editor
Klikamy prawym przyciskiem myszy na avatar polecanego chomika. Z menu kontekstowego wybieramy
"Kopiuj adres obrazka". Wklejamy go w miejsce kropek w następującym wyrażeniu: <img src="..." />
Gdy skooczymy tak to mniej więcej może nasz kod HTML wyglądad:
For Evaluation Only.
Copyright (c) by Foxit Software Company, 2004 - 2007
Edited by Foxit PDF Editor
Powtórz wpisywanie kodów linków i obrazów aż umieścimy wszystkie chomiki, które chcemy
wyróżnid. Pamiętaj, że znacznik <p> znajduje się tylko raz, przed wszystkimi „przyciskami”. Tak samo
znacznik </p> występuje tylko raz, za wszystkimi przyciskami. Dla jasności:
NIE
TAK
Gdy zakooczymy wstawianie przycisków, klikamy przycisk „aktualizuj” a następnie zapisujemy
zmiany.
For Evaluation Only.
Copyright (c) by Foxit Software Company, 2004 - 2007
Edited by Foxit PDF Editor
Wstawianie przycisków do materiałów znajdujących się na naszym chomiku.
Kroki 1, 2 i 3 jak wyżej. Kod HTML służący do tego tworzymy analogicznie, tj:
<a href=”adres folderu z plikiem”><img src=”adres obrazka” border=”0” height=”100” style=”margin-
right:10px” /></a>
Nowy znacznik to style – definiujemy tu różne cechy obrazka. W powyższym przypadku chcę, aby
odstęp między zdjęciami wynosił 10 pikseli. Warto też ujednolicid wysokośd wszystkich obrazków
(okładek filmów, płyt). Wiadomo, w oryginale nie zawsze każdy jest jednakowej wielkości, a ustalenie
stałej wysokości pozwoli zachowad estetykę. Do tego celu służy element height – w nawiasach
podajemy wysokośd, domyślnie wyrażona w pikselach.
Nie będę pokazywad jak znaleźd adres obrazka, na pewno każdy sobie z tym poradzi. Poniższy
rysunek pokaże, jaki adres należy wpisad w cudzysłów przy href:
Menu kontekstowe otrzymujemy przez kliknięcie prawym przyciskiem myszy na nazwę folderu.
Pamiętaj o znacznikach akapitu, czyli <p> (na początku) i </p> (na koocu). Dzięki temu przyciski nie
zleją się z pozostałą częścią strony.
Przykładowy kod HTML przycisku:
<a href="orejra/muzyka/Linkin+Park+-+Minutes+to+Midnight+(2007)"><img style="margin-
right:10px" src="Image.aspx?id=14573886" border="0" alt="" height="100" /></a>
For Evaluation Only.
Copyright (c) by Foxit Software Company, 2004 - 2007
Edited by Foxit PDF Editor