Модератор форума: Yuri_G  
Сообщество uCoz » Мастерская uCoz » Дизайн: управление шаблонами » Комментарии: настройка дизайна (работа стилями)
Комментарии: настройка дизайна
Модератор форума
Сообщение # 1 | 12:15:43
Стандартный шаблон комментариев теперь выглядит так:

Код
<div class="$CLASS$" style="padding:3px;">
<div class="cDate" style="float:right">$DATE$ $MODER_PANEL$</div>
<div class="cTop"><span style="width:18px;">$NUMBER$.</span> <b>$NAME$</b>
<?if($USERNAME$)?>(<a href="$PROFILE_URL$">$USERNAME$</a>)<?endif?>
<?if($EMAIL$)?><a href="$EMAIL_JS$" title="Email"><img border="0" align="absmiddle" src="http:https://src.ucoz.ru/t/114/e.gif"></a><?endif?>
<?if($SITE$)?><a rel="nofollow" href="$SITE$" target="_blank" title="Site"><img border="0" align="absmiddle" src="http:https://src.ucoz.ru/t/114/h.gif"></a><?endif?>
</div>
<div class="cMessage">$MESSAGE$</div>
<?if($ANSWER$)?><div class="cAnswer"><b>Ответ администратора</b>: $ANSWER$</div><?endif?>
</div>


Или табличный такой:

Код
<table border="0" cellpadding="0" cellspacing="0" width="100%" class="$CLASS$"><tr><td style="padding:3px;"><div style="float:right;font-size:11px;font-family:Arial,sans-serif;"><?if($COMMENT_RATING$<0)?><span class="myWinError"><b>$COMMENT_RATING$</b></span><?else?><?if($COMMENT_RATING$=0)?><span style="color:gray;"><b>$COMMENT_RATING$</b></span><?else?><span class="myWinSuccess"><b>+$COMMENT_RATING$</b></span><?endif?><?endif?>  <?if($GOOD_COMMENT_URL$)?><a href="$GOOD_COMMENT_URL$"><img alt="" src="http://s2.ucoz.net/img/icon/thumbu.png" width="13" align="absmiddle" border="0" title="Хороший пост"></a> <a href="$BAD_COMMENT_URL$"><img alt="" src="http://s2.ucoz.net/img/icon/thumbd.png" width="13" border="0" align="absmiddle" title="Плохой пост"></a><?else?><img alt="" src="http://s2.ucoz.net/img/icon/thumbu_.png" align="absmiddle" width="13" border="0" title="Хороший пост"> <img alt="" src="http://s2.ucoz.net/img/icon/thumbd_.png" width="13" align="absmiddle" border="0" title="Плохой пост"><?endif?> $MODER_PANEL$</div><div class="cTop" style="text-align:left;"><?if($IS_OWN$)?><span class="myWinError">*</span> <?else?><?if($IS_NEW$)?><span class="myWinSuccess">*</span> <?endif?><?endif?><a href="#ent$ID$" onclick="if (document.getElementById('comEnt$ID$')){$('body').scrollTo( { top:$('#comEnt$ID$').offset().top-22, left:0}, 500 );return false;}" name="ent$ID$"><b>$NUMBER$</b></a>
<?if($USERNAME$)?><a href="$PROFILE_URL$"><b>$USERNAME$</b></a><?else?><b>$NAME$</b><?endif?>   <span style="font-size:7pt;unicode-bidi:embed;">($DATE$ $TIME$)</span>
<?if($ENTRY_URL$)?>[<a href="$ENTRY_URL$" target="_blank" title="Перейти на страницу материала">Материал</a>]<?endif?>
</div>
<div class="cMessage" style="text-align:left;clear:both;padding:2px 0;"><?if($USER_AVATAR_URL$)?><a href="$PROFILE_URL$" title="$USERNAME$" style="padding-right:4px;"><img alt="" align="left" src="$USER_AVATAR_URL$" width="30" border="0" /></a><?endif?>$MESSAGE$</div>
<?if($ANSWER$)?><div class="cAnswer" style="text-align:left;clear:both;"><b>Ответ</b>: $ANSWER$</div><?endif?>
<?if($ANSWER_URL$)?><div style="clear:both;padding:4px 0;font-size:7pt;">[<a href="$ANSWER_URL$">Ответить</a>]</div><?endif?>
</td></tr></table>



То есть таблиц больше нет и совершенно поменялись классы. Естественно вы остались без оформления комментариев после обновлений от 12.06.07.

Но это дело поправимое. У нас теперь есть новые классы:

cDate - отвечает за вид даты добавления комментария.
cTop - отвечает за вид данных об авторе комментария.
cMessage - отвечает за вид самого комментария.
cAnswer - отвечает за вид ответа администратора.

И есть ещё очень интересная штука - $CLASS$ - CSS класс (разный для четных/нечетных комментариев) принимает вид:
cBlock1 - нечётные
cBlock2 - чётные

Есть ещё классы для оформления общего контейнера с комментариями:

commentsPart - общий вид.
csTop - отвечает за первую строку в контейнере с комментариями.
csQuantity - отвечает за вид надписи о количестве комментариев.

Есть ещё разные id, но их мы тут касаться не будем, это для знатоков.

В итоге пример самого простенького комментария:

/* Comments Style */
.cTop {font-size:11px;color:#C19454;font-weight:bold;padding-bottom:5px;}
.cDate {font-size:11px;color:#C19454;}
.cMessage{padding-left:5px;padding-top:2px;border:1px dashed #A67F48;text-align:justify;padding-bottom:5px;padding-right:3px;}
.cAnswer {padding-left:15px;padding-top:4px;font-style:italic;color:#7b2a24;}
/* -------------- */







CSS-конструктор для настройки стилей комментариев: Перейти »
AlexSoft777
Сообщений: 12
Репутация: 1

Сообщение # 106 | 18:50:58
Selena, при просмотре новостей, статей и т.п
Selena
Сообщений: 15657
Репутация: 1100

Сообщение # 107 | 19:05:23
AlexSoft777, если на странице материала, то можно через стили для класса .eText.

GarryNeo, стилями много можно сделать. Если объясните, что вам точно надо.

Отправляя сообщение о помощи, приводите ссылку на свой сайт. Это не считается рекламой, зато снимает массу вопросов.
AlexSoft777
Сообщений: 12
Репутация: 1

Сообщение # 108 | 20:08:57
Quote (Selena)
AlexSoft777, если на странице материала, то можно через стили для класса .eText.


Спасибо. Получилась.

GarryNeo
Сообщений: 24
Репутация: 3

Сообщение # 109 | 22:58:07
Selena, в общем вот включён Древовидный вывод комментариев. Т.е. при ответе на комментарий, этот ответ появляется после комментария со сдвигом вправо. Мне же нужно, чтобы этот ответ шёл как обычный комментарий.

Вот как сейчас


Вот как надо мне
Selena
Сообщений: 15657
Репутация: 1100

Сообщение # 110 | 01:34:27
GarryNeo, похоже только скриптом. Стилями не получится, там системой выводится отступ и он прямо в коде.

Отправляя сообщение о помощи, приводите ссылку на свой сайт. Это не считается рекламой, зато снимает массу вопросов.
olegsuv
Сообщений: 1365
Репутация: 127

Сообщение # 111 | 01:44:08
Quote (Selena)
Стилями не получится, там системой выводится отступ и он прямо в коде.

Невозможное возможно biggrin

1. Завернуть комментарии в контейнер:
Code
<div class="commContainer">$COMMENTS$</div>

2. Стили:
Code
.commContainer #allEntries > div {display:inline;}

Любые работы по:
- Javascript, jQuery, HTML, CSS
- Верстке макетов и установке их на сайты
- Нестандартным решениям
Сообщение отредактировал mob_dp2 - Среда, 15 Фев 2012, 01:44:33
Selena
Сообщений: 15657
Репутация: 1100

Сообщение # 112 | 16:21:54
mob_dp2, можно пример?

Отправляя сообщение о помощи, приводите ссылку на свой сайт. Это не считается рекламой, зато снимает массу вопросов.
olegsuv
Сообщений: 1365
Репутация: 127

Сообщение # 113 | 16:25:07
Selena, я же готовое решение написал, пробуйте.
Суть в том что inline-объекты не могут иметь параметров width/height/padding/margin

Любые работы по:
- Javascript, jQuery, HTML, CSS
- Верстке макетов и установке их на сайты
- Нестандартным решениям
GarryNeo
Сообщений: 24
Репутация: 3

Сообщение # 114 | 16:32:02
mob_dp2, спасибо большое! inline очень помог!

Добавлено (15-Фев-2012, 16:32:02)
---------------------------------------------
Возник теперь следующий вопрос. Можно этим ответам, придать свой стиль комментария? Или нету условия в юкозе, который определяет что обычный коммент, а что ответ?

olegsuv
Сообщений: 1365
Репутация: 127

Сообщение # 115 | 16:33:53
Quote (GarryNeo)
Или нету условия в юкозе, который определяет что обычный коммент, а что ответ?

Без понятия, посмотрите по коду.
Хотя можно сделать селектор по параметру, но нужно эксперементировать.

Любые работы по:
- Javascript, jQuery, HTML, CSS
- Верстке макетов и установке их на сайты
- Нестандартным решениям
Selena
Сообщений: 15657
Репутация: 1100

Сообщение # 116 | 17:40:28
mob_dp2, спасибо. Меня смутил код $COMMENTS$.

GarryNeo, для ответов администратора есть класс .cAnswer, а для самого комментария .cMessage

Отправляя сообщение о помощи, приводите ссылку на свой сайт. Это не считается рекламой, зато снимает массу вопросов.
GarryNeo
Сообщений: 24
Репутация: 3

Сообщение # 117 | 17:54:05
Selena, да это ясно. А вот мне нужен класс для ответа пользователя на комментарий другого пользователя. Вот как это можно провернуть...
Selena
Сообщений: 15657
Репутация: 1100

Сообщение # 118 | 18:09:47
GarryNeo, я уже выше писала, отдельных идентификаторов нет. Разница вносится системным скриптом при добавлении комментария, он вставляет отступ, который инлайном убирается.

Отправляя сообщение о помощи, приводите ссылку на свой сайт. Это не считается рекламой, зато снимает массу вопросов.
olegsuv
Сообщений: 1365
Репутация: 127

Сообщение # 119 | 18:27:38
Quote (Selena)
Меня смутил код $COMMENTS$.

Мне облом было лесть за нормальным, на память не помню

Любые работы по:
- Javascript, jQuery, HTML, CSS
- Верстке макетов и установке их на сайты
- Нестандартным решениям
Selena
Сообщений: 15657
Репутация: 1100

Сообщение # 120 | 18:39:14
mob_dp2, правильный код $COM_BODY$.

Отправляя сообщение о помощи, приводите ссылку на свой сайт. Это не считается рекламой, зато снимает массу вопросов.
Сообщество uCoz » Мастерская uCoz » Дизайн: управление шаблонами » Комментарии: настройка дизайна (работа стилями)
Поиск: