Важная информация!
Правила форума
для обязательного прочтения!
Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
(забыл / потерял пароль)
Общий FAQ по управлению форумом
FAQ: реклама на форуме
Туториалы по разным функциям ваших форумов
Алфавитный указатель
Интересные решения для форумов
Наши видео-туториалы
Условия пользования сервисом
Ссылки на полезные ресурсы
Последние темы
» ВПНавтор Danny_Marcelo Сегодня в 07:47
» Пропала вкладка "Обработка пользователей"
автор Svet007 Вчера в 07:39
» Как найти администратора?
автор PushPayer Ноябрь 21st 2024, 00:58
» Не корректное отображение картинок
автор VENEFICA. Ноябрь 15th 2024, 14:46
» Не меняется название форума
автор Aviator Ноябрь 14th 2024, 15:40
» Дублируется ссылка на форум в боковом меню
автор Чистый сталкер Октябрь 26th 2024, 21:13
» совет админам
автор лексей2222 Октябрь 23rd 2024, 05:45
» Проблема с гугл из-за Hitskin
автор Вултур Октябрь 21st 2024, 15:43
» [решено]Редактирвоание темы
автор AlexDarkTech Октябрь 13th 2024, 08:14
» Пропали иконки редактирования - HEEELP
автор Archaea Сентябрь 23rd 2024, 18:11
Настройки CSS для Тулбара
Участников: 2
Страница 1 из 1
Настройки CSS для Тулбара
Настройки CSS для Тулбара.
Нижеуказанные коды добавляются в Па > Оформление > Цвета > Каскадная таблица стилей CSS.
Фоновый цвет для Тулбара:
- Код:
#fa_toolbar, #fa_toolbar_hidden {
background-color: #fff !important;
}
Фоновое изображение для Тулбара:
- Код:
#fa_toolbar, #fa_toolbar_hidden {
background-image: url('http://i73.servimg.com/u/f73/15/82/36/69/chbpol10.gif');
}
Убрать строку поиска:
- Код:
#fa_search {
display: none !important;
}
Убрать блок "Поделиться":
- Код:
#fa_share {
display: none !important;
}
Подсвечивание кол-ва уведомлений:
- Код:
#fa_notifications.unread #notif_unread {
color: #FA0E21;
margin-left: 5px;
font-weight: bold;
}
Изменить подсвечивание заголовков профиля и уведомлений
- Код:
#fa_toolbar > #fa_right.notification > #fa_notifications, #fa_right.welcome #fa_menu #fa_welcome {
background-color: #398AC6 !important;
color: #fff !important;
}
color — цвет текста, замените код цвета #fff на желаемый
Выпадающие панели профиля и уведомлений : сделать с закругленными уголками и тенью
- Код:
/* настройки панелей */
#fa_menulist, #notif_list {
margin-top: 5px !important;
border-color: transparent !important;
border-radius: 6px !important;
-moz-border-radius: 6px !important;
-webkit-border-radius: 6px !important;
-moz-box-shadow: -1px 3px 5px #000;
-webkit-box-shadow: -1px 3px 5px #000;
box-shadow: -1px 3px 5px #000;
background-color: #fff;
}
/* ссылка Посмотреть все уведомления */
.see_all, .see_all a {
color: #000 !important;
background-color: transparent !important;
}
box-shadow — тень панелей, код цвета #000 замените по желанию
border-radius — закругленные уголки, значение 6px измените по желанию
border — контур панели
Готовый вариант: Минимизированный Тулбар:
В ПА > Модули > Тулбар укажите Зафиксировать тулбар : Да
В CSS добавьте следующий код:
- Код:
/* отступ сверху */
body {
margin-top: 40px;
}
/* прозрачный фон тулбара */
#fa_toolbar, #fa_toolbar_hidden {
background-color: transparent !important;
}
/* убрать поиск */
#fa_search {
display: none !important;
}
/* убрать блок Поделиться */
#fa_share {
display: none !important;
}
/* левый закругленный угол */
#fa_left {
-webkit-border-bottom-right-radius: 6px;
-moz-border-radius-bottomright: 6px;
border-bottom-right-radius: 6px;
-moz-box-shadow: -1px 1px 5px #000000;
-webkit-box-shadow: -1px 1px 5px #000000;
box-shadow: -1px 1px 5px #000000;
padding-right: 10px;
}
/* правый закругленный угол */
#fa_right {
-webkit-border-bottom-left-radius: 6px;
-moz-border-radius-bottomleft: 6px;
border-bottom-left-radius: 6px;
-moz-box-shadow: 1px 1px 5px #000000;
-webkit-box-shadow: 1px 1px 5px #000000;
box-shadow: 1px 1px 5px #000000;
padding-left: 10px;
}
/* выпадающие панели профиля и уведомлений */
#fa_menulist, #notif_list {
font-size: 12px !important;
margin-top: 3px !important;
border-color: transparent !important;
border-radius: 6px !important;
-moz-border-radius: 4px !important;
-webkit-border-radius: 4px !important;
-moz-box-shadow: -1px 3px 5px #000000;
-webkit-box-shadow: -1px 3px 5px #000000;
box-shadow: -1px 3px 5px #000000;
background-color: #F2F6FA !important;
text-decoration: none !important;
}
/* полупрозрачные части тулбара */
#fa_left, #fa_right {
background: transparent url(http://i75.servimg.com/u/f75/16/54/26/99/vkwv10.png) repeat !important;
}
#fa_left a, #fa_right a {
text-decoration: none !important;
}
li.see_all, li.see_all a {
background-color: transparent !important;
color: #666666 !important;
}
#fa_left, #fa_notifications, #fa_welcome {
text-shadow: 1px 1px 1px #666666 !important;
}
/* ссылки всплывающих панелей */
#fa_menulist a, #fa_menulist a:link, #fa_menulist a:visited, #notif_list a {
color: #666666 !important;
text-decoration: none !important;
}
/* ссылки всплывающих панелей при наведении */
#fa_menulist a:hover {
color: #BE0B12 !important;
}
/* подсвечивание заголовков профиля и уведомлений */
#fa_toolbar > #fa_right.notification > #fa_notifications, #fa_right.welcome #fa_menu #fa_welcome {
background-color: #828F99 !important;
color: white !important;
}
/* подсвечивание новых уведомлений */
#fa_notifications.unread #notif_unread {
color: #FA0E21;
margin-left: 5px;
font-weight: bold;
}
Важная информация:
Удаление копирайтов Forum2x2, размещенных на Тулбаре — а именно иконки и ссылки — категорически запрещено Условиями пользования сервисом.
В настоящее время сервис работает над возможными решениями для тех, кто хотел бы иметь альтернативную возможность отключить эти ссылки.
Где находится CSS? Па > Оформление > Цвета > Каскадная таблица стилей CSS Где искать основные шаблоны? ПА > Оформление > Шаблоны > Общие настройки Где находится раздел для подключения скриптов ПА > Модули > Управление кодами Javascript |
Danny_Marcelo поставил(а) лайк
Оформление тулбара сервиса 2х2
Оформление тулбара
Ставить в CSS
фоновые картинки и цвета меняйте на свои
P.S. Если у вас на форуме фиксированное меню навигации вверху форума то вам необходимо ещё добавить эти коды.
Ставить в CSS
- Код:
/*основное поле тулбара*/
#fa_toolbar {
background-image:url(http://r28.imgfast.net/users/2814/33/31/58/album/10442210.jpg)!important; /*фон*/
border-bottom:ridge 2px #B38000!important; /*рамка низа тулбара*/
}
#fa_toolbar_hidden {
background-image:url(http://r28.imgfast.net/users/2814/33/31/58/album/10442210.jpg)!important; /*фон тулбара*/
}
/*цвет ссылок Вход и Регистрация*/
#fa_toolbar :link,#fa_toolbar :visited {
color:#55271A!important; /*цвет ссылок*/
}
/*оформление слова Поделиться и ссылок Здравствуйте nik и Уведомления*/
#fa_right #fa_menu #fa_welcome,#fa_right.notification #fa_menu #fa_welcome,#fa_welcome,#fa_right #fa_notifications,#fa_share_text {
color:#55271A!important; /*цвет*/
font-family:Georgia!important; /*название шрифта*/
font-size:16px!important; /*размер шрифта*/
}
/*оформление поля поиска тулбара*/
#fa_search #fa_textarea {
border:1px solid #B38000!important; /*рамка*/
background-color:#FFFFF2; /*фон*/
margin-top:1px!important; /*отступ от верха*/
}
/*фон поля под ссылками Здравствуйте nik и Уведомления после клика*/
#fa_right.welcome #fa_menu #fa_welcome,#fa_menu:hover:visited,#fa_toolbar > #fa_right.notification > #fa_notifications {
background-color:#FFFFF2!important; /*фон поля */
}
/*фон выпадающего меню под ссылкой Здравствуйте nik */
#fa_menulist {
background-color:#FFFFF2!important; /*фон*/
border-bottom:1px solid #B38000!important; /*нижняя рамка*/
border-left:1px solid #B38000!important; /*левая рамка*/
border-right:1px solid #B38000!important; /*правая рамка*/
border-top:0 solid #FFFFF2!important; /*верхняя рамка*/
}
/*всплывающее поле под ссылкой Уведомления*/
#fa_toolbar #fa_right #notif_list li.see_all {
background-color:#FFFFF2!important; /*фон*/
color:#804804!important; /*цвет текста*/
font-size:12px!important; /*размер текста*/
}
/*ссылки в выпадающем меню под ссылкой Здравствуйте nik*/
#fa_menulist a:link,#fa_menulist a:visited {
color:#804804!important; /*цвет ссылок*/
text-decoration:underline!important; /*подчёркивание ссылок*/
}
/*поле Вы получили "уведомление" от пользователя nik*/
#fa_toolbar #fa_right #notif_list li .content {
background-color:#FFECC9!important; /*фон*/
padding:5px!important;
}
фоновые картинки и цвета меняйте на свои
P.S. Если у вас на форуме фиксированное меню навигации вверху форума то вам необходимо ещё добавить эти коды.
- Код:
.fa_fix {
top:30px!important;
}
#fa_toolbar{
z-index:0!important;
}
Домовой-
-
Сообщения : 6801
Возраст : 101
Регистрация : 2010-01-30
Благодарности : 3243
Похожие темы
» Модификация тулбара
» Тулбара ее нет на главной странице
» Перенос уведомлений с тулбара
» Как отделить эффекты ссылок от Тулбара ?
» Как закруглить правый угол Тулбара ?
» Тулбара ее нет на главной странице
» Перенос уведомлений с тулбара
» Как отделить эффекты ссылок от Тулбара ?
» Как закруглить правый угол Тулбара ?
Страница 1 из 1
Права доступа к этому форуму:
Вы не можете отвечать на сообщения