Скрипт кнопки мне нравится для uCoz


Скрипт кнопки мне нравится для uCoz

5473
8.4 из 10
Проголосовало: 10






Доброе времени суток дорогие читатели моего блога, сегодня мы с вами рассмотрим пример того, как поставить к себе на сайт скрипт кнопки мне нравиться от автора SingMen, в данном решении мы не будем использовать какой либо php или сторонние сайты или ещё хуже, задействовать целый модуль на вашем сайте, всё просто как дважды два.

Решение очень простое, мы заменим наш рейтинг новости, на кнопку мне нравиться которая версталась мной под DOCTYPE 1.1, я решил с нуля создать свою стилизацию кнопок

Для начало нам стоит удалить старый код рейтинга:

Code
<?if($RATING$)?><div style="float:right"><?$RSTARS$('12','/.s/img/stars/3/12.png','1','float')?></div><?endif?>


и за место него установить следующий код нужного модуля вашего сайта:

Для раздела новости (news)

Code
<?if($RATING$)?>  
  <div id="rating_os">  
  <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})};});">  
  <div id="rating_l">Mне нравится</div>  
  </a>  
  <div id="rating_p">+$RATED$</div>  
  </div>  
  <?endif?>


Для раздела каталог статей (publ)

Code
<?if($RATING$)?>  
  <div id="rating_os">  
  <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})};});">  
  <div id="rating_l">Mне нравится</div>  
  </a>  
  <div id="rating_p">+$RATED$</div>  
  </div>  
  <?endif?>


Для раздела каталог файлов (load)

Code
<?if($RATING$)?>  
  <div id="rating_os">  
  <a href="javascript://" id="golike" onclick="$.get('/load/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})};});">  
  <div id="rating_l">Mне нравится</div>  
  </a>  
  <div id="rating_p">+$RATED$</div>  
  </div>  
  <?endif?>


Для раздела каталог сайтов (dir)

Code
<?if($RATING$)?>  
  <div id="rating_os">  
  <a style="text-decoration: none;" href="javascript://" id="golike" onclick="$.get('/dir/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})};});">  
  <div id="rating_l">Mне нравится</div>  
  </a>  
  <div id="rating_p">+$RATED$</div>  
  </div>  
  <?endif?>


Для раздела блог (blog)

Code
<?if($RATING$)?>  
  <div id="rating_os">  
  <a href="javascript://" id="golike" onclick="$.get('/blog/0-0-1-$ID$-14-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})};});">  
  <div id="rating_l">Mне нравится</div>  
  </a>  
  <div id="rating_p">+$RATED$</div>  
  </div>  
  <?endif?>


Для раздела доска объявлений (board)

Code
<?if($RATING$)?>  
  <div id="rating_os">  
  <a href="javascript://" id="golike" onclick="$.get('/board/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})};});">  
  <div id="rating_l">Mне нравится</div>  
  </a>  
  <div id="rating_p">+$RATED$</div>  
  </div>  
  <?endif?>


Для раздела Фотоальбом (photo)

Code
<?if($RATING$)?>  
  <div id="rating_os">  
  <a href="javascript://" id="golike" onclick="$.get('/photo/1-1-$ID$-13-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})};});">  
  <div id="rating_l">Mне нравится</div>  
  </a>  
  <div id="rating_p">+$RATED$</div>  
  </div>  
  <?endif?>


Теперь нам следует выбрать один из пяти вариантов стилизации кнопки:

Вариант № 1 White (Белый):



