Skocz do zawartości
  • Przeglądający   0 użytkowników

    Brak zarejestrowanych użytkowników, przeglądających tę stronę.

CzareK

Kolorowe działy i subfora [IPS Community Suite 4]

Promowane odpowiedzi

CzareK    4,501

 

ss1.png

 

ACP -> Wygląd -> Style i szablony -> Edytuj HTML i CSS -> Zakładka CSS -> custom -> custom.css -> Wklej poniższy kod:

[data-forumid="2"] .ipsDataItem_title > a {
  color: #556e53; /* Kolor "A Test Forum" */
}
[data-forumid="2"] .ipsDataItem_subList > li:nth-child(1) a {
   color: #f87d09; /* Kolor "Test 1" */
}
[data-forumid="2"] .ipsDataItem_subList > li:nth-child(3) a {
   color: #a9c52f; /* Kolor "Test 3" */
}
.ipsDataItem_title > a:hover, .ipsDataItem_subList > li > a:hover {
  color: #ad1457 !important;
}

Kliknij przycisk Zapisz.

 

W data-forumid dodajemy ID naszego wybranego działu. W moim przypadku to ID: 2.

Aby dowiedzieć się jaki ID posiada nasz dział, należy najechać myszką na nazwę działu. Numer ID znajduje się w odnośniku.

 

Przykładowy adres:

webmasteruj.pl/forum/2-a-test-forum/

Numer działu znajduje się zaraz po /

li:nth-child(1)

W () podajemy numer subforum, któremu chcemy nadać wybrany kolor.

 

Ważne!

Kolory działają jedynie na stronie głównej.

 

s1.png

  • Lubię to! 3

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach
SeNioR    6,716

Świetnie, szkoda że takich udogodnień nie ma w standardzie, ale instrukcja jest prosta także raczej nikt nie powinien mieć problemów.

  • Lubię to! 1

Udostępnij tego posta


