Przyrostek klas modułu CSS

[Grzegorz_n]

Witam :)

Mam problem z którym nie potrafię sobie poradzić, dlatego tez postanowiłem poprosić o pomoc Was - Drodzy Koledzy. Oczywiście czytałem poradniki dot. tej kwestii, takie jak:
https://www.scribd.com/doc/2300098/Joomla-v-1-5-How-to-use-CSS-class-suffixes
http://wiki.joomla.pl/Stosowanie_przyrostk%C3%B3w_klas_w_Joomla!_1.5
http://wiki.joomla.pl/Stosowanie_przyrostk%C3%B3w_klas_CSS
ale wszystko wskazuje na to, że robie cos nie tak lub po prostu jestem tępy. Robie to pierwszy raz w swoim życiu i przyznaję sie do tego, że nie do końca rozumiem to, co jest przedstawione w powyższych linkach.

Mam na jednej stronie 5 modułów "własny kod html". Chciałbym dla tych 5-ciu modułów ustawić wspólne parametry sposobu wyświetlania tekstu który jest w obrębie znacznika DIV.

Co zrobiłem:
1. W 5 modułach ustawiłem: Moduł > Opcje rozszerzone > Przyrostek klas modułu CSS > wpisałem _style1
2. W mojadomena.pl/templates/protostar/css/template.scc na samym końcu pliku wpisałem:
div.module_style1 {
font-size: 16px;
color: #000000;
border: 1px solid #ddd;
}

Rozumiem, że teraz w każdym z 5-ciu modułów i wszędzie tam, gdzie tekst znajduje się w znacznikach DIV, uzyskać wygląd zdefiniowany powyżej. Niestety, ale tak się nie dzieje. Cały czas ładuje się standardowy tekst zdefiniowany przez template.css.

Rozumiem też, że jeżeli będzie to:
table.module_style1 {
font-size: 16px;
color: #000000;
border: 1px solid #ddd;
}
to wówczas zdefiniowane parametry będą dotyczyły tego, co znajduje się w tabeli?

Czy mogę prosić o wytłumaczenie mi tego lub naprowadzenie na właściwy tok rozumowania?

Z góry serdecznie dziękuje i pozdrawiam :)
Grzegorz

[noras]

Możesz podać linka do strony?

[Grzegorz_n]

Podaję w prywatnej wiadomości, gdyż strona jest w trakcie tworzenia.

[noras]

Nie wczytuje Ci się w ogóle kod CSS który podałeś w poście wyżej, musisz gdzieś źle je wstawiać.


Wstaw te style albo do pliku template.css w twoim szablonie albo poszukaj (powinien być) taki plik jak overide.css i tam wrzuć swój styl, overide ma za zadanie nadpisywać style szablonu.

Jeśli nie ma to go stwórz, i w szablonie w sekcji head (najlepiej przed samym jej zamknięciem) dodaj:

JHtml::_('stylesheet', JUri::root() . 'templates/' . $this->template . '/css/overide.css');

[zwiastun]

Jeśli kod się nie wczytuje, to może znaczyć, że w arkuszu stylów masz jakiś błąd

[noras]

@zwiastun - Oczywiście ma rację.

Sprawdziłem Twój plik template.css nazwa klasy masz div.module_style1 a powinno być div. custom_style1 i będzie działać jak powinno.

Niepotrzebnie kazałem Ci tworzyć overide, przepraszam. Zmień powyższe i będzie śmigać aż miło :) Dzięki @zwiastun.

[Grzegorz_n]

Wstaw te style albo do pliku template.cssStyle były wstawione do pliku template.css.


albo poszukaj (powinien być) taki plik jak overide.css i tam wrzuć swój stylNi ebyło w szablonie protostar tego pliku. Stworzyłem, wstawiłem style, a plik umiesciłem w templates/protostar/css/overide.css


JHtml::_('stylesheet', JUri::root() . 'templates/' . $this->template . '/css/overide.css');Dodałem w sekcji head (przed samym zamkniecim) powyższą linijkę kodu w pliku index.php szablonu protostar.
Efekt jest taki, że na samej górze strony wyrzuca mi zawartość całego kodu. Proszę, Sam zobacz.

[noras]

Nie w tym miejscu wstawiłeś, nie pamiętam struktury Twojego szablonu ale na 99% nie jest to plik index.php :)

Powyżej dodałem jest post który wyjaśni wszystko.

Usuń zmiany w pliku index.php i dokonaj zmian w pliku templates.css będzie działać.

[Grzegorz_n]

Usuń zmiany w pliku index.php i dokonaj zmian w pliku templates.css będzie działać. O kurcze, działa! No szacun dla Ciebie i dla Zwistun. Bardzo dziękuję :)

Mam jeszcze pytanko jedno.
Teraz style odnoszą się do każdego znacznika div. Co zrobić, jeżeli bedę chciał w tym samym module "własny kod html" zmienić style tylko wybranym znacznikom div?

[noras]

W danym module po spacji możesz dodać kolejną klasę, koniecznie oddziel spacją aby się nie zlały, powinno działać bez problemu. Wtedy w template.css możesz wywołać div.custom_style1.nowa_klasa lub po prostu div.nowa_klasa.

[Grzegorz_n]

Rozumiem, ale to przetestuję później.

Jeszcze raz bardzo dziekuję :)

Pozdrawiam :)
Grzegorz

[Grzegorz_n]

Witam ponownie :)




Teraz style odnoszą się do każdego znacznika div. Co zrobić, jeżeli bedę chciał w tym samym module "własny kod html" zmienić style tylko wybranym znacznikom div?



W danym module po spacji możesz dodać kolejną klasę, koniecznie oddziel spacją aby się nie zlały, powinno działać bez problemu. Wtedy w template.css możesz wywołać div.custom_style1.nowa_klasa lub po prostu div.nowa_klasa.


Dzięki pomocy życzliwego użytkownika noras, zacytowany powyżej problem, jak i ten będący tematem przewodnim, rozwiązałem w nieco inny sposób. Ponieważ noras pomagał mi w korespondencji prywatnej, rozwiązanie przedstawiam poniżej.

Ostatecznie do indywidualnego "ostylowania" tekstu w module: "Własny kod html", zrezygnowałem z definiowania przyrostka klas CSS modułu w opcjach rozszerzonych i zastąpiłem innym rozwiązaniem.

Dla każdego znacznika div przypisałem osobną klasę:


<div class="tittle_mod">........</div>
<div class="img_mod">........</div>
<div class="text_mod">........</div>
<div class="foot_mod">........</div>


natomiast same style, zdefiniowałem na samym końcu pliku /templates/nazwaszablonu/css/template.css:



.tittle_mod {
font-weight: bold;
border-width: 1px;
border-style: solid;
}

.img_mod {
text-align: center;
border: 1px solid #cccccc;
vertical-align: top;
}

.text_mod {
text-align: left;
font-size: 8pt;
line-height: 9pt;
}

.foot_mod {
border-width: 1px;
border-style: solid;
border-color: #ccc;
}



Jeszcze raz bardzo dziękuję użytkownikowi noras za okazaną pomoc i cierpliwość :)