Code
/* Mне нравится  
  ------------------------------------------*/  
  #rating_os {  
  float:right;  
  font: 11px Verdana,Arial,Helvetica, sans-serif;  
  color:#777; text-shadow: 1px 1px 1px #fff;  
  background:#f6f6f6;  
  border: 1px solid #d6d6d6;  
  }  

  #rating_os a:link,  
  #rating_os a:visited,  
  #rating_os a:hover {text-decoration:none; color:#999;}  

  #rating_l {  
  float:left;  
  background: url(http://webo4ka.ru/Ucoz5/ugol_white_knopka_mne_nravitci_ucoz.png) no-repeat right;  
  padding: 3px 10px 3px 5px;  
  }  

  #rating_l:hover {  
  background: #fff url(http://webo4ka.ru/Ucoz5/ugol_white_knopka_mne_nravitci_ucoz.png) no-repeat right;  
  }  

  #rating_p {  
  float:right;  
  padding: 3px 5px 3px 5px;  
  background:#e3e3e3;  
  }


Вариант № 2 Black (Чёрный):



Code
/* Mне нравится  
  ------------------------------------------*/  
  #rating_os {  
  float:right;  
  font: 11px Verdana,Arial,Helvetica, sans-serif;  
  color:#a7a7a7; text-shadow: 1px 1px 1px #252525;  
  background:#484848;  
  border: 1px solid #252525;  
  }  

  #rating_os a:link,  
  #rating_os a:visited,  
  #rating_os a:hover {text-decoration:none; color:#a7a7a7;}  

  #rating_l {  
  float:left;  
  background: url(http://webo4ka.ru/Ucoz5/ugol_black_knopka_mne_nravitci_ucoz.png) no-repeat right;  
  padding: 3px 10px 3px 5px;  
  }  

  #rating_l:hover {  
  background: #5d5d5d url(http://webo4ka.ru/Ucoz5/ugol_black_knopka_mne_nravitci_ucoz.png) no-repeat right;  
  }  

  #rating_p {  
  float:right;  
  padding: 3px 5px 3px 5px;  
  background:#6e6e6e;  
  }


Вариант № 3 Orange (Оранжевый):



Code
/* Mне нравится  
  ------------------------------------------*/  
  #rating_os {  
  float:right;  
  font: 11px Verdana,Arial,Helvetica, sans-serif;  
  color:#fff;  
  background:#ffe5cd;  
  border: 1px solid #ffa24a;  
  }  

  #rating_os a:link,  
  #rating_os a:visited,  
  #rating_os a:hover {text-decoration:none; color:#ff891a; text-shadow: 1px 1px 1px #fff; }  

  #rating_l {  
  float:left;  
  background: url(http://webo4ka.ru/Ucoz5/ugol_orange_knopka_mne_nravitci_ucoz.png) no-repeat right;  
  padding: 3px 10px 3px 5px;  
  }  

  #rating_l:hover {  
  background: #fff3e8 url(http://webo4ka.ru/Ucoz5/ugol_orange_knopka_mne_nravitci_ucoz.png) no-repeat right;  
  }  

  #rating_p {  
  float:right;  
  text-shadow: 1px 1px 1px #ff891a;  
  padding: 3px 5px 3px 5px;  
  background:#ffd0a4;  
  }


Вариант № 4 Blue (Синий):



Code
/* Mне нравится  
  ------------------------------------------*/  
  #rating_os {  
  float:right;  
  font: 11px Verdana,Arial,Helvetica, sans-serif;  
  text-shadow: 1px 1px 1px #fff;  
  background:#dfecf4;  
  border: 1px solid #97b7ca;  
  }  

  #rating_os a:link,  
  #rating_os a:visited,  
  #rating_os a:hover {text-decoration:none; color:#2C68A6;}  

  #rating_l {  
  float:left;  
  background: url(http://webo4ka.ru/Ucoz5/ugol_blue_knopka_mne_nravitci_ucoz.png) no-repeat right;  
  padding: 3px 10px 3px 5px;  
  }  

  #rating_l:hover {  
  background: #e5f5ff url(http://webo4ka.ru/Ucoz5/ugol_blue_knopka_mne_nravitci_ucoz.png) no-repeat right;  
  }  

  #rating_p {  
  float:right;  
  color:#235e9b;  
  padding: 3px 5px 3px 5px;  
  background:#b5d9ee;  
  }


