Зведючий скрипт uCoz рейтинга

система uсoz, 06.02.2009 Пятница, 09:59
Теги: скрипты uCoz, РЕЙТИНГ, БЛОГ
     Мой очередной customize под uCoz. На этот раз я решил взяться за оформление рейтинга материалов дабы привести его в нормальный вид. Результат того, что у меня получилось вы видите в моем блоге. Изначально скрипт был разработан только под модуль блога, но по просьбе пользователей скрипт оптимизирован под работу во всех модулях имеющих рейтинг! Итак, что нужно для установки? Во первых 3 картинки со звездочками:

Первая звездочка - текущий рейтинг, вторая - при наведении мыши, третья - не набранный рейтинг. У меня в блоге они соответственно золотая, зеленая и серая. Файлы звезд должны лежать в одной папке и быть в формате png. Можно скачать мои звезды. Потом я выложу ещё несколько наборов. Далее необходимо скачать сам скрипт и подключить его в нужном модуле. Для этого скачайте скрипт к себе на сайт: Архив со скриптом , а на страницы в шапку добавьте строку (где укажите путь до скрипта на своём сайте):
Code
<script type="text/javascript" src="путь до скрипта/ad_rating.js"></script>
Потом откройте редактирование скрипта в файловом менеджере (можно отредактировать скрипт ещё до загрузки на сайт) и пропишите адрес папки со звездочками на вашем сайте. Если вам понравились мои звездочки, можете вообще в скрипте ничего не менять! Так же в скрипте можно настроить появление текстового описания (true/false) и название каждой из 5 оценок. Затем откройте шаблон "вид материалов" нужного из 7 поддерживаемых скриптом модулей (доска объявлений, новости, блог, каталог файлов, каталог статей, каталог фотографий, каталог сайтов) и в то место, где у вас должна стоять форма рейтинга, вставьте код:
Code
<style>
.ratingWrapper {text-align:left;width:150px;height:12px;color:#999999;font-size:10px;font-family:trebuchet MS,arial,verdana;}
.ratingWrapper img {border:none;cursor:pointer;vertical-align: middle;}
.ratingText {float:right;font-weight:bold;}
</style>
<div class="ratingWrapper">
<img src="http://studioad.ru/images/stars/off.png" id="$ID$1" onclick="rate(this)" onmouseover="on(this)" onmouseout="off(this,$RATING_NUM$)"/><img src="http://studioad.ru/images/stars/off.png" id="$ID$2" onclick="rate(this)" onmouseover="on(this)" onmouseout="off(this,$RATING_NUM$)"/><img src="http://studioad.ru/images/stars/off.png" id="$ID$3" onclick="rate(this)" onmouseover="on(this)" onmouseout="off(this,$RATING_NUM$)"/><img src="http://studioad.ru/images/stars/off.png" id="$ID$4" onclick="rate(this)" onmouseover="on(this)" onmouseout="off(this,$RATING_NUM$)"/><img src="http://studioad.ru/images/stars/off.png" id="$ID$5" onclick="rate(this)" onmouseover="on(this)" onmouseout="off(this,$RATING_NUM$)"/><span class="ratingText" id="$ID$rt">Твой голос!</span>
</div>
<script>
set($RATING_NUM$,$ID$,"blog");
</script>
В данном коде необходимо изменить адреса картинок (в 5 местах) на картинки на вашем сайте (или оставьте всё как есть, если хотите использовать мои звездочки) и ОБЯЗАТЕЛЬНО указать в строке set($RATING_NUM$,$ID$,"blog"); название модуля в который вы устанавливаете скрипт, маленькими буквами в кавычках (одно из: blog, dir, board, load, news, publ, photo). Вот в принципе и всё.

Возможные варианты ошибок:

1. Звезды отображаются, но не отображается текущий рейтинг и не реагирует на нажатия и проведение мышки.
Причина: убедитесь что вы указали название модуля, в котором размещен скрипт! Убедитесь что вы правильно подключили скрипт на страницу. Проверьте правильность вставки кода.

2. Звезды и текущий рейтинг появились, но не реагируют /не правильно реагируют на наведение мыши, не происходит голосование при клике.
Причина: убедитесь, что шаблон, в который вы вставляете скрипт, поддерживает условные коды $ RATING_NUM $ и $ ID $ - если в списке шаблона нет одного из этих кодов, значит голосование в нем не возможно и вы вставляете скрипт не туда.

3. Звезды распологаются в 2 строчки, в столбик.
Причина: это может происходить в том случае, если вы используете свои звезды большего размера, или если вы назначили оценкам длинные записи. Чтобы исправить ошибку, увеличте ширину блока .ratingWrapper.

4. Меня раздражают эти мелькающие названия оценок, как их убрать совсем?
Решение: для начала в скрипте напишите false в параметре words, затем из кода, который необходимо вставлять в "вид материалов" удалите строку

Code
<span class="ratingText" id="$ID$rt">Твой голос!</span>
Затем отрегулируйте ширину .ratingWrapper.

5. Так же вы можете почитать или разместить объявления в Валдае. Я не до конца уверен в эффективности данного шага применительно к моему скрипту, но почему бы и нет?

Скрипт написан на чистом js , проверен и работает в Google Chrome, Safari, Mozilla FF, IE7 (5-6), Opera. Скрипт - opensource. Библиотек не использует. Жду комментов!


Жми на пятую!
305, 5, 72818
№5
Черемушкин Илья
[sayto]keks[/sayto], все как написано делай.
З.Ы. а html сайт бывает не обычный %) ?
№4
47
скрипт работает,но есть один баг,который прочтя все коменты не нашел на него ответа,в самой первой новости,оценка материала не отображается,точнее,материал оценен,но показывает что нет,стоит только навести на него и все нормально,и так в любом разделе самая первая новость, как это исправить?
Ответ: Поставить скрипт правильно.
№3
Aleko
[sayto]Вот и я[/sayto], if confirm убрать и всё. Делов то.
№2
Aleko
[sayto]VIper[/sayto], исправил, спасибо.
№1
Александр
Пример на главной странице моего блога после каждой новости зелененьким желтеется =)
    © Блог StudioAD.ru 2024 год нашей эры. Не все права защищены... Копирование любой информации и материалов с обратной ссылкой приветствуется! Хостинг от uCoz.

    Если вам пришлись по душе материалы моего блога - подпишитесь на RSS дабы получать обновления незамедлительно! Я рад что вы читаете и комментируете мои экзерсисы, приятного времяпрепровождения.