MrHaim Опубликовано 9 апреля, 2023 Поделиться Опубликовано 9 апреля, 2023 Hello. Today I will describe a short guide on how to add Font Awesome icons to the user's flyout menu in Invision Community (IPS Community Suite). I think the effect is so satisfactory that everyone should add these icons to the menu. In my opinion, the user menu looks much clearer. The version of the script on which I added the icons is IPS 4.2. I will only note that in newer versions the code may not work 100% correctly, or not work at all due to changes in the code that may appear in upcoming releases. If the code does not work on your version of the software, let me know in the topic and I will try to improve it. Font Awesome in the user menu To add icons to the menu, go to ACP → Appearance → Styles and Templates → Edit HTML and CSS → CSS tab → custom → custom.css. Now paste the following CSS code into the file: /* Panel użytkownika */ #elUserLink_menu a:before { font-family: "FontAwesome"; font-size: 14px; font-weight: normal; display: inline-block; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; line-height: 1; } #elUserLink_menu a[href*="admin"] i { display: none; } #elUserLink_menu a:before { display: inline-block; width: 20px; opacity: 0.7; } #elUserLink_menu a:hover:before { opacity: 1; } /* Profil */ #elUserLink_menu > li[data-menuItem='profile'] > a:before { content: "\f007"; } /* Moje załączniki */ #elUserLink_menu > li[data-menuItem='attachments'] > a:before { content: "\f0c6"; } /* Obserwowana zawartość */ #elUserLink_menu > li[data-menuItem='manageFollowed'] > a:before { content: "\f06e"; } /* Ustawienia konta */ #elUserLink_menu > li[data-menuItem='settings'] > a:before { content: "\f013"; } /* Ignorowani użytkownicy */ #elUserLink_menu > li[data-menuItem='ignoredUsers'] > a:before { content: "\f235"; } /* Panel Moderatora */ #elUserLink_menu > li[data-menuItem='modcp'] > a:before { content: "\f132"; } /* Panel Admina */ #elUserLink_menu > li[data-menuItem='admincp'] > a:before { content: "\f023"; margin-right: -3px; } /* Wyloguj */ #elUserLink_menu > li[data-menuItem='signout'] > a:before { content: "\f08b"; } Don't forget to save your changes by clicking the "Save" button. Below I add the effect of what the user menu looks like with Font Awesome icons already added Credit to CzareK PiratRu и Zero108 1 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Рекомендуемые сообщения
Присоединяйтесь к обсуждению
Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.
Примечание: Ваш пост будет проверен модератором, прежде чем станет видимым.