Odnośnik do posta
Udostępnij na innych stronach
Gość
Ten temat został zamknięty. Brak możliwości dodania odpowiedzi.

  • Podobna zawartość

    • Przez CzareK
      W tym poradniku pokażę Wam jak możemy dodać dowolną ikonkę przy wybranym przez nas dziale.
       
      Wchodzimy na oficjalną stronę Font Awesome i wybieramy ikonkę, którą chcemy dodać przy dziale. Ja przykładowo wybrałem fa-html5. Dla nas ważny jest numer, który podany jest przy "Unicode". W moim przypadku to f13b.
       

       
      Przechodzimy do ACP Wygląd Style i szablony Edytuj HTML i CSS Zakładka CSS custom custom.css
       

       

       

       
      Po przejściu do custom.css musimy dodać odpowiedni kod:
      [data-forumid="2"] .fa-comments:before { content: "\f13b"; } W data-forumid musimy podać ID naszego wybranego działu. W moim przypadku to ID: 2. Natomiast w content podajemy numer ikonki, który podany jest na stronie Font Awesome. W moim przypadku to f13b. Na końcu klikamy "Zapisz" i na tym kończymy.
       
      Aby dowiedzieć się jaki ID posiada nasz dział, należy najechać myszką na nazwę działu. Numer ID znajduje się w odnośniku.
       
      Przykładowy adres:
      webmasteruj.pl/forum/2-html-5/ Numer działu znajduje się zaraz po /
       
      Efekt końcowy:
       

       
    • Przez Kirito.
      Aby uzyskać np. taki link adres.pl/zaloguj zamiast adres.pl/index.php?app=core&module=system&controller=login bądź adres.pl/login należy:
       
      Udać się do ACP  zakładka System  kategoria Ustawienia  Zaawansowane
       

       
      Następnie najeżdżamy na link, który chcemy edytować  klikamy ołówek
       

       
      Ostatnim krokiem, który będzie trzeba zrobić to wpisanie przyjaznego linku
       

       
      Klikamy Zapisz i gotowe.
    • Przez CzareK

       
      Instrukcja:
       
      ACP Wygląd Style i szablony Edytuj HTML i CSS W wyszukiwarkę wpisz navBarItems Kliknij w navBarItems
       
      Znajdź:
      <li {{if $item->active()}}class='ipsNavBar_active' data-active{{endif}} id='elNavSecondary_{$item->id}' data-role="navBarItem" data-navApp="{expression="mb_substr( get_class( $item ), 4, mb_strpos( get_class( $item ), '\\', 4 ) - 4 )"}" data-navExt="{expression="mb_substr( get_class( $item ), mb_strrpos( get_class( $item ), '\\' ) + 1 )"}"> Zamień na:
      <li {{if $item->active()}}class='ipsNavBar_active' data-active{{endif}} id='elNavSecondary_{$item->id}' data-role="navBarItem" data-navApp="{expression="mb_substr( get_class( $item ), 4, mb_strpos( get_class( $item ), '\\', 4 ) - 4 )"}" data-navExt="{expression="mb_substr( get_class( $item ), mb_strrpos( get_class( $item ), '\\' ) + 1 )"}" data-FontAwesome="{$item->title()}"> Kliknij przycisk Zapisz.
       
      Następnie wejdź w zakładkę CSS custom custom.css i wklej:
      /* Menu Font Awesome Icons */ .ipsNavBar_primary > ul > li > a::before, .ipsNavBar_secondary > li > a::before { /* Domyślna ikona */ content: "\f0ca"; /* Numer Unicode ze strony Font Awesome Icons */ display: inline-block; font-family: "FontAwesome"; font-size: 14px; font-weight: normal; line-height: 1; margin-bottom: -2px; margin-right: 3px; opacity: 0.6; } /* Przeglądaj */ .ipsNavBar_primary > ul > li[data-FontAwesome="Przeglądaj"] > a::before { content: "\f0ca"; } /* Fora */ .ipsNavBar_secondary > li[data-FontAwesome="Fora"] > a::before { content: "\f086"; } /* Pliki */ .ipsNavBar_secondary > li[data-FontAwesome="Pliki"] > a::before { content: "\f019"; } /* Kalendarz */ .ipsNavBar_secondary > li[data-FontAwesome="Kalendarz"] > a::before { content: "\f073"; } /* Użytkownicy online */ .ipsNavBar_secondary > li[data-FontAwesome="Użytkownicy online"] > a::before { content: "\f0c0"; } /* Załoga */ .ipsNavBar_secondary > li[data-FontAwesome="Załoga"] > a::before { content: "\f132"; } /* Aktywność */ .ipsNavBar_primary > ul > li[data-FontAwesome="Aktywność"] > a::before { content: "\f0ac"; } /* Cała aktywność */ .ipsNavBar_secondary > li[data-FontAwesome="Cała aktywność"] > a::before { content: "\f06e"; } /* Moje kanały aktywności */ .ipsNavBar_secondary > li[data-FontAwesome="Moje kanały aktywności"] > a::before { content: "\f00e"; } /* Nieprzeczytana zawartość */ .ipsNavBar_secondary > li[data-FontAwesome="Nieprzeczytana zawartość"] > a::before { content: "\f111"; } /* Zawartość którą rozpocząłem */ .ipsNavBar_secondary > li[data-FontAwesome="Zawartość którą rozpocząłem"] > a::before { content: "\f005"; } /* Szukaj */ .ipsNavBar_secondary > li[data-FontAwesome="Szukaj"] > a::before { content: "\f002"; } /* Czat */ .ipsNavBar_secondary > li[data-FontAwesome="Czat"] > a::before { content: "\f1d7"; } /* Galeria */ .ipsNavBar_secondary > li[data-FontAwesome="Galeria"] > a::before { content: "\f03e"; } /* Blogi */ .ipsNavBar_secondary > li[data-FontAwesome="Blogi"] > a::before { content: "\f27a"; } Kliknij przycisk Zapisz. Gotowe. Odśwież stronę i sprawdź rezultat.
       

       

    • Przez CzareK
      Przechodzimy do ACP System Pomoc Wsparcie techniczne Zaznaczamy "Coś nie działa poprawnie." Klikamy przycisk Kontynuuj Gotowe.
       

       

    • Przez CzareK

       
      Panel Moderatora Ogłoszenia Dodaj ogłoszenie
       

       

  • Ostatnie tematy

×