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

1754
7.4 из 10
Проголосовало: 6






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

Взгляните ниже на стандартный вид цитаты от uCoz:


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

- рамка
- основной фон цитаты
- обычный шрифт, а не наклонный
- надпись Quote

Установим CSS:

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



Code
/* Белый вид цитаты  
  ------------------------------------------*/  
  .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://webo4ka.ru/Ucoz5/quote_6chtyk/quote_white.png) no-repeat 10px 10px!important;  
  padding: 5px 10px 5px 50px!important;  
  border: 1px solid #D0D0D0!important;  
  }  
  /*------------------------------------------*/


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



Code
/* Чёрный вид цитаты  
  ------------------------------------------*/  
  .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://webo4ka.ru/Ucoz5/quote_6chtyk/quote_black.png) no-repeat 10px 10px!important;  
  padding: 5px 10px 5px 50px!important;  
  border: 1px solid #333!important;  
  }  
  /*------------------------------------------*/


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



Code
/* Оранжевый вид цитаты  
  ------------------------------------------*/  
  .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://webo4ka.ru/Ucoz5/quote_6chtyk/quote_orange.png) no-repeat 10px 10px!important;  
  padding: 5px 10px 5px 50px!important;  
  border: 1px solid #E6C555!important;  
  }  
  /*------------------------------------------*/


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



Code
/* Синий вид цитаты  
  ------------------------------------------*/  
  .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://webo4ka.ru/Ucoz5/quote_6chtyk/quote_blue.png) no-repeat 10px 10px!important;  
  padding: 5px 10px 5px 50px!important;  
  border: 1px solid #80BBEF!important;  
  }  
  /*------------------------------------------*/


Зелёный вид цитаты:



Code
/* Зелёный вид цитаты  
  ------------------------------------------*/  
  .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://webo4ka.ru/Ucoz5/quote_6chtyk/quote_green.png) no-repeat 10px 10px!important;  
  padding: 5px 10px 5px 50px!important;  
  border: 1px solid #8BCA61!important;  
  }  
  /*------------------------------------------*/


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



Code
/* Красный вид цитаты  
  ------------------------------------------*/  
  .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://webo4ka.ru/Ucoz5/quote_6chtyk/quote_red.png) no-repeat 10px 10px!important;  
  padding: 5px 10px 5px 50px!important;  
  border: 1px solid #FF9999!important;  
  }  
  /*------------------------------------------*/


всё!
Автор публикации: Загрузка
Загрузка
Вовчик, это его n материал
Источник: http://www.center-dm.ru/
  • Всего комментариев: 7

The_Host
-1
The_Host написал: Написано 03 Февраля 2012 в 20:35
Комментарий №4
А к чему архив мне интересно?)))

Winston
-1
Winston написал: Написано 03 Февраля 2012 в 20:04
Комментарий №3
Почему не работает?
Вставил в Css цвет какой надо но все равно не работает!

Mr_Scratch
-3
Mr_Scratch написал: Написано 03 Февраля 2012 в 21:55
Комментарий №5
в сам верх ксс стави, потом включи и выключи конструктор, и все будет работать... cool

admin7553
0
admin7553 написал: Написано 28 Ноября 2012 в 23:31
Комментарий №6
Mr_Scratch, а как это:
Quote
включить и выключить конструктор
?

Idler
0
Idler написал: Написано 02 Декабря 2012 в 22:49
Комментарий №7
Не работает только в белом виде. В нём просто убери из .quoteMessage1{ цифру 1

Mr_Scratch
0
Mr_Scratch написал: Написано 03 Февраля 2012 в 18:07
Комментарий №2
Шыкарно biggrin

BLAzER
0
BLAzER написал: Написано 03 Февраля 2012 в 17:32
Комментарий №1
Четко))

  • Оставить комментарий:
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация | Вход
Меню сайта
Категории
Для помощи создания сайта uCoz 25
Скрипты и модификации для Ucoz 2115
Шаблоны форумов Ucoz 28
Шаблоны сайтов Ucoz 431
Авторство Webo4ki 309
php скрипты для ucoz 57
Графика для uCoz 40
Мини-чат
Последние комментарии
Добрый вечер.Подскажите,пожалуйста: как сделать, чтобы второй или третий набор смайлов заменить своими.
Вы сами себе пишите?
  • CbIPoK2513 написал:
  • Скрипт хорош, уже подстроил свой сайт под него :3
  • gefest35 написал:
  • Супер)))!пасиб за работу!!!
  • sasha2016tv написал:
  • Хороший скрипт
    Последние темы
    Опрос
    235
    А
    Р
    Что произойдёт: $("#...
    Статистика
    Анализ интернет сайта
    0
    онлайн
    0
    наших
    0
    чужих
    Онлайн всего: 8
    Гостей: 8
    Пользователей: 0
    Топ пользователей: