prowebber.ru - Тут есть все для настоящих вебмастеров

Чтение RSS Мы в твиттере
«    Декабрь 2016    »
ПнВтСрЧтПтСбВс
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
 

Всё для вебмастера » Всё для uCoz » uCoz хаки » Шесть цветовых решений вида цитат для uCoz

Шесть цветовых решений вида цитат для uCoz


Данный материал предоставлен сайтом ProWebber.ru исключительно в ознакомительных целях. Администрация не несет ответственности за его содержимое.
У нас вы можете скачать бесплатно Шесть цветовых решений вида цитат для uCoz.


Шесть цветовых решений вида цитат для uCoz


Всем доброго дня, сегодня я вам расскажу как изменить стандартный вид цитаты в системе uCoz, я всегда был против этого стандарта, так как он нарушает многие моменты в юзабилити из-за чего внешний вид такой цитаты вызывает отрицательные эмоции у пользователей.

Установка


Шаг 1 - Разбираем HTML:
Мы все с вами знаем, для того чтобы вывести цитату на своём сайте в системе uCoz, мы будем использовать код Quote, поэтому для того чтобы увидеть html код, мы просмотрим исходный код страницы где находиться ваша цитата и увидим следующее:
<div class="bbQuoteBlock">  
  <div style="padding-left: 5px; font-size: 7pt;" class="bbQuoteName"><b>Quote</b></div>  
  <div style="border: 1px inset; max-height: 200px; overflow: auto;" class="quoteMessage">  
Текст цитаты  
  </div>  
  </div>


из кода мы видим, что весь основной html код состоит из трёх частей:
1 - основной контейнер div (с классом bbQuoteBlock)
2 - контейнер div с надписью Quote (с классом bbQuoteName)
3 - контейнер с текстом цитаты (с классом quoteMessage)
многие кто знают html-css достаточно хорошо, сразу увидят очень грубую ошибку в коде, а именно, css стили прописаны в самих тегах div, а не прописаны в стандартный файл стилей. Но слава богу у нас имеются классы для стилей, которые мы будем изменять.
Шаг 2 - Установим CSS:
Перед тем как вы будете устанавливать данные css стили, я хочу сказать пару слов о том, что мы будем использовать в css стилях параметр !important;, а также ячейку div с текстом Quote мы скроем на ваше страницы, благодаря атрибуту display:none;
А теперь выбираем нужную цветовую гамму и устанавливаем к себе на сайт:


Белый вид цитаты:

Шесть цветовых решений вида цитат для uCoz


/* Белый вид цитаты  
------------------------------------------*/  
.bbQuoteBlock {  
  margin: 15px 0px 15px 0px!important;  
}  

.bbQuoteName {  
  display:none;  
}  

.quoteMessage1{  
  overflow: hidden!important;  
  text-align:justify!important;  
  font:115%/1.5 Verdana,Arial,Helvetica,sans-serif!important;  
  color:#555;text-shadow:1px 1px 1px #fff!important;  
  font-style: italic!important;  
  background: #EAEAEA url(http://joomla.ucoz.com/Ajax/5/quote_white.png) no-repeat 10px 10px!important;  
  padding: 5px 10px 5px 50px!important;  
  border: 1px solid #D0D0D0!important;  
}  
/*------------------------------------------*/  


Тёмный вид цитаты:

Шесть цветовых решений вида цитат для uCoz


/* Чёрный вид цитаты  
------------------------------------------*/  
.bbQuoteBlock {  
  margin: 15px 0px 15px 0px!important;  
}  

.bbQuoteName {  
  display:none;  
}  

.quoteMessage {  
  overflow: hidden!important;  
  text-align:justify!important;  
  font:115%/1.5 Verdana,Arial,Helvetica,sans-serif!important;  
  color:#c9c9c9;text-shadow:1px 1px 1px #000!important;  
  font-style: italic!important;  
  background: #454a50 url(http://joomla.ucoz.com/Ajax/5/quote_black.png) no-repeat 10px 10px!important;  
  padding: 5px 10px 5px 50px!important;  
  border: 1px solid #333!important;  
}  
/*------------------------------------------*/  


Оранжевый вид цитаты:

Шесть цветовых решений вида цитат для uCoz


/* Оранжевый вид цитаты  
------------------------------------------*/  
.bbQuoteBlock {  
  margin: 15px 0px 15px 0px!important;  
}  

.bbQuoteName {  
  display:none;  
}  

.quoteMessage {  
  overflow: hidden!important;  
  text-align:justify!important;  
  font:115%/1.5 Verdana,Arial,Helvetica,sans-serif!important;  
  color:#867200;text-shadow:1px 1px 1px #fff!important;  
  font-style: italic!important;  
  background: #FDEBAE url(http://joomla.ucoz.com/Ajax/5/quote_orange.png) no-repeat 10px 10px!important;  
  padding: 5px 10px 5px 50px!important;  
  border: 1px solid #E6C555!important;  
}  
/*------------------------------------------*/  


Синий вид цитаты:

