PDA

Zobacz pełną wersję : Przyrostek klas CSS modułu



Jarver
15-06-2018, 15:03
Hej, mam pytanie jak to działa ten przyrostek klas CSS modułu, bo jak rozumiem pozwala on tworzyć unikalny styl dla jakiegoś dodanego modułu. Tylko jak ma to zrobić w konsoli widzę to: <div class="ja-module modulebox1" id="mod136">
podejrzewam, że to ja-module to klasa domyślna ja swoją nazwałem box1 tutaj jest napisane modulebox1 no i gdzie ja mogę to klasę wystlizować gdy to jest np. moduł własny html? W szablonie template.css? Tworzac .modulebox{xx;}?
A co z opcją że tworze włąsny plik do którego wrzucam te własne moduły, skąd joomla ma wiedzieć że to właśnie w pliku user.css jest zdefiniowana klasa szablonu, czy to dobra praktyka aby na wypadek aktualizacji, no żeby po aktualizacji mi nie nadpisało danych umieszczonych w template.css, czy ich nie nadpisze? No i w sumie ostatnie pytanie w tej kwestii jak to jest z tymi szablonami? Chodzi o to, czy zależnie od szablonu w innym pliku będę umieszczał mój moduł?
Dzięki piękne za wszelaką pomoc!

siristru
15-06-2018, 15:40
Bo musisz wprowadzić swój przyrostek ze spacją czyli nie "box1" ale " box1". Inaczej przylepi do pierwotnej klasy "module".
Dużo zależy jak masz zbudowany szablon. Jeśli to jakiś klubowy to bardzo prawdopodobne, że możesz dodawać własne klasy do pliku custom.css.
Ewentualnie sprawdź dokumentację szablonu lub zapytaj developera.

W innym przypadku - kiedy np. sam zrobiłeś szablon - dodaj do pliku jaki ci pasuje.

Skąd przeglądarka czy Joomla "wie" gdzie jest zdefiniowana klasa? LOL, przecież to przeglądarka ładuje pliki css, czyta je i znajduje klasy a następnie stosuje style :)

Staraj się nie tworzyć własnych plików css z odrębnymi stylami. Raczej używaj ich jak najmniej by strona wysyłała jak najmniej żądań.

Jak stylizować taki moduł? Zakładam, że poprawisz przyrostek zgodnie z tym co napisałem, wiec uzyskasz ciąg klas; <div class="ja-module module box1" id="mod136">

Zatem możesz stylizować wszystkie moduły z klasą "box1" tak:

.ja-module.module.box1 {}

lub

.module.box1 {}

Jeśli chcesz indywidualnie tylko jeden moduł to albo nadasz mu unikatowa klasę albo:

#mod136.module.box1 {}

Jarver
15-06-2018, 15:57
Ok :D dzięki bardzo, bardzo! Super że to tak rozpisałeś bardzo doceniam. Mam plik css: "custom-style.tpl.css" więc pewnie tam, przetestuje to za parę godzin jak będę miał sprzęt :) Co do szablonu zrobienie własnego szablonu jestem za słaby więc to z neta "ja_simpli" jak by co, no i temat CMSów to dla mnie nowość dopiero 2tyg się nimi zajmuje i ich uczę.

"LOL, przecież to przeglądarka ładuje pliki css, czyta je i znajduje klasy a następnie stosuje style " No tak ale chodziło mi o to czy dany arkusz stylów css w którym akurat jest zdefiniowana klasa podpina znacznikiem link ten konkretny arkusz w którym jest ta klasa :P

No to tyle, jesteś wielki sirstru :) jak by coś nie działało albo zrodziły się nowe pytania to będę pytał.

rkonik
15-06-2018, 16:30
"LOL, przecież to przeglądarka ładuje pliki css, czyta je i znajduje klasy a następnie stosuje style " No tak ale chodziło mi o to czy dany arkusz stylów css w którym akurat jest zdefiniowana klasa podpina znacznikiem link ten konkretny arkusz w którym jest ta klasa
Jest tak jak napisał @siristru
Ja domyślam się że chcesz wiedzieć jak to się dzieje od strony CMS-a. Otóż to jakie arkusze są wykorzystywane decyduje autor szablonu. On decyduje jakie arkusze mają być wykorzystane. Często autorzy dają możliwość dopisania własnego stylu w konfiguracji szablonu. Jednak to nie jest regułą ponieważ takie elementy CMS-a Joomla jak moduł czy komponent może mieć również zdefiniowane własne arkusze i mogą być użyte w stronie. Dlatego moim zdaniem Joomla jest jednym z ciekawszych rozwiązań w świecie CMS ponieważ dale ogrom możliwości Autorom podczas tworzenia jakiegokolwiek dodatku do tego systemu.

siristru
15-06-2018, 16:30
No tak ale chodziło mi o to czy dany arkusz stylów css w którym akurat jest zdefiniowana klasa podpina znacznikiem link ten konkretny arkusz w którym jest ta klasa

Ojoj, przeczytaj jak działają style kaskadowe :)
Arkusz stylów to plik css. W nim jest zdefiniowana klasa.
Więc nie ma potrzeby by coś "podpinało znacznikiem link".
Arkusz jest ładowany w szablonie wraz z wejściem na stronę. Przeglądarka czyta listę stylów, zdefiniowane własności oraz ich wartości a następnie je stosuje. Wszystko w mgnieniu oka :)

Czyli wystarczy, że w jakimkolwiek pliku CSS znajdzie daną klasę to spróbuje zastosować jej style do danego obiektu.