Nawigacja
HOW TO: THEME
Napisane przez sonar
dnia 17 czerwca 2007 20:38 ·
5 komentarzy ·
19163 czytań ·
· 
· 
Streszczenie:
Zagadnienie tworzenia themów do php-fusion jest dla Ciebie czarną magią? Po przeczytaniu tego artykułu powinno się to zmienić.Witam!
Złapałem dziś trochę czasu, więc postanowiłem napisać jak się robi themy do PHP-Fusion v6.0x.x .
Na samym początku chciałbym zaznaczyć, że do "robienia" themów potrzebna jest znajomość conajmniej HTML'a (mile widziana wiedza na temat CSS).
No to przejdźmy do pracy...
Ściągamy przykładowego thema (który oczywiście jest zrobiony specjalnie na potrzeby tego artykułu), który spełnia wymagania HTML'a 4.01
DOWNLOAD
Po ściągnięciu (plik ma tylko 9 KB) zobaczycie, że theme nie zawiera zbyt dużo obrazków - zrobiłem to celowo, po pierwsze po to, żeby Wam zbytnio nie mieszać podczas tłumaczenia jak to wszystko działa, a po drugie w celu ukazania, które pliki muszą być w themie.
A teraz... Do roboty!
Otwieramy plik style.css (239 linijek :: 3663 znaków) w dowolnym edytorze tekstowym.
Jeśli widzimy coś czego nigdy wcześniej nie widzieliśmy i nie wiemy jak to w ogóle działa i co do czego służy, to przeczytać warto objaśnienia zawarte poniżej.
(...)
}
- definiujemy wygląd ogólny całego thema (czcionka domyślna, jej rozmiar, margines itp)
(...)
}
a:hover {
(...)
}
a.side {
(...)
}
a:hover.side {
(...)
}
a.white {
(...)
}
a:hover.white {
(...)
}
- od tego wpisu zależy jaki będzie kolor poszczególnych linków
(...)
}
hr.side-hr {
(...)
}
- ustawiamy kolory "linii" na stronie wywyływanych przez < i >
(...)
}
- zmieniamy kolor, tło, czcionka, itp. przycisków na stronie
(...)
}
- modyfikujemy wygląd pola tekstowego
(...)
}
.side-border-left {
(...)
}
.side-border-right {
(...)
}
- w tym miejscu możemy zmieniać odstęp (w pikselach) od góry, od dołu, od lewej i od prawej
(...)
}
.tbl {
(...)
}
.tbl1 {
(...)
}
.tbl2 {
(...)
}
- definiujemy kolor poszczególnych tabelek np. na forum
(...)
}
- modyfikujemy wygląd cytatów
(...)
}
- część, która odpowiedzialna jest za ankietę (jej obramowanie itd)
(...)
}
- zmieniamy kolor nicka osoby komentującej
(...)
}
.shoutbox {
(...)
}
.shoutboxdate {
(...)
}
- ustalamy kolor nicka, czcionki, i daty w shoutboxie
(...)
}
.small2 {
(...)
}
- wygląd small i small2
(...)
}
.gallery img {
(...)
}
.gallery:hover img {
(...)
}
img.activegallery {
(...)
}
- definiujemy kolor obramowania, odstępy w galerii
No to tyle jeśli chodzi o część style.css, która musi być zawsze. Dalej w style.css znajdziemy kilka podobnych do powyższych "cudów". W pliku odzieliłem je czyś takim:
* * * * * * * * * * * * * * * * * * * * * * * * * * * *
\*****************************************************/
Rzuca się w oczy, dzięki czemu widać co jest "inne".
To temat styli uważam za (narazie) zamknięty.
Komentarze
Dodaj komentarz
Oceny
Zaloguj się lub zarejestruj, żeby móc zagłosować.
| Świetne! |  |
22% | [2 głosy] |
| Bardzo dobre | |
56% | [5 głosów] |
| Dobre | |
11% | [1 głos] |
| Średnie | |
11% | [1 głos] |
| Słabe | |
0% | [0 głosów] |