Бесплатный форум: форум поддержки
Добро пожаловать на форум поддержки сервиса Forum2x2 !

Для полноценной работы с форумом,
пожалуйста, войдите на форум под своим логином (если вы уже зарегистрированы) или же зарегистрируйтесь.


С нашей помощью вы можете создать форум,
похожий на этот!
Мы в социальных сетях

Правила форума

для обязательного прочтения!


Внимание! Важная информация для РЕГИСТРАЦИИ на форуме:

Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
Последние темы
» Убрать значок
автор Леший Сегодня в 12:15

» Свечение для группы а не для юзера
автор Kuzbas63 Сегодня в 9:01

» Оформить имя
автор Kuzbas63 Сегодня в 8:59

» Красивый путь по сайту
автор Kuzbas63 Сегодня в 7:05

» Как убрать надписи в низу форума
автор Kuzbas63 Вчера в 13:51

» Как сократить расстояние
автор Lory Вчера в 10:12

» Искрящийся ник у групп
автор Kuzbas63 Вчера в 8:23

» Как отредактировать цвет на кнопках
автор Lory Вт 15 Авг - 23:58

» Как настроить конфиденциальность
автор катарсис Вт 15 Авг - 21:29

» Проблема с правами
автор Havva Вт 15 Авг - 19:30

Интересные решения
Быстрый переход к сервисам: j-p-g.net Видео фоторедактор Транслит

Настройки CSS для Тулбара

Предыдущая тема Следующая тема Перейти вниз

Настройки CSS для Тулбара

Сообщение автор Dana Domirani в Чт 7 Фев - 12:33

Настройки CSS для Тулбара.

Нижеуказанные коды добавляются в Па > Оформление > Цвета > Каскадная таблица стилей CSS.

Фоновый цвет для Тулбара:
    Код:
    #fa_toolbar, #fa_toolbar_hidden {
    background-color: #fff !important;
    }
    #fff — замените на желаемый цвет


Фоновое изображение для Тулбара:


Убрать строку поиска:

    Код:
    #fa_search {
    display: none !important;
    }


Убрать блок "Поделиться":

    Код:
    #fa_share {
    display: none !important;
    }


Подсвечивание кол-ва уведомлений:

    Код:
    #fa_notifications.unread #notif_unread {
    color: #FA0E21;
    margin-left: 5px;
    font-weight: bold;
    }
    #FA0E21 — замените на желаемый цвет


Изменить подсвечивание заголовков профиля и уведомлений

    Код:
    #fa_toolbar > #fa_right.notification > #fa_notifications, #fa_right.welcome #fa_menu #fa_welcome {
    background-color: #398AC6 !important;
    color: #fff !important;
    }
    background-color — фон, замените код цвета #398AC6 на желаемый
    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;
    }
    background-color — фон, замените код цвета #fff на желаемый
    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


avatar
Dana Domirani
Администратор
Администратор

Женщина

Сообщения : 22421
Возраст : 32
Регистрация : 2008-04-18
Благодарности : 9027

Без предупреждений

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Оформление тулбара сервиса 2х2

Сообщение автор Домовой в Вс 10 Фев - 20:36

Оформление тулбара



Ставить в 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;
}
avatar
Домовой
 

Мужчина

Сообщения : 6805
Возраст : 93
Регистрация : 2010-01-30
Благодарности : 3232

Без предупреждений

Вернуться к началу Перейти вниз

Предыдущая тема Следующая тема Вернуться к началу


 
Права доступа к этому форуму:
Вы не можете отвечать на сообщения