Новые сообщения · Участники · Правила форума · Поиск · RSS
  • Страница 1 из 1
  • 1
Модератор форума: juliya  
Форум » uCoz » Cкрипты » Иконки на форум uCoz в стильной форме
Иконки на форум uCoz в стильной форме
juliyaДата: Суббота, 10-Декабря-2016, 12:37:03 | Сообщение # 1
Палкомник
Группа: Модераторы
Сообщений: 13
Награды: 1
Репутация: 32767
Статус: Offline


Как все мы знаем, создавая модуль форум, нам система предлагает несколько дизайн кнопок, что нам пригодятся в построение оригинальной кнопки. Также есть отдельный скрипт, это фон который просто накрывает стандартные иконки и получаться совершенно другой обзор. Если все же вы решили установить стандартные иконки, которые нарисованы и не знаете как сделать, то в этой статье все описано по скринам как все нужно пройти в раздел и прописать ссылки.Но дело стоит за тем, если в теме отписали, то нам нужно знать, да на этот счет идет тот же дизайн. но немного темнее, что не устраивает многих. И для этого мы привлекаем код, что будет рядом с иконкой стоять яркая кнопка, которая и будет оповещать, что кто то в теме отписался.

А просто сделаем так, что дизайн разнообразных кнопок не нужен будет, все будет стильно смотреться и также вы будете визуально видеть, что на форуме пишут посты или комментарий, так как где будет новый надпись, то там уже будет стоять круглая и в тоже время яркая как на темном или светлом фоне кнопка, что означает, нужно посмотреть.

Давайте раздеремся, как все будет смотреться.

Это когда есть комментарий


Это когда не кто не прокомментировал на форуме


Начнем установку!

Первое что сделаем это выставим фон, он как понимаете будет полупрозрачный в синем оттенке цвета. Но вы можете сами перекрасить под ваш дизайн.

Идем в CSS и там нужно найти, этот кусок стиля.
Код
.forumIcoTd {...}


Лично нашлa такое название, но без трое точеe и он стоял не с начало и не чего не сталa делать и убирать не сталa.

Нужно в стили поставить нам эту рамку светло синее, она также уменьшается и сейчас стоит на 50px как по высоте и ширине.

Копируем и ставим:
Код
.forumIcoTd {background:#ffffff url('http://zornet.ru/Ajaxoskrip/forumIcoTd.png' <img src="/.s/sm/2/wink.gif" border="0" align="absmiddle" alt="wink" /> no-repeat center;width:50px;height:50px;}


И теперь какие иконки у вас стояли, по вверх будет этот дизайн и примерно так смотреться.


Как видим здесь автоматически от системы не ставили, но скажу если делать так, то от системы красивей будет, и дальше увидим.

Теперь осталось узнать, где пользователи отписали, чтоб ответить или посмотреть, и вот как раз ярко желтая точка будет стоять рядом с кнопкой.

Чтоб ее установить, нужен этот скрипт.

Находим Общий вид страниц форума это в админ панели и заходим туда. Так ищем BODY и только после него ставит код.
Код
<script type="text/javascript">  
  $(document).ready(function(){  
  $('.forumIcoTd img[title="Есть новые сообщения"]' <img src="/.s/sm/2/wink.gif" border="0" align="absmiddle" alt="wink" /> .each(function(){  
  $(this).after('<div class="newMessage"><img src="http://zornet.ru/Ajaxoskrip/new_sob.png" border="0" alt="NewMessage"></div>' <img src="/.s/sm/2/wink.gif" border="0" align="absmiddle" alt="wink" />  
  });  
  });  
  </script>


В прицепе все мы установили и проверили на тестовом сайте, на светлом дизайн, а как можно понять от оттенка цвета или какой можно сделать, то и на темном будет здорово смотреться.

Здесь замечу, стоят системные кнопки.



Вот как видите очень прилично смотрится и нам не нужны не какие кнопки, которые бы менялись, когда можно все сделать стилях, а скрипт будет мониторинг на счет ответов или новых постов на форуме.


 
Форум » uCoz » Cкрипты » Иконки на форум uCoz в стильной форме
  • Страница 1 из 1
  • 1
Поиск: