Заработок в интернете и раскрутка вашего сайта Четверг, 22.06.2017, 14:55
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
Страница 1 из 11
Форум » Создание сайта » HTML коды для uCoz » Светлый вид комментариев для uCoz (Светлый вид комментариев для uCoz)
Светлый вид комментариев для uCoz
adminДата: Суббота, 21.12.2013, 15:08 | Сообщение # 1
Главный админ
Группа: Администраторы
Сообщений: 336
Награды: 0
Репутация: 1
Статус: Offline
Светлый вид комментариев для uCoz

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

Для тех же, кто предпочитает черный фон и красный текст, извините, не сегодня. Опять же Ucoz радует стильной новинкой - легкий и практичный белый или светлый дизайн. Никнеймы выделяет жирным, имеет графы времени добавления сообщения, возможность лайкнуть комментарий и перейти в приват, нажав на небольшой конвертик-письмо. Так же на светлом фоне отлично смотрятся яркие аватарки, так что ваши пользователи останутся довольны. Достойная аватарка на достойном фоне, скажу я вам - вещь важная и серьезная. А так же от белого фона глаза не так устают, если "в Интернете кто-то не прав" и приходится вести многочасовые молчаливые баталии с формучанами. Естественно, есть возможность размещать любимые смайлики. Для форумов с простой и понятной навигацией - такой плагине отличное решение - не перегружен ненужными цветами и элементами, но зато смотрится не дешево и придает общению на форуме нотку изысканности, ну вы понимаете о чем я - во всем нужно искать положительный момент, даже в простом по дизайне плагине от Ucoz.

Важно! Все картинки из прикреплённого архива залейте в папку img

Установка:

В виде материалов комментариев замените всё на:
Код
<divclass="content-com">
<divclass="com_p text_r text_9">
if($USERNAME$)?><ahref="$PROFILE_URL$">if($USER_AVATAR_URL$)?><imgclass="avatar_comment wbr3"src="$USER_AVATAR_URL$"/>else?><imgsrc="/img/no_avatar.jpg"class="avatar_comment wbr3"alt="аватар отсутствует"/>endif?></a>else?><imgsrc="/img/no_avatar.jpg"class="avatar_comment wbr3"alt="аватар отсутствует"/>endif?>

if($USER_LOGGED_IN$)?>
if($IS_OWN$)?>else?>
if($COMMENT_RATING$)?>else?>
<aclass="kcom_like ts_b wbr3"href="$GOOD_COMMENT_URL$">Like</a>
endif?>
endif?>
endif?>

</div>
<divclass="com_l wbr3">
<divclass="com_v grey">
if($ANSWER_URL$)?><divclass="left_block"><ahref="$ANSWER_URL$"title="Комментировать"><divclass="otvet"></div></a></div>endif?>
if($USERNAME$)?><divclass="left_block top cherta-right gren">$USERNAME$</div>else?>if($NAME$)?><divclass="left_block top cherta-right gren">$NAME$</div>else?><divclass="left_block top cherta-right gren">Гость</div>endif?>endif?>
<divclass="left_block top2 text_9">$DATE$ - $TIME$</div>
<divclass="right top2 text_9 grey cherta-left ">Like | if($COMMENT_RATING$=0)?>0else?><spanclass="gren">+$COMMENT_RATING$</span>endif?></div>
<divclass="right top2 text_9 grey cherta-left">№$NUMBER$</div>
if($MODER_PANEL$)?>
<atitle="Удалить"onclick="del_item($ID$);returnfalse;"id="di$ID$">
<divclass="delete-com right"></div>
</a>
<atitle="Редактировать"onclick="new _uWnd('Ie',' ',-600,-200,{autosize:1,closeonesc:1,resize:0},{url:'/index/37-$ID$'});returnfalse;">
<divclass="edit-com right"></div>
</a>
endif?>
</div>
<divclass="com_c text_115">$MESSAGE$ </div>
<divclass="com_n grey text_9">
<spanclass="left">
</span>
</div>
</div>
</div>


