Доработки магазина Simpla: «звездный» рейтинг
Дата: 05 Фев ' 11 Автор: mart Рубрики: Программирование, Файлы
В рамках работы над очередными доработками движка Simpla необходимо было добавить возможность оценки товаров каталога. Как это сейчас водится — решили делать рейтинг со звездочками. Об том и статья…
Итак, первое что надо сделать — скачать плагин голосования для Simpla. Яваскрипт положим в папку скриптов нашего сайта — у меня в корне есть папка js, куда я его и определю. Там же лежит у меня и библиотека jquery (я ее во всех шаблонах использую — полезная вещь). Картинку counter.gif ложим в папку изображений шаблона /design/[ваш_шаблон]/images. И файл counter.php закидываем в корень сайта. Подготовительные работы сделали, теперь за программную часть.
Добавим в базу поля, где мы будет хранить оценку и количество голосов за товар. Поскольку мы оценивает весь товар, а не каждую из его вариации вполне логично хранить эти данные в таблице товаров. Выполняем следующий запрос
ALTER TABLE `products` ADD `rating` FLOAT(3,1) NOT NULL DEFAULT '0' AFTER `enabled`, ADD `votes` INT NOT NULL DEFAULT '0' AFTER `rating` |
Далее добавляем отображение в шаблоне нашего модуля в шаблоне. Сначала в файла стилей вставим код отображения
.rater>span {vertical-align:top;} .rater-rating {margin-left:.8em} .rater-starsOff, .rater-starsOn {display:inline-block; height:16px; background:url(../images/rating.gif) repeat-x 0 0px;} .rater-starsOn {display:block; max-width:80px; top:0; background-position: 0 -16px;} .rater-starsHover {background-position: 0 -32px!important;} |
И теперь непосредственно выводим рейтинги в шаблон. В моем случае стояла задача голосования только в профайле товара, а в списке просто отображения рейтинга. В файл отображения списка товаров /design/[ваш_шаблон]/html/products.tpl вставляем внутри цикла
{foreach name=products item=product from=$products} ... {/foreach} |
в то место где в блоке товара хотели бы видеть рейтинг (обычно после названия товара) код вывода рейтинга
<div class="testRater clr" id="rating_{$product->product_id}" class="stat"> <div class="statVal"> <span class="rater"> <span class="rater-starsOff" style="width:80px;"><span class="rater-starsOn" style="width:{$product->rating*80/5|string_format:"%.0f"}px"></span></span> <span class="rater-rating">{$product->rating|string_format:"%.1f"}</span> (голосов <span class="rater-rateCount">{$product->votes|string_format:"%.0f"}</span>) </span> </div> </div> |
Теперь в файле профайла /design/[ваш_шаблон]/html/product.tpl также после названия выводим рейтинг и функцию вызова модуля голосования (тут нет цикла, т.к. объект $product является глобальным для данного шаблона)
<div class="testRater clr" id="rating_{$product->product_id}" class="stat"> <div class="statVal"> <span class="rater"> <span class="rater-starsOff" style="width:80px;"><span class="rater-starsOn" style="width:{$product->rating*80/5|string_format:"%.0f"}px"></span></span> <span class="rater-rating">{$product->rating|string_format:"%.1f"}</span> (голосов <span class="rater-rateCount">{$product->votes|string_format:"%.0f"}</span>) </span> </div> </div> {literal} <script src="/js/jquery.js" type="text/javascript"></script> <script src="/js/jquery.rater.js" type="text/javascript"></script> <script type="text/javascript">$(function() { $('.testRater').rater({ postHref: '/rating.php' }); });</script> {/literal} |
Если Вы нигде до этого не вызываете библиотеку JQuery, то перед вызовом скрипта рейтинга надо вызвать ее.
И последний шаг — непосредственно получения данных из базы. Для этого откроем файл Storefront.class.php в корне сайта — будем править 2 функции get_products и get_product. В них надо выбрать 2 данных — наши rating и votes из таблицы products. В основном запросе в обоих функциях сразу после
products.model |
добавляем
, products.rating, products.votes |
Вот и все — проверяйте!
P.S. Как и прежде поощрения приветствуются. Это позволит реализовывать новые примочки и выкладывать. Кошельки справа.
15 комментариев
-
Игорь
13|Фев|2011 1Спасибо за решение, недавно о реализации звезд задумывался, а тут все готово.
PS Хороший блог для симплаводов. Автору рекомендую для наглядности вставлять в записи демонстрационные картинки. -
Артём
13|Фев|2011 2Что-то не так со стилями, отсутствуют классы rater-rateCount, statVal
Артём проверьте свой туториал еще раз потому что он не полный! -
14|Фев|2011
3
>> Артём
На самом деле в моей теме для этих блоков не применяется оформление, если Вам надо, то Вы можете использовать для них стили. Основными стилями являются спаны звездочек. -
Noxter
18|Мар|2011 4Mart проверьте свой туториал еще раз, потому что звезды не отображаются.
Отображается лишь «0.0 (голосов 0)» и все, при этом вносить изменения в рейтинг стает невозможным при отсутствии «звезд». -
Kosjak76
15|Апр|2011 5Для того, что-бы все работало, на странице Товара надо после
Вставить
-
Женя Маркет
09|Май|2011 6mart не первый раз читаю твой блог о симпле, ты вроде бы человек грамотный и не плохо разберешься что к чему. Но я как чайник сколько раз бы не побывал реализовать все что ты пишешь не чего путного из этого не выходило.
А причина вот вем. Ты выдаешь очень мало информации, не достаточно детально все описываешь.Не знаю как у кого, но у меня в документе Storefront.class.php, сочетание: products.model встречается 3-и раза и после какого мне вставлять нужное дополнение? 🙂
Я думаю что выражу мысли многих, старайся детальнее описывать процессы которые нужно выполнять. А то складывается впечатление что твой блог адресован людям которые как и ты неплохо разбегаются во всем этом. Что в прицепе не правильно с твоей стороны, т.к. люди с подобными знаниями из без твоего блога напишут нужный код, просто у ни это хамет может чуть больше времени.
-
Евгений
09|Июн|2011 7Добрый день!
У меня аналогичная проблема, как у Noxter
Что нужно делать, чтобы исправить это?
-
Евгений
09|Июн|2011 8Kosjak76
После чего, что вставить?
-
Евгений
09|Июн|2011 9mart
Спасибо, что посмотрел! Сейчас звёздочки отображаться стали, но при наведении на них, они не активны!
http://pixs.ru/showimage/54646554pn_3216361_2328744.png
В чём может быть проблема?
-
Евгений
11|Июн|2011 10mart
а где взять файлы:
jquery.js
jquery.rater.jsкоторые указаны тут:
{literal}
$(function() { $(‘.testRater’).rater({ postHref: ‘/rating.php’ }); });
{/literal} -
Евгений
15|Июн|2011 11Всем спасибо, всё получилось!
-
Александр
14|Ноя|2011 12Все равно не работает. Звездочки не активные
-
23|Ноя|2011
13
Отпишите в асю — помогу.
-
Alexs
10|Апр|2017 14Здравствуйте. Скажите, это только у меня проблемы с файлами Simpla. В моем пакете Simpla 2.3.7 нету файла Storefront.class.php в корне файла. Где те функции get_product и get_products. В итоге не получается посмотреть на работу этого модуля.
-
16|Апр|2017
15
К сожалению я уже не слежу за обновлениями Симплы — вам больше смогут помочь на форуме. Извините…