Вариант № 5 Green (Зелёный):



Code
/* Mне нравится  
  ------------------------------------------*/  
  #rating_os {  
  float:right;  
  font: 11px Verdana,Arial,Helvetica, sans-serif;  
  text-shadow: 1px 1px 1px #fff;  
  background:#cdf6ce;  
  border: 1px solid #48b543;  
  }  

  #rating_os a:link,  
  #rating_os a:visited,  
  #rating_os a:hover {text-decoration:none; color:#247e20;}  

  #rating_l {  
  float:left;  
  background: url(http://webo4ka.ru/Ucoz5/ugol_green_knopka_mne_nravitci_ucoz.png) no-repeat right;  
  padding: 3px 10px 3px 5px;  
  }  

  #rating_l:hover {  
  background: #e1fee2 url(http://webo4ka.ru/Ucoz5/ugol_green_knopka_mne_nravitci_ucoz.png) no-repeat right;  
  }  

  #rating_p {  
  float:right;  
  color:#247e20;  
  padding: 3px 5px 3px 5px;  
  background:#8bdc87;  
  }


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

Marishka
0
Marishka написал: Написано 04 Марта 2017 в 09:00
Комментарий №6
Для видео может кому пригодится:
Код
<?if($RATING$)?>  
  <div id="rating_os">  
  <a href="javascript://" id="golike" onclick="$.post('/video/', { 'a': '65', 'o_type': 'vi' , 'id': '$ID$', 'mark': '5', 'mod': 'video'}, function(data) { if($(data).text().indexOf('уже оценивали')>-1) _uWnd.alert('Вы уже оценивали данный материал!','Ошибка',{w:230,h:80,t:3000} ); else {_uWnd.alert('Ваш голос учтен!','Успех',{w:230,h:80,t:3000});$('#rating_like$ID$').text('Like <?$RATED$+1?>');}; } );">  
  <div id="rating_l">Mне нравится</div>  
  </a>  
  <div id="rating_p">+$RATED$</div>  
  </div>  
  <?endif?>

Antonij
0
Antonij написал: Написано 16 Июня 2012 в 04:09
Комментарий №5
Всем привет! Скрипт отличный, но есть один нюанс - при клике на кнопку засчитывается рейтинг 1, то есть наинизший. Что нужно исправить в коде, чтобы клик считался как оценка на 5? Подскажите, пожалуйста!

Disturbed
0
Disturbed написал: Написано 03 Июня 2012 в 04:32
Комментарий №4
Для раздела Онлайн игр (stuff) тут нету (((

Marishka
0
Marishka написал: Написано 05 Марта 2017 в 07:49
Комментарий №7
Тоже самое почти для stuff:
Код
<?if($RATING$)?>  
  <div id="rating_os">  
  <a href="javascript://" id="golike" onclick="$.post('/stuff/', { 'a':'65','id': '$ID$', 'mark': '5','mod':'stuff'}, function(data) { if($(data).text().indexOf('уже оценивали')>-1) _uWnd.alert('Вы уже оценивали данный материал!','Ошибка',{w:230,h:80,t:3000} ); else {_uWnd.alert('Ваш голос учтен!','Успех',{w:230,h:80,t:3000});$('#rating_like$ID$').text('Like <?$RATED$+1?>');}; } );">  
  <div id="rating_l">Mне нравится</div>  
  </a>  
  <div id="rating_p">+$RATED$</div>  
  </div>  
  <?endif?>

Vikon
0
Vikon написал: Написано 22 Января 2012 в 15:58
Комментарий №3
спс круто:D

BLAzER
0
BLAzER написал: Написано 27 Декабря 2011 в 10:34
Комментарий №2
Класс

Aleks
0
Aleks написал: Написано 26 Декабря 2011 в 14:37
Комментарий №1
а для профиля можна както сделать ? что бы оценивать user'a

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