Стандартные условия рейтинга не совсем устраивают пользователей сайтов, и вот создано новое для того что бы пользователь смог голосовать за материал и оставлять свой лайк или просто указать что ему нравится данная новость на вашем ресурсе.
Заменить стандартный рейтинг от uCoz, на кнопку
Like и не забывайте, что слово Like можно заменить на слово Мне нравиться и т.д
Установка:
Примеры :
1-
2-
3-
4-
5-
Для начала нам следует установить для того или иного модуля uCoz на страницу комментариев один из двух html каркасов HTML для 1,2,3,4 примеров:
Код
<?if($RATING$)?>
<div class="rating_like" id="rating_like$ID$">
<a href="javascript://" id="golike" onclick="$.get('/publ/0-1-1-$ID$-3',function(data) {if($(data).text().indexOf('уже оценивали')>-1) _uWnd.alert('Вы уже оценивали данный материал!','Ошибка',{w:270,h:60,t:8000}); else {_uWnd.alert('Вы успешно оценили!','Успех',{w:270,h:60,t:8000});$('#rating_like$ID$').text('+<?$RATED$+1?>');};}); ">
<div class="rating_like_r">Like <?if($RATED$)?>+<?else?><?endif?>$RATED$</div>
</a>
</div>
<?endif?>
HTML для 5 примера:
Код
<?if($RATING$)?>
<div class="rating_like" id="rating_like$ID$">
<a href="javascript://" id="golike" onclick="$.get('/publ/0-1-1-$ID$-3',function(data) {if($(data).text().indexOf('уже оценивали')>-1) _uWnd.alert('Вы уже оценивали данный материал!','Ошибка',{w:270,h:60,t:8000}); else {_uWnd.alert('Вы успешно оценили!','Успех',{w:270,h:60,t:8000});$('#rating_like$ID$').text('+<?$RATED$+1?>');};}); ">
<div class="rating_like_l">Like</div>
<div class="rating_like_r"><?if($RATED$)?>+<?else?><?endif?>$RATED$</div>
</a>
</div>
<?endif?>
в данном html коде нам следует заменить следующий участок кода /publ/0-1-1-$ID$-3, на код того модуля в который вы устанавливаете данное решение:
Для модуля - Каталог сайтов: /dir/0-1-1-$ID$-3
Для модуля - Каталог статей: /publ/0-1-1-$ID$-3
Для модуля - Каталог файлов: /load/0-1-1-$ID$-3
Для модуля - Каталог игр: /stuff/1-1-0-$ID$
Для модуля - Блог: /blog/0-0-1-$ID$-14-1
Для модуля - Фото альбом: /photo/1-1-$ID$-13-1
Для модуля - Вопросы ответы: /faq/0-1#$ID$
Для модуля - Доска объявления: /board/0-1-1-$ID$-3
чтобы не вводить вас в заблуждения, ниже отдельно я размещаю html код основного модуля сайта - новости сайта, так как он отличается немного от оригинала HTML для 1,2,3,4 примеров:
Код
<?if($RATING$)?>
<div class="rating_like" id="rating_like$ID$">
<a href="javascript://" id="golike" onclick="$.get('/news/0-0-1-$ID$-15-1',function(data) {if($(data).text().indexOf('уже оценивали')>-1) _uWnd.alert('Вы уже оценивали данный материал!','Ошибка',{w:270,h:60,t:8000}); else {_uWnd.alert('Вы успешно оценили!','Успех',{w:270,h:60,t:8000});$('#rating_like$ENTRY_ID$').text('+<?$RATED$+1?>');};}); ">
<div class="rating_like_r">Like <?if($RATED$)?>+<?else?><?endif?>$RATED$</div>
</a>
</div>
<?endif?>
или HTML для 5 примера:
Код
<?if($RATING$)?>
<div class="rating_like" id="rating_like$ID$">
<a href="javascript://" id="golike" onclick="$.get('/news/0-0-1-$ID$-15-1',function(data) {if($(data).text().indexOf('уже оценивали')>-1) _uWnd.alert('Вы уже оценивали данный материал!','Ошибка',{w:270,h:60,t:8000}); else {_uWnd.alert('Вы успешно оценили!','Успех',{w:270,h:60,t:8000});$('#rating_like$ENTRY_ID$').text('+<?$RATED$+1?>');};}); ">
<div class="rating_like_l">Like</div>
<div class="rating_like_r"><?if($RATED$)?>+<?else?><?endif?>$RATED$</div>
</a>
</div>
<?endif?>
Установим CSS:
Теперь когда html каркас кнопки Like для uCoz установлен, давайте выберем нужное оформление на css:
Код
/* Кнопка Like для uCoz №1
------------------------------------------*/
.rating_like {
float:left;
font: 11px Verdana,Arial,Helvetica, sans-serif;
font-weight: bold;
color:#fff;
background:#ACCE77;
padding: 4px 10px 4px 10px;
border-radius: 3px;
}
.rating_like a {
float:left;
background:#ACCE77 url(http://ucozon.ru/_dr/64/20002982.png) no-repeat left top;
padding: 4px 10px 4px 30px;
margin: -4px -10px -4px -10px;
border-radius: 3px;
color:#fff;
text-decoration:none;
}
.rating_like a:hover {
background:#E96465 url(http://ucozon.ru/_dr/64/20002982.png) no-repeat left top;
}
.rating_like_r{
float:right;
}
кнопка Like 2 для uCoz
Код
/* Кнопка Like для uCoz №2
------------------------------------------*/
.rating_like {
float:left;
font: 11px Verdana,Arial,Helvetica, sans-serif;
font-weight: bold;
color:#fff;
background:#5C9AD5;
padding: 4px 10px 4px 10px;
border-radius: 3px;
}
.rating_like a {
float:left;
background:#5C9AD5 url(http://ucozon.ru/_dr/64/20002982.png) no-repeat left top;
padding: 4px 10px 4px 30px;
margin: -4px -10px -4px -10px;
border-radius: 3px;
color:#fff;
text-decoration:none;
}
.rating_like a:hover {
background:#E96465 url(http://ucozon.ru/_dr/64/20002982.png) no-repeat left top;
}
.rating_like_r{
float:right;
}
кнопка Like 3 для uCoz
Код
/* Кнопка Like для uCoz №3
------------------------------------------*/
.rating_like {
float:left;
font: 11px Verdana,Arial,Helvetica, sans-serif;
font-weight: bold;
color:#fff;
background:#E96465;
padding: 4px 10px 4px 10px;
border-radius: 3px;
}
.rating_like a {
float:left;
background:#E96465 url(http://ucozon.ru/_dr/64/20002982.png) no-repeat left top;
padding: 4px 10px 4px 30px;
margin: -4px -10px -4px -10px;
border-radius: 3px;
color:#fff;
text-decoration:none;
}
.rating_like a:hover {
background:#ACCE77 url(http://ucozon.ru/_dr/64/20002982.png) no-repeat left top;
}
.rating_like_r{
float:right;
}
Код
/* Кнопка Like для uCoz №4
------------------------------------------*/
.rating_like {
float:left;
font: 11px Verdana,Arial,Helvetica, sans-serif;
font-weight: bold;
padding: 4px 10px 4px 10px;
border-radius: 3px;
}
.rating_like a {
float:left;
background:url(http://ucozon.ru/_dr/64/22710585.png) no-repeat left top;
padding: 2px 10px 4px 30px;
margin: 0px -10px 0px -10px;
border-radius: 3px;
text-decoration:none;
}
.rating_like a:hover {
background:url(http://ucozon.ru/_dr/64/22710585.png) no-repeat left top;
}
.rating_like_r{
float:right;
}
кнопка Like 5 для uCoz
Код
/* Кнопка Like для uCoz №5
------------------------------------------*/
.rating_like {
float:left;
font: 11px Verdana,Arial,Helvetica, sans-serif;
font-weight: bold;
padding: 0px 0px 0px 5px;
}
.rating_like a {
float:left;
text-decoration:none;
}
.rating_like_l{
float:left;
padding: 2px 0px 2px 0px;
}
.rating_like_r{
float:left;
margin: 0px 0px 0px 5px;
padding: 3px 7px 3px 7px;
background:#5C9AD5;
border-radius: 3px;
color:#fff;
}
.rating_like a:hover .rating_like_r {
background:#E96465;
}