Unikalna klas dla każdego z elementów listy

[radek.k]

Witam wszystkich, mam pewien problem, który chciałbym rozwiązać z poziomu PA JOOMLA i nie wiem czy jest to możliwe. Otóż mam następującą sytuacje:

<ul class="categories-module">
<li class="active">
1
</li>
<li>
2
</li>
<li>
3
</li>
<li>
4
</li>
</ul>

Chciałbym nadać dla każdego elementu <li> unikalną klasę np.: .item-***. Dla menu i sub-menu JOOMLA automatycznie nadała klasę każdemu z elementów listy. Jak sobie z tym zaradzić w tym przypadku. Z góry dziękuje za pomoc.

[zwiastun]

A do czego Ci to ma posłużyć?
Z poziomu PA przełączasz edytor w tryb HTML i wpisujesz co chcesz. Możesz też podpiąć arkusz stylów do edytora i przypisywać klasy wybierając je z listy rozwijalnej w edytorze.

[radek.k]

Dokładnie chodzi o nadanie unikalnej klasy dla każdego z elementów <li>? modułu wyświetlającego kategorię artykułów. Czy oby napewno jest to wykonalne w ten sposób?

[zwiastun]

W ten sposób, niestety, wykonalne nie jest. Trzeba by modyfikować kod modułu.

[radek.k]

Tak myślałem. Czy dokonując modyfikacji na narażę się na komplikacje od strony funkcjonowania ogółu JOOMLA ?

[zwiastun]

Skorzystaj z techniki nadpisywania szablonem albo alternatywnego szablonu

[Dziudek]

Ewentualnie jeżeli chodzi tutaj o kwestie stylowania i zawartość samej listy nie zmienia się zbyt często, można wykorzystać CSS3 i selektor nth-child():



.categories-module li:nth-child(3) {} /* wyselekcjonuje trzeci element */

.categories-module li:nth-child(5) {} /* wyselekcjonuje piąty element */

.categories-module li:nth-child(even) {} /* wyselekcjonuje parzyste elementy */

.categories-module li:nth-child(2+3n) {} /* wyselekcjonuje drugi element i potem co trzeci element */

[pawelSafiStudio]

Jeśli natomiast nie chcesz korzystać z CSS3 to jeszcze możesz w szablonie, w sekcji head zrobić to JS'em:


<scirpt type="text/javascript">
window.addEvent('domready',function(){
var c_list = $$('.categories-module li');
c_list.each(function(element,item){
element.addClass('list_item'+item);
});
});
</script>

[radek.k]

Generalnie jeżeli chodzi o modyfikacje z poziomu szablonu to chciałem to zrobić poprzez JS (tak jak napisał Pan Paweł) i tak chyba też zrobię. Serdecznie dziękuje za pomoc. Super forum :)

[pawelSafiStudio]

Nie no tylko nie Pan. Po prostu Paweł :)

[Dziudek]

@radek.k - taka mała uwaga na przyszłość - jeżeli możesz coś zrobić w CSS to lepiej jest to zrobić z użyciem CSS niż JS, ponieważ zwyczajnie jest to wydajniejsza metoda oraz dodatkowo nie ma żadnego opóźnienia w wykonywaniu - efekt dostępny jest od razu a na wykonanie JS, nawet w wypadku zdarzenia DOMContentLoaded trzeba chwilę poczekać. A jeżeli chodzi o selektory CSS3 na starszych przeglądarkach (czyli głównie IE) to istnieje łatwe rozwiązanie tego problemu: http://selectivizr.com/

[pawelSafiStudio]

@Dziudek zgodzę się z Tobą ale nie do końca. Jeśli wykorzystujemy tego typu selektory często to ok, ale jak mamy tylko w jednym miejscu to nie ma sensu ładować biblioteki do ich obsługi. To też trwa :) Ale fakt. Jak możemy CSS'em to robimy CSS'em.
Ja osobiście staram się nie nadużywać JS'a. Ale jeśli klient życzy sobie IE to niestety jeśli mam wybór dodatkowej biblioteki a kilka linijek własnego JS'a to biorę własnego JS'a.

[Dziudek]

@pawelSafiStudio - Selectivizr jest potrzebny tylko na IE8 (IE7 jak ktoś bardzo pragnie, choć w obecnej chwili to dziwna zachcianka) więc można go wczytywać tylko na nim poprzez komentarze warunkowe, poza tym taki kod jest bardziej przyszłościowy - IE8 odejdzie za jakiś czasu do lamusa i w ogóle nie będzie problemu z selektorami CSS3, a tak - za jakiś czas trzeba będzie kod odświeżyć żeby pasował do nowoczesnych standardów i był bardziej optymalny. Zresztą z użyciem nowych selektorów można usprawnić tak wiele rzeczy w kodzie, że z reguły okazuje się iż to nie jest jedyne wykorzystanie CSS3 ;) Osobiście wyznaję zasadę, że jeżeli ktoś używa przestarzałej przeglądarki to niech cierpi i pobiera wszystkie potrzebne uzupełnienia jej braków w postaci skryptów JS - ja dzięki temu mogę stosować nowoczesne standardy i nie muszę się martwić, że za rok będę musiał wszystko przepisywać bo jakaś stara przeglądarka pod którą tworzyłem kod przestała być używana i można zastosować bardziej normalne rozwiązania problemów.

[pawelSafiStudio]

@Dziudek masz rację :) Niemniej jednak w prostych stronach oraz gdy klient się uprze to korzystam z JS'a. Głównie ze względu na lekkość kodu. Jeśli mam wolną rękę to jasne, że idę z tym co daje nam obecnie technologia.