Шесть цветовых решений вида цитат для uCoz


/* Синий вид цитаты  
------------------------------------------*/  
.bbQuoteBlock {  
  margin: 15px 0px 15px 0px!important;  
}  

.bbQuoteName {  
  display:none;  
}  

.quoteMessage {  
  overflow: hidden!important;  
  text-align:justify!important;  
  font:115%/1.5 Verdana,Arial,Helvetica,sans-serif!important;  
  color:#155084;text-shadow:1px 1px 1px #fff!important;  
  font-style: italic!important;  
  background: #C2DDF9 url(http://joomla.ucoz.com/Ajax/5/quote_blue.png) no-repeat 10px 10px!important;  
  padding: 5px 10px 5px 50px!important;  
  border: 1px solid #80BBEF!important;  
}  
/*------------------------------------------*/  


Шесть цветовых решений вида цитат для uCoz


/* Зелёный вид цитаты  
------------------------------------------*/  
.bbQuoteBlock {  
  margin: 15px 0px 15px 0px!important;  
}  

.bbQuoteName {  
  display:none;  
}  

.quoteMessage {  
  overflow: hidden!important;  
  text-align:justify!important;  
  font:115%/1.5 Verdana,Arial,Helvetica,sans-serif!important;  
  color:#15841a;text-shadow:1px 1px 1px #fff!important;  
  font-style: italic!important;  
  background: #D1F7B6 url(http://joomla.ucoz.com/Ajax/5/quote_green.png) no-repeat 10px 10px!important;  
  padding: 5px 10px 5px 50px!important;  
  border: 1px solid #8BCA61!important;  
}  
/*------------------------------------------*/  


Красный вид цитаты:

Шесть цветовых решений вида цитат для uCoz


/* Красный вид цитаты  
------------------------------------------*/  
.bbQuoteBlock {  
  margin: 15px 0px 15px 0px!important;  
}  

.bbQuoteName {  
  display:none;  
}  

.quoteMessage6 {  
  overflow: hidden!important;  
  text-align:justify!important;  
  font:115%/1.5 Verdana,Arial,Helvetica,sans-serif!important;  
  color:#CE3A12;text-shadow:1px 1px 1px #fff!important;  
  font-style: italic!important;  
  background: #FFCCCC url(http://joomla.ucoz.com/Ajax/5/quote_red.png) no-repeat 10px 10px!important;  
  padding: 5px 10px 5px 50px!important;  
  border: 1px solid #FF9999!important;  
}  
/*------------------------------------------*/  


Готово.

Автор: RuleZ-DM
Источник: http://www.center-dm.ru/news/shest_cvetovykh_reshenij_vida_citat_dlja_ucoz/2012-02-03-209


+4
Просмотры: 2048 VIP ProWebber | Комментарии (5)
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.

#1Tellst

  • 5 февраля 2012 17:04
  • Регистрация: 15.09.2009
  • ICQ: --
  • Комментариев: 345
aid122

#FFCCCC url(http://joomla.ucoz.com/Ajax/5/quote_red.png) no-repeat 10px 10px!important;

опять рекламируешь свой гс?

+1

#2pmsa4ka

  • 5 февраля 2012 17:45
  • Регистрация: 16.05.2011
  • ICQ: --
  • Комментариев: 132
Tellst, исходные ссылки mamba на картинку O_O автор Омская птица ))

0

#3Tellst

  • 5 февраля 2012 18:53
  • Регистрация: 15.09.2009
  • ICQ: --
  • Комментариев: 345
pmsa4ka я знаю что это, просто в оригинале исходные ссылки автора, данного хака. А этот вставил свои

0

#42009bes

  • 16 июля 2012 11:09
  • Регистрация: 11.09.2011
  • ICQ: --
  • Комментариев: 59
Tellst,
тебе лиш бы докопатся ?????? Не люблю таких людей, которым всё время чтото не так.

0

#5Marsipan

  • 18 января 2013 07:57
  • Регистрация: 26.09.2010
  • ICQ: --
  • Комментариев: 11
Цитата: Tellst
я знаю что это, просто в оригинале исходные ссылки автора, данного хака. А этот вставил свои


Могу поспорить что это просто копипаст с Joomla.ucoz.**

0
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии в данной новости.

Max-energy.top - Заработок на электросчетчиках;)

Skripters.info - все для вебмастера. Только эксклюзивный контент.

Создание шаблонов DLE, быстро и недорого! 3wave.com.ua

Бро лей на лучшую партнёрку

Почти бесплатный VDS хостинг!

Поддержи сайт
Скрипты, cms, шаблоны, статьи по раскрутке

Опросы

Как часто вы бываете на сайте?

Захожу 1-2 раза в день
1-2 часа в сутки
Более 2 часов
Почти целый день тут smile

Архив новостей
Ноябрь 2016 (7)
Октябрь 2016 (10)
Сентябрь 2016 (8)
Август 2016 (11)
Июль 2016 (14)
Июнь 2016 (17)

Последние комментарии:

Искать людей

Ваши переписки