Jak zwiększyć atrakcyjność swojego Chomika

Jak zwiększyć atrakcyjność swojego Chomika

1. Tworzenie linków tekstowych

Link (inaczej: hiperłącze, odnośnik lub odsyłacz) - to specjalnie wyróżniony tekst lub grafika, po kliknięciu którego zostajemy przeniesieni do innej strony w sieci.

Aby utworzyć link tekstowy na Chomikuj.pl, musimy posłużyć się językiem HTML, czyli językiem, którego używa się do tworzenia stron internetowych.

Kod HTML do tworzenia linków tekstowych wygląda następująco:

<a href="adres strony">widoczny tekst</a>

W miejsce "adres strony" należy wpisać pełny adres internetowy strony, do której ma prowadzić link (w naszym przykładzie będzie to: http://chomikuj.pl/).

Natomiast w miejsce "widoczny tekst" należy wpisać krótki opis, który będzie widoczny na ekranie i po kliknięciu którego nastąpi przejście pod wskazany adres (w naszym przykładzie będzie to: Darmowy dysk internetowy).

Przykład:

HTML:

<a href="http://chomikuj.pl/">Darmowy dysk internetowy</a>

Efekt:

Darmowy dysk internetowy

Lista miejsc w serwisie Chomikuj.pl, w których można umieszczać linki:

Informacje o Chomiku (Profil)
Opisy plików
Opisy folderów
Komentarze do plików
Chomikowe rozmowy (ShoutBox)

Jeżeli masz jakieś pytanie - napisz do mnie na Chomiku

Do góry

2. Tworzenie linków obrazkowych

W serwisie Chomikuj.pl można spotkać obrazki, które po kliknięciu zachowują się jak linki, czyli przenoszą nas w inne miejsce w sieci - są to tak zwane linki obrazkowe (inaczej: linki graficzne). Utworzenie takich "graficznych przycisków" sprowadza się do połączenia kodu odpowiedzialnego za wyświetlanie linków tekstowych, czyli: <a href="...">...</a>, z kodem, który wyświetla grafikę, czyli: <img src="..." alt="..." />.

Kod HTML do tworzenia linków obrazkowych będzie więc wyglądał następująco:

W miejsce "adres strony" należy wpisać pełny adres internetowy strony, do której, po kliknięciu obrazka, chcemy się przenieść (w naszym przykładzie będzie to: http://chomikuj.pl/ebooki-download).

W miejsce "adres obrazka" należy wpisać pełny adres internetowy obrazka (w naszym przykładzie będzie to: http://chomikuj-wyszukiwarka.eu/graphics/free.png).

Natomiast zamiast "krótki opis obrazka" należy wpisać kilka słów opisujących obrazek, które pojawią się u użytkowników z wyłączonym wyświetlaniem grafiki. Dzięki temu także w ich przeglądarkach będzie możliwość używania linków obrazkowych, mimo iż grafika nie zostanie wyświetlona. W naszym przykładzie, tym opisem będzie: Darmowy transfer plików.

Przykład:

HTML:

Efekt:

Dobrym pomysłem na wykorzystanie linków obrazkowych na portalu Chomikuj.pl, jest utworzenie oryginalnego "przycisku kierującego do Chomika", który można umieszczać zamiast standardowego np. w "Chomikowych rozmowach" lub na forum czy blogu. Ponieważ te standardowe przyciski praktycznie niczym się od siebie nie różnią - zastosowanie własnego (z oryginalną grafiką) z pewnością zwiększy liczbę osób, które będą zainteresowane odwiedzeniem Twojej spiżarni.

Jeżeli masz jakieś pytanie - napisz do mnie na Chomiku

Do góry

3. Wstawianie grafiki

Kod HTML do wstawiania grafiki na Chomikuj.pl:

W miejsce "adres obrazka" należy wpisać pełny adres internetowy obrazka (w naszym przykładzie będzie to: http://chomikuj-wyszukiwarka.eu/graphics/ptak.png).

Natomiast w miejsce "krótki opis obrazka" należy wpisać kilka słów opisujących obrazek, które pojawią się u użytkowników z wyłączonym wyświetlaniem grafiki (w naszym przykładzie będzie to: Ptak).

Przykład:

HTML:

Efekt:

0x01 graphic

Krok po kroku, jak umieścić obrazek w opisie swojego Chomika:

Przejdź na stronę Chomikuj.pl i zaloguj się do swojego konta jako właściciel
Umieść wybrany obrazek w dowolnym, niezahasłowanym folderze swojego Chomika
Kliknij na jego miniaturkę prawym przyciskiem myszy i wybierz "kopiuj adres odnośnika" lub "kopiuj skrót"
Przejdź do edycji ustawień swojego Chomika klikając w link
W zakładce "Informacje o Chomiku" kliknij przycisk
W miejscu, w którym ma zostać umieszczony obrazek - wpisz kod: <img src="" alt="" />
Umieść kursor myszy pomiędzy dwoma cudzysłowami (fragment kodu: src="") i wklej ze schowka skopiowany wcześniej adres obrazka ("CTRL + V" lub prawy przycisk myszy i "Wklej")
Następnie pomiędzy dwoma cudzysłowami (fragment kodu: alt="") wpisz kilka słów opisujących obrazek
Zaakceptuj zmiany w zawartości HTML poprzez kliknięcie przycisku
Zapisz zmiany w opisie Chomika klikając przycisk

W podobny sposób można też wklejać elementy graficzne w "Chomikowych rozmowach" lub w opisach plików i folderów. Należy jednak pamiętać, że umieszczanie zbyt wielu obrazków może utrudnić innym użytkownikom przeglądanie zawartości Twojego Chomika.

Jeżeli masz jakieś pytanie - napisz do mnie na Chomiku

Do góry

4. Rodzaje czcionek

Czasami chcielibyśmy, w "Informacjach o Chomiku" lub w "Chomikowych rozmowach", napisać coś czcionką inną niż ta, która została ustawiona przez twórców strony Chomikuj.pl. W takiej sytuacji najlepiej użyć styli CSS, dzięki którym możemy określić rodzaj czcionki, jej wielkość, kolor, grubość itp.

Poniżej znajduje się kod HTML akapitu (...), wraz ze stylem CSS (style="..."), który określa rodzaj czcionki:

Treść akapitu

W miejsce "rodzaj czcionki" należy wpisać nazwę czcionki (w naszym przykładzie będzie to: Georgia).

Uwaga: Jeżeli nazwa czcionki składa się z więcej niż jednego wyrazu, należy ją objąć w znaki apostrofu (np.: 'Comic Sans MS', 'Monotype Corsiva', 'Times New Roman', 'Courier New').

Natomiast w miejsce "Treść akapitu" należy wpisać tekst, którego wygląd chcemy określić (w naszym przykładzie treścią akapitu będzie zdanie: To jest tekst napisany czcionką Georgia).

Przykład:

HTML:

To jest tekst napisany czcionką Georgia

Efekt:

To jest tekst napisany czcionką Georgia

Nazwy wybranych czcionek:

Arial
'Arial Black'
'Arial Narrow'
'Arial Unicode MS'
Verdana
Tahoma
'Trebuchet MS'
Georgia
'Courier New'
'Times New Roman'
'Palatino Linotype'
'Lucida Sans Unicode'
'Comic Sans MS'
'Microsoft Sans Serif'
Mistral
'Monotype Corsiva'
'Tw Cen MT'
'Tw Cen MT Condensed'
Impact
'Book Antiqua'

Uwaga: Jeżeli użytkownik czytający Twój tekst, nie będzie posiadał danej czcionki w swoim systemie, tekst zostanie mu wyświetlony czcionką domyślną (najprawdopodobniej 'Times New Roman'). Poza tym nie każda czcionka potrafi poprawnie zapisać polskie znaki (ą, ę, ć, ś, ź, ż, ó) w standardzie ISO.

Jeżeli masz jakieś pytanie - napisz do mnie na Chomiku

Do góry

5. Wielkość czcionki

Kod HTML akapitu, wraz ze stylem CSS, który określa wielkość czcionki:

Treść akapitu

W miejsce "wielkość czcionki" należy wpisać konkretną wielkość czcionki wyrażoną w pikselach (px). W naszym przykładzie wielkość czcionki będzie wynosiła: 18px.

Natomiast w miejsce "Treść akapitu" należy wpisać tekst, którego wygląd chcemy określić (w naszym przykładzie treścią akapitu będzie zdanie: To jest tekst napisany czcionką o wielkości 18 pikseli).

Przykład:

HTML:

To jest tekst napisany czcionką o wielkości 18 pikseli

Efekt:

To jest tekst napisany czcionką o wielkości 18 pikseli

Jeżeli masz jakieś pytanie - napisz do mnie na Chomiku

Do góry

6. Kolor czcionki

Kod HTML akapitu, wraz ze stylem CSS, który określa kolor czcionki:

Treść akapitu

W miejsce "kolor czcionki" należy wpisać nazwę koloru (np. black, red, green, blue). Zaleca się jednak określanie kolorów za pomocą kodu heksadecymalnego (HEX). Zapis heksadecymalny składa się z sześciu cyfr poprzedzonych znakiem # (krzyżyk). W naszym przykładzie tekst będzie koloru czerwonego (red), a jego zapis heksadecymalny będzie wyglądał następująco: #FF0000.

W miejsce "Treść akapitu" należy wpisać tekst, którego wygląd chcemy określić (w naszym przykładzie treścią akapitu będzie zdanie: To jest tekst napisany czcionką w kolorze czerwonym).

Przykład:

HTML:

To jest tekst napisany czcionką w kolorze czerwonym

Efekt:

To jest tekst napisany czcionką w kolorze czerwonym

Podstawowa paleta kolorów:

Nazwa	HEX	Kolor
black	#000000
silver	#C0C0C0
gray	#808080
white	#FFFFFF
maroon	#800000
red	#FF0000
purple	#800080
fuchsia	#FF00FF
green	#008000
lime	#00FF00
olive	#808000
yellow	#FFFF00
navy	#000080
blue	#0000FF
teal	#008080
aqua	#00FFFF

Rozszerzona paleta kolorów:

Jeżeli masz jakieś pytanie - napisz do mnie na Chomiku

Do góry

7. Tekst pogrubiony

Aby pogrubić jakiś fragment tekstu, należy objąć go następującymi znacznikami HTML:

Tutaj wpisz swój tekst

Przykład:

HTML:

Ten tekst został pogrubiony, a ten tekst nie został pogrubiony

Efekt:

Ten tekst został pogrubiony, a ten tekst nie został pogrubiony

Jeżeli masz jakieś pytanie - napisz do mnie na Chomiku

Do góry

8. Tekst pochylony

Aby napisać coś pismem pochyłym, należy dany fragment tekstu umieścić pomiędzy znacznikami:

Tutaj wpisz swój tekst

Przykład:

HTML:

Ten tekst jest napisany pismem pochyłym, a ten tekst - pismem zwykłym

Efekt:

Ten tekst jest napisany pismem pochyłym, a ten tekst - pismem zwykłym

Jeżeli masz jakieś pytanie - napisz do mnie na Chomiku

Do góry

9. Tekst podkreślony

Aby na Chomikuj.pl podkreślić jakiś fragment tekstu, należy objąć go takimi oto znacznikami HTML:

Tutaj wpisz swój tekst

Przykład:

HTML:

Ten tekst został podkreślony, a ten tekst nie został podkreślony

Efekt:

Ten tekst został podkreślony, a ten tekst nie został podkreślony

Jeżeli masz jakieś pytanie - napisz do mnie na Chomiku

Do góry

10. Łączenie styli formatujących tekst

Jeżeli chcemy, aby nasz tekst miał kilka cech wyglądu naraz, należy połączyć ze sobą wybrane style CSS i/lub znaczniki HTML.

Rodzaj czcionki + Wielkość czcionki + Kolor czcionki + Pogrubienie

Tutaj wpisz swój tekst

W miejsce "rodzaj czcionki" należy wpisać nazwę czcionki (w naszym przykładzie będzie to: 'Times New Roman').

W miejsce "wielkość czcionki" należy wpisać wielkość czcionki wyrażoną w pikselach [px] (w naszym przykładzie wielkość czcionki będzie wynosiła: 26px).

W miejsce "kolor czcionki" należy wpisać kod koloru. Więcej o kolorach znajdziesz w punkcie szóstym tego poradnika. W naszym przykładzie tekst będzie koloru różowego: #FF0080.

Przykład:

HTML:

Ten tekst ma cztery cechy wyglądu

Efekt:

Ten tekst ma cztery cechy wyglądu

Szablony dla początkujących:

W odpowiedzi na dziesiątki pytań o łączeniu stylów, prezentuję poniżej kilka gotowych szablonów, dzięki którym możesz w łatwy sposób formatować swój tekst na stronach serwisu Chomikuj.pl. Wystarczy skopiować któryś z poniższych kodów i we wskazanym miejscu wpisać swój tekst. Jeżeli chcesz, możesz modyfikować kod, zmieniając np. wielkość lub kolor czcionki.

Jeżeli jednak coś wydaje Ci się niezrozumiałe i chcesz zadać mi jakieś pytanie - pisz śmiało TUTAJ.

HTML:

Tutaj wpisz swój tekst

Efekt:

Tutaj wpisz swój tekst

HTML:

Tutaj wpisz swój tekst

Efekt:

Tutaj wpisz swój tekst

HTML:

Tutaj wpisz swój tekst

Efekt:

Tutaj wpisz swój tekst

HTML:

Tutaj wpisz swój tekst

Efekt:

Tutaj wpisz swój tekst

HTML:

Tutaj wpisz swój tekst

Efekt:

Tutaj wpisz swój tekst

HTML:

Tutaj wpisz swój tekst

Efekt:

Tutaj wpisz swój tekst

HTML:

Tutaj wpisz swój tekst

Efekt:

Tutaj wpisz swój tekst

HTML:

Tutaj wpisz swój tekst

Efekt:

Tutaj wpisz swój tekst

Oto, gdzie na portalu Chomikuj.pl, można umieszczać formatowany tekst:

Informacje o Chomiku (Profil)
Opisy plików
Opisy folderów
Komentarze do plików
Chomikowe rozmowy (ShoutBox)

Jeżeli masz jakieś pytanie - napisz do mnie na Chomiku

Do góry

11. Ustawianie tekstu i grafiki

A. Grafika z lewej, tekst z prawej strony

Takie ustawienie elementów na Chomikuj.pl, jest często stosowane w "Opisach plików", kiedy razem z tekstem umieszczamy miniaturkę okładki, np. książki.

Tutaj wpisz swój tekst

W miejsce "adres obrazka" należy wpisać pełny adres internetowy obrazka (w tym przykładzie będzie to: http://chomikuj-wyszukiwarka.eu/graphics/okladka-ksiazki.jpg).

Natomiast w miejsce "krótki opis obrazka" należy wpisać kilka słów opisujących obrazek, które pojawią się u użytkowników z wyłączonym wyświetlaniem grafiki (w tym przykładzie będzie to: Okładka książki).

Przykład:

HTML:

Tekst, Tekst, Tekst...

Efekt:

0x01 graphic

Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst, Tekst.

B. Grafika z prawej, tekst z lewej strony

W ten sposób można ustawiać elementy np. w "Opisach folderów".

Tutaj wpisz swój tekst

W miejsce "adres obrazka" należy wpisać pełny adres internetowy obrazka (w tym przykładzie będzie to: http://chomikuj-wyszukiwarka.eu/graphics/lost.jpg).

Przykład:

HTML:

Tekst, Tekst, Tekst...

Efekt:

0x01 graphic

C. Grafika nad tekstem, całość z lewej strony (domyślnie)

Takie ustawienie na Chomikuj.pl, można stosować w "Opisach plików", kiedy razem z tekstem umieszczamy miniaturkę okładki o dużych wymiarach (np. okładka albumu muzycznego).

Tutaj wpisz swój tekst

W miejsce "adres obrazka" należy wpisać pełny adres internetowy obrazka (w tym przykładzie będzie to: http://chomikuj-wyszukiwarka.eu/graphics/okladka-plyty.jpg).

Przykład:

HTML:

Tekst, Tekst, Tekst...

Efekt:

0x01 graphic

D. Grafika i tekst wyśrodkowane

Wyśrodkowanie tekstu i grafiki na Chomikuj.pl, bardzo dobrze prezentuje się w "Informacjach o Chomiku" oraz w "Opisach folderów".

Tutaj wpisz swój tekst

W miejsce "adres obrazka" należy wpisać pełny adres internetowy obrazka (w tym przykładzie będzie to: http://chomikuj-wyszukiwarka.eu/graphics/yuna-ito.jpg).

Przykład:

HTML:

Tekst, Tekst, Tekst...

Efekt:

0x01 graphic