Instrukcja:
ACP -> Wygląd -> Style i szablony -> Edytuj HTML i CSS -> W wyszukiwarkę wpisz navBarItems -> Kliknij w navBarItems
Znajdź:
<li {{if $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.