Re: Zmiana o kolorów stylu do MyBB
: 23 sty 2013, 22:57:44
ACP -> Style i szablony -> Edytuj styl -> global.css -> Edytuj -> Edycja CSS zaawansowana
ale widzę że kombinujecie więc pewnie będzie przydatne jak naprowadzę was na 'ścieżkę'
gdzie i z czym kombinować.
Teraz proszę o odstawienie mleczka, kawki, gumowej kaczuszki,
czy czegokolwiek co odwracało by uwagę i wysilić się trochę żeby to przeczytać ze zrozumieniem.
Tutorial - CSS dla zielonych :
1. Strona składa się z elementów i większość z nich jest jakoś nazwane...
(zastanów się czy rozumiesz to zdanie, bo wymagam abyś się na chwilę obudził
i zaczął czytać ze zrozumieniem. jeśli nie rozumiesz - wróć i przeczytaj jeszcze raz.)
2. Elementy mogą znajdować się jeden w drugim.
(tak jak np w elemencie 'dom' znajduje się element 'lodówka' a w lodówce... element 'piwo')
Tak samo na stronie, jest element 'body' (czyli cała strona) w nim jest np. 'header'
(czyli to na górze gdzie jest obrazek logo) a nim 'logo'.
(Niezrozumiale się to nazywa ? Jakieś body, header itd ?...
To tylko nazwa - przecież wiadomo co to 'tło strony' czy 'obrazek' na niej,
nawet gdyby nazywało się 'polichlorek wypocmokaczu z potrójną siłą spłukiwania')
3. Skoro wiemy że są 'elementy' i o co z nimi chodzi,
(nie wiemy ? mówiłem odstawić kaczuszkę - czytać jeszcze raz.)
to pora na atrybuty czyli coś co określa 'jakie dany element ma cechy'.
Robimy to poprzez podanie nazwy tego elementu, (żeby było wiadomo o czym mówimy)
a po nazwie nawiasu {} wewnątrz którego wpisujemy 'jakie to coś jest'
Dla przykładu :
Kod: Zaznacz cały
lodówka {
kolor: biała;
wielkość: duża;
}
piwo {
temperatura: zimne;
kolor: złocisty;
smak: mniamuśne;
}
Jedyne czego nie wiecie a potrzebujecie wiedzieć to
- 'jak nazywa się dany element na stronie' (żeby można go było na celownik wziąć) oraz
- 'co właściwie można wpisać aby było zrozumiane przez komputer' (np jak wpisać że ma kolor biały).
Nie trzeba się tego uczyć ani kuć. Od tego są narzędzia i dokumentacja.
Pewnie zastanawiacie się skąd wziąć dokumentację (nie, nie sprzedam wam za pół ceny)
Na razie powiem tylko że dokumentację już macie tylko jeszcze tego nie wiecie. O tym za chwilę.
Ostatecznie, po setnym zajrzeniu do dokumentacji w poszukiwaniu jak wpisać kolor,
i tak będzie wam się to śniło po nocach bez kucia.
(Innymi słowy zapamiętacie 'co ważne' a to co 'przydatne' może czekać w dokumentacji,
na moment kiedy stanie się wystarczająco ważne).
Narzędzia - Jeśli macie Firefoxa, instalujecie wtyczkę 'Firebug'.
Wtyczka ta została zrobiona dla ślepych z problemami postrzegania,
(chociaż jej autor uważa dokładnie odwrotnie) aby bez trudu mogli odnalezć i podejrzeć
każdy obiekt na ekranie przez wskazanie go myszką.
Dzięki temu nawet osoba nie mająca pojęcia o programowaniu może zarządzić
i zamienić się przed znajomymi w Neo, demonstrując 'jak się zmienia stronę w przeglądarce jednym palcem'
za pomocą samego nosa a nawet telepatycznie (myszką pod stołem).
Można tam podejrzeć, jaki kolor ma wskazany obiekt na ekranie, rozmiar, inne atrybuty,
jak się nazywa oraz czy znajduje się wewnątrz innego elementu i jakiego.
Polecam pobawić się tym, poklikać na elementy i pooglądać to sobie aby obrazowo
zrozumieć jak to jest skonstruowane (można nawet zmieniać te atrybuty i widzieć zmiany na ekranie)
Po tej zabawie pewnie zrodzi wam się pytanie : "fajnie, wiem jak zmienić kolor ale jak to zapisać ?"
- Nie można. Przy pomocy firebuga można tylko "podejrzeć", "zmieniać"
"widzieć te zmiany w czasie rzeczywistym na ekranie" a nawet wiedzieć w którym pliku dane te się znajdują.
Do zapisania zmian użyjemy notatnika aby zachować nasze dzieło sztuki dla potomności,
i pokazywać je z dumą (albo i nie) swoim wnukom.
Musi to być specjalny notatnik, np notepad++
Nie może być notatnik z windows bo zepsujecie plik i strona wam całkiem padnie.
Leniwym radzę nie lekceważyć tego ostrzeżenia, bo zamiast zaoszczędzić czas,
i przeznaczyć go na zabawę twórczą, stracicie go na mozolnym naprawianiu zniszczeń,
spowodowanych zapisaniem pliku za pomocą zwykłego notatnika z windows.
Aby zaoszczędzić wam cierpień w dochodzeniu który wskazywany plik jest tym właściwym,
W MyBB jest to plik cache/themes/themeX/global.css
Jeśli macie więcej szablonów to będziecie mieli po jednym takim pliku dla każdego szablonu.
(np. theme1, theme2, theme3, theme4 itd)
Po zabawie z firebugiem będziecie wstępnie wiedzieli 'jak coś zmienić' ale skąd wiedzieć jak coś dopisać,
bo np element nie ma wpisanego koloru ?
Od tego jest Google które prowadzi do dokumentacji i całej wiedzy ludzkości podanej na talerzu.
Trzeba tylko wiedzieć 'CO' chce się wiedzieć.
Co chcielibyśmy wiedzieć w naszym przykładzie ? - np. jak zapisać kolor elementu w CSS.
Wpisujemy w google 'CSS kolor elementu', albo "CSS kolor tła" i nie trzeba nawet męczyć oczu
aby wyłuskać z tekstu przykłady jak to zapisać.
Tyczy się to wszystkich innych cech elementów w CSS.
Mam nadzieję że po przeczytaniu tego tutoriala,
wiecie nie tylko wszystko to, co jest potrzebne do rozwiązania problemu : 'jak zmienić kolor tekstu',
ale również odpowiedzieliście sobie na wiele innych pytań takich jak : 'jak się zabrać do CSS',
'czy żyrafy odlatują do ciepłych krajów' oraz na odwieczne pytanie filozofów 'dlaczego woda jest mokra'