Следующий код разместите в самом низу вашего css:

Код
/* Вид комментариев v.1
------------------------------------------*/

/* Выравнивание */
div.left_block {float:left;}
div.right_block {float:right;}

/* Кнопки комментировать, редактировать, удалить */
.otvet {
background: url(/img/otvet.png);
background-position:0px0px;
width:25px;
height:23px;
cursor: pointer;
border-right:1px solid #cad1db;
}
.otvet:hover
{
background: url(/img/otvet.png);
background-position:0px-23px;
width:25px;
height:23px;
cursor: pointer;
}

.edit-com {
background: url(/img/moder-panel.png);
background-position:0px0px;
width:35px;
height:23px;
cursor: pointer;
border-left:1px solid #cad1db;
}
.edit-com:hover
{
background: url(/img/moder-panel.png);
background-position:0px-23px;
width:35px;
height:23px;
cursor: pointer;
}

.delete-com {
background: url(/img/moder-panel.png);
background-position:-35px0px;
width:35px;
height:23px;
cursor: pointer;
border-left:1px solid #cad1db;
}
.delete-com:hover
{
background: url(/img/moder-panel.png);
background-position:-35px-23px;
width:35px;
height:23px;
cursor: pointer;
}

/* Аватар */
.avatar_comment {
width:50px;
height:50px;
padding:3px;
background:#888888;
}

/* Закругление углов */
.wbr3 {
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
}

/* Контент */
.content-com {
float:left;
width:100%;
position:relative;
margin-bottom:15px
}

.com_p {
top:0;
right:0;
width:75px;
position:absolute;
background:url(/img/ugolok.png)no-repeat top left
}

.com_l {
padding:0px0;
background:#fff;
border:1px solid #cad1db;
margin:074px00;
overflow:hidden
}

.com_v {
height:23px;
border-bottom:1px solid #cad3da
}

.com_v,.com_n {
margin:00px00px
}

.com_c {
min-height:39px;
overflow:hidden;
margin:5px15px7px15px;
}

.com_c p {
padding:10px;
margin:10px0;
background:#ebfce8;
overflow:hidden!important;
border:1px solid #b4e5ac
}

/* Like */
.kcom_like:link,.kcom_like:visited {
text-align:center;
color:#fff;
float:right;
width:47px;
background:#999999;
margin-top:3px;
padding:1px3px1px3px;
border:1px solid #666666
}

.kcom_like:hover {
text-decoration: none;
border:1px solid #666666!important;
color:#375e15!important;
text-shadow:1px1px1px#d7ffb6!important;
background:#9aeb56!important
}

/* Черта возле кнопок */
.cherta-right {
height:20px;
border-right:1px solid #cad1db;
}

.cherta-left {
height:19px;
border-left:1px solid #cad1db;
}

/* Текст */
.text_r {
text-align:right;
}

.text_9 {
font:9pxVerdana,Arial,Helvetica, sans-serif;
}

.grey {
color:#b1b1b1;
}

.grey2 {
color:#cac8c8;
}

.gren {color:#429e1e;
font-weight:bold;
}

.right {
float:right;
}
.left {
float:left;
}

.top {
padding:4px12px0px12px;
}

.top2 {
padding:5px12px0px12px;
}

.bold {
font-weight:bold;
}

.text_115 {
font:115%/1.5Verdana,Arial,Helvetica, sans-serif;
}



data-yashareType="button" data-

yashareQuickServices="yaru,vkontakte,facebook,twitter,odnoklassniki,moimir,lj,gplus">
 

Нравится







Форум » Создание сайта » HTML коды для uCoz » Светлый вид комментариев для uCoz (Светлый вид комментариев для uCoz)
Страница 1 из 11
Поиск:

Заработок в интернете и продвижение вашего сайта © 2013-2017
Копирование материалов сайта без согласия запрещено!

Яндекс.Метрика

СЕГОДНЯ НАС ПОСЕТИЛИ:

200