Перейти до вмісту
Пошук в
  • Детальніше...
Шукати результати, які ...
Шукати результати в ...

[Решено] Рейтинг при написании отзывов


Recommended Posts

Увидел вот такую нужную штуку на сайте розетке

 

Суть заключается вот в чем:

 

Выбор рейтинга к товару звездами. 

 

JvbggusrQZk.jpg

 

У меня стандартно 

 

ID-PK8VTBGg.jpg

 

Как сделать такой рейтинг на розетке? т.е. звездачками. при наводе на них они становятся активными. 

 

мой сайт 

Змінено користувачем Electr0n
Надіслати
Поділитися на інших сайтах


У Вас хороший модуль, но пока что не расспологаю бюджетом на его покупку. 

 

Хотелось бы отдельное решение.

Змінено користувачем afwollis
Надіслати
Поділитися на інших сайтах


для 2x

скачайте bootstrap-rating.js и bootstrap-rating.css, подключите их в header.tpl

после в product.tpl

замените

              <?php echo $entry_bad; ?> 
                    <input type="radio" name="rating" value="1" />
                     
                    <input type="radio" name="rating" value="2" />
                     
                    <input type="radio" name="rating" value="3" />
                     
                    <input type="radio" name="rating" value="4" />
                     
                    <input type="radio" name="rating" value="5" />
                     <?php echo $entry_good; ?>

на

<input type="hidden" name="rating" value="4" class="rating-tooltip"/>

и добавьте скрипт

    <script>
      $(function () {
        $('.rating-tooltip').rating({
          extendSymbol: function (rate) {
            $(this).tooltip({
              container: 'body',
              placement: 'bottom',
              title: 'Rate ' + rate
            });
          }
        });
 
      });
    </script>
  • +1 1
Надіслати
Поділитися на інших сайтах

здесь смотрите

или здесь

 

Спасибо за наводку на решение .Сделал вот так: 

 

Как вариант, можете попробовать следующий код.

 

В шаблоне заменяем код, указанные вначале поста, на следующий

<b><?php echo $entry_rating; ?></b><br />

<div class="rating">

<div class="rate">

<div class="rate-1"></div>

<div class="rate-2"></div>

<div class="rate-3"></div>

<div class="rate-4"></div>

<div class="rate-5"></div>

</div>

<span>

<span class="rate-1"><?php echo $entry_bad; ?></span>

<span class="rate-2"><?php echo $entry_not_bad; ?></span>

<span class="rate-3"><?php echo $entry_normal; ?></span>

<span class="rate-4"><?php echo $entry_good; ?></span>

<span class="rate-5"><?php echo $entry_very_good; ?></span>

</span>

<input type="hidden" name="rating" value="0" />

</div>

<script type="text/javascript"><!--

$(document).ready(function() {

$('.rate div').mouseenter( function() {

var rate = $(this).attr('class').slice(-1);

changeRate($(this).parent(), rate);

}).click( function() {

var rate = $(this).attr('class').slice(-1);

var curVal = $('input[name=rating]').val();

rate = (rate != curVal) ? rate : 0;

$('input[name=rating]').val(rate);

changeRate($(this).parent(), rate);

});

$('.rate').mouseleave( function() {

var rate = $('input[name=rating]').val();

changeRate($(this), rate);

});

changeRate = function(obj, rate) {

var position = rate * 18;

obj.css('background-position', '0px -' + position + 'px');

$('.rating > span > span').each( function() {

$( this ).css('display', 'none');

});

$('.rating > span > span.rate-' + rate).css('display', 'inline-block');

}

});//--></script>

Кроме того, нужно найти строку

data: 'name=' + encodeURIComponent($('input[name=\'name\']').val()) + '&text=' + encodeURIComponent($('textarea[name=\'text\']').val()) + '&rating=' + encodeURIComponent($('input[name=\'rating\']:checked').val() ? $('input[name=\'rating\']:checked').val() : '') + '&captcha=' + encodeURIComponent($('input[name=\'captcha\']').val()),

и заменить ее на

data: 'name=' + encodeURIComponent($('input[name=\'name\']').val()) + '&text=' + encodeURIComponent($('textarea[name=\'text\']').val()) + '&rating=' + encodeURIComponent($('input[name=\'rating\']').val() ? $('input[name=\'rating\']').val() : '') + '&captcha=' + encodeURIComponent($('input[name=\'captcha\']').val()),

В таблицу стилей добавляем:

#tab-review .rating {

display: inline-block;

}

#tab-review .rating > div {

display: inline-block;

float: left;

width: 85px;

height: 18px;

margin-right: 10px;

background: url('../image/stars.png') 0 0 no-repeat transparent;

}

#tab-review .rating > div > div {

float: left;

width: 15px;

height: 15px;

margin: 2px 2px 0 0;

cursor: pointer;

}

#tab-review .rating > span {

display: inline-block;

font: normal 12px/18px Arial, Helvetica, sans-serif;

}

#tab-review .rating > span > span {

display: none;

}

В контроллер добавляем:

$this->data['entry_bad'] = $this->language->get('entry_bad');

$this->data['entry_not_bad'] = $this->language->get('entry_not_bad');

$this->data['entry_normal'] = $this->language->get('entry_normal');

$this->data['entry_good'] = $this->language->get('entry_good');

$this->data['entry_very_good'] = $this->language->get('entry_very_good');

Там уже должны быть две строки для entry_bad и entry_good. Их можно просто заменить.

 

 

В файле локализации заменяем:

$_['entry_good'] = 'Хорошо';

$_['entry_bad'] = 'Плохо';

на

$_['entry_bad'] = 'ужасно';

$_['entry_not_bad'] = 'плохо';

$_['entry_normal'] = 'средне';

$_['entry_good'] = 'хорошо';

$_['entry_very_good'] = 'отлично';

Во вложении спрайт со звездочками.

 

P.S. Писал код за пару часов, так что за то, что это оптимальное решение не ручаюсь.

Прикрепленные изображения
  • stars.png

Функционал работает, но с верской не могу разобраться не как. 

Пытался изображения подогнать. Не получилось.

сайт

Надіслати
Поділитися на інших сайтах


  • 1 year later...

 

для 2x

скачайте bootstrap-rating.js и bootstrap-rating.css, подключите их в header.tpl

после в product.tpl

замените

              <?php echo $entry_bad; ?> 
                    <input type="radio" name="rating" value="1" />
                     
                    <input type="radio" name="rating" value="2" />
                     
                    <input type="radio" name="rating" value="3" />
                     
                    <input type="radio" name="rating" value="4" />
                     
                    <input type="radio" name="rating" value="5" />
                     <?php echo $entry_good; ?>

на

<input type="hidden" name="rating" value="4" class="rating-tooltip"/>

и добавьте скрипт

    <script>
      $(function () {
        $('.rating-tooltip').rating({
          extendSymbol: function (rate) {
            $(this).tooltip({
              container: 'body',
              placement: 'bottom',
              title: 'Rate ' + rate
            });
          }
        });
 
      });
    </script>

Спасибо)

Надіслати
Поділитися на інших сайтах


Створіть аккаунт або увійдіть для коментування

Ви повинні бути користувачем, щоб залишити коментар

Створити обліковий запис

Зареєструйтеся для отримання облікового запису. Це просто!

Зареєструвати аккаунт

Вхід

Уже зареєстровані? Увійдіть тут.

Вхід зараз
  • Зараз на сторінці   0 користувачів

    • Ні користувачів, які переглядиють цю сторінку
×
×
  • Створити...

Important Information

На нашому сайті використовуються файли cookie і відбувається обробка деяких персональних даних користувачів, щоб поліпшити користувальницький інтерфейс. Щоб дізнатися для чого і які персональні дані ми обробляємо перейдіть за посиланням . Якщо Ви натиснете «Я даю згоду», це означає, що Ви розумієте і приймаєте всі умови, зазначені в цьому Повідомленні про конфіденційність.