» » » Вигляд цитати для Ucoz

Вигляд цитати для Ucoz

Привіт!
Давайте розберемо сьогодні давно наболілу тему. Як змінити стандартний вид цитати в системі uCoz?
Упевнений що стандартний вигляд блоку цитати для uCoz своїм безглуздим виглядом не залишає хороших вражень у вас і відвідувачів вашого сайту. Так чому ж нам не позбутися швидше від цього стандарту і не застосувати своє оформлення? Пропоную розібрати вихідний код стандартного блоку цитати і на основі розібраного коду зробити новий вид цитат для uCoz .
HTML стандартної форми
Вигляд цитати для Ucoz

<div class="bbQuoteBlock"> 
<div class="bbQuoteName" style="padding-left:5px;font-size:7pt"><b>Quote</b> (<span class="qName"><!--qn-->cech<!--/qn--></span>)</div> 
<div class="quoteMessage" style="border:1px inset;max-height:200px;overflow:auto;height:expression(this.scrollHeight<5?this.style.height:scrollHeight>200?'200px':''+(this.scrollHeight+5)+'px');"><!--uzq-->Большой опыт работы, проекта MVCreative, в создании верстки гарантирует грамотный, профессиональный подход к делу!<!--/uzq--></div> 
</div>


Розберемо класи для її управління:
bbQuoteBlock - оболонка блоку цитати
bbQuoteName - блок імені цитованого
qName - ім'я цитованого
quoteMessage - текст цитати
А тепер застосуємо стилі та змінимо відображення виду цитати uCoz, скопіюєте вподобаний css код і встановіть або в стандартні стилі uCoz ПУ / Дизайн / Управління дизайном (CSS) , або в свій окремий css файл.

Голубий варіант
Вигляд цитати для Ucoz

CSS код:
.bbQuoteName { 
  background:#6cadcd; 
  color:#fff; 
  line-height:28px; 
  padding-left:15px; 
  text-transform:uppercase; 
} 
.quoteMessage { 
  border:1px solid #e5e1d9 !important; 
  border-top:0 none !important; 
  padding:15px 15px 15px 15px; 
  background:#f2eee6 url(http://mvcreative.ru/example/5/blue_arrow.png) no-repeat 90% top; 
  font-style:italic; 
} 


JS-код:
<script type="text/javascript">  
jQuery(document).ready(function () { 
  $(".bbQuoteName b").text("Цитата"); 
}); 
</script>


Ось і все. Для того щоб змінити колір достатньо змінити значення background: [color];


UCOZ scripts
2104 09.12.14



Напівжирний Нахилений текст Підкреслений текст Перекреслений текст | Вирівнювання по лівому краю По центру Вирівнювання по правому краю | Вставка смайликів Вибір кольору | Прихований текст Вставка цитати Перетворити вибраний текст з транслітерації в кирилицю Вставка спойлеру