Количество товаров над иконкой корзины

Тема в разделе "Дизайн, оформление и шаблоны", создана пользователем Dmitriy, 8 сен 2015.

  1. Dmitriy

    Dmitriy Новичок

    Сообщения:
    8
    Симпатии:
    1
    если загрузить картинку, вместо обычной черной кнопки корзины, как сделать чтобы над картинкой показывало кол-во товаров добавленных в корзину?[​IMG]
     
    DanMir нравится это.
  2. Vlad

    Vlad Эксперт

    Сообщения:
    3.906
    Симпатии:
    938
    Для начала надо вывести само кол-во товара.
    Для этого в файле \catalog\controller\common\cart.php

    перед
    Код:
    $data['text_loading'] = $this->language->get('text_loading');
    добавим
    Код:
    $data['count'] = $this->cart->countProducts();

    а в файле шаблона \catalog\view\theme\default\template\common\cart.tpl
    добавим в нужное место, например
    Код:
    <div class="count"><?php echo $count; ?></div>
    А далее стилями как душе угодно...
     
    kommunik, Алиса и tsap нравится это.
  3. tsap

    tsap Продвинутый пользователь

    Сообщения:
    230
    Симпатии:
    130
    Vlad вдохновил, зачесались "криворуки"))

    берем catalog\controller\common\cart.php
    эту строку
    PHP:
    $data['text_items'] = sprintf($this->language->get('text_items'), $this->cart->countProducts() + (isset($this->session->data['vouchers']) ? count($this->session->data['vouchers']) : 0), $this->currency->format($total));
    меняем на эту
    PHP:
    $data['count'] = $this->cart->countProducts();
    берем
    catalog\view\theme\default\template\common\cart.tpl
    эту строку
    HTML:
    <button type="button" data-toggle="dropdown" data-loading-text="<?php echo $text_loading; ?>" class="btn btn-inverse btn-block btn-lg dropdown-toggle"><i class="fa fa-shopping-cart"></i> <span id="cart-total"><?php echo $text_items; ?></span></button>
    меняем на эту
    HTML:
     <button type="button" data-toggle="dropdown" data-loading-text="<?php echo $text_loading; ?>" class="btn btn-inverse btn-block btn-lg dropdown-toggle"><img src="catalog/view/theme/default/image/cart.png"><?php if ($count > 0) { ?><span class="count"><?php echo $count; ?></span><?php } ?></button>
    берем
    catalog\controller\checkout\cart.php
    в трех местах эту строку
    PHP:
    $json['total'] = sprintf($this->language->get('text_items'), $this->cart->countProducts() + (isset($this->session->data['vouchers']) ? count($this->session->data['vouchers']) : 0), $this->currency->format($total));

    меняем на эту
    PHP:
    $json['count'] = $this->cart->countProducts();
    берем catalog\view\theme\default\template\product\product.tpl

    эту строку
    HTML:
    $('#cart > button').html('<i class="fa fa-shopping-cart"></i> ' + json['total']);
    меняем на эту
    HTML:
    $('#cart > button').html('<img src="catalog/view/theme/default/image/cart.png"><span class="count"> ' + json['count'] + '</span>');
    берем
    catalog\view\javascript\common.js
    в этом куске
    HTML:
    // Cart add remove functions
    var cart = {
        'add': function(product_id, quantity) {
            $.ajax({
                url: 'index.php?route=checkout/cart/add',
                type: 'post',
                data: 'product_id=' + product_id + '&quantity=' + (typeof(quantity) != 'undefined' ? quantity : 1),
                dataType: 'json',
                beforeSend: function() {
                    $('#cart > button').button('loading');
                },
                complete: function() {
                    $('#cart > button').button('reset');
                },           
                success: function(json) {
                    $('.alert, .text-danger').remove();
    
                    if (json['redirect']) {
                        location = json['redirect'];
                    }
    
                    if (json['success']) {
                        $('#content').parent().before('<div class="alert alert-success"><i class="fa fa-check-circle"></i> ' + json['success'] + '<button type="button" class="close" data-dismiss="alert">&times;</button></div>');
                       
                        // Need to set timeout otherwise it wont update the total
                        setTimeout(function () {
                            $('#cart > button').html('<span id="cart-total"><i class="fa fa-shopping-cart"></i> ' + json['total'] + '</span>');
                        }, 100);
                   
                        $('html, body').animate({ scrollTop: 0 }, 'slow');
    
                        $('#cart > ul').load('index.php?route=common/cart/info ul li');
                    }
                }
            });
        },
        'update': function(key, quantity) {
            $.ajax({
                url: 'index.php?route=checkout/cart/edit',
                type: 'post',
                data: 'key=' + key + '&quantity=' + (typeof(quantity) != 'undefined' ? quantity : 1),
                dataType: 'json',
                beforeSend: function() {
                    $('#cart > button').button('loading');
                },
                complete: function() {
                    $('#cart > button').button('reset');
                },           
                success: function(json) {
                    // Need to set timeout otherwise it wont update the total
                    setTimeout(function () {
                        $('#cart > button').html('<span id="cart-total"><i class="fa fa-shopping-cart"></i> ' + json['total'] + '</span>');
                    }, 100);
    
                    if (getURLVar('route') == 'checkout/cart' || getURLVar('route') == 'checkout/checkout') {
                        location = 'index.php?route=checkout/cart';
                    } else {
                        $('#cart > ul').load('index.php?route=common/cart/info ul li');
                    }
                }
            });
        },
        'remove': function(key) {
            $.ajax({
                url: 'index.php?route=checkout/cart/remove',
                type: 'post',
                data: 'key=' + key,
                dataType: 'json',
                beforeSend: function() {
                    $('#cart > button').button('loading');
                },
                complete: function() {
                    $('#cart > button').button('reset');
                },           
                success: function(json) {
                    // Need to set timeout otherwise it wont update the total
                    setTimeout(function () {
                        $('#cart > button').html('<span id="cart-total"><i class="fa fa-shopping-cart"></i> ' + json['total'] + '</span>');
                    }, 100);
                       
                    if (getURLVar('route') == 'checkout/cart' || getURLVar('route') == 'checkout/checkout') {
                        location = 'index.php?route=checkout/cart';
                    } else {
                        $('#cart > ul').load('index.php?route=common/cart/info ul li');
                    }
                }
            });
        }
    }
    меняем эти три строки
    HTML:
    $('#cart > button').html('<span id="cart-total"><i class="fa fa-shopping-cart"></i> ' + json['total'] + '</span>');
    первая и вторая
    HTML:
    $('#cart > button').html('<img src="catalog/view/theme/default/image/cart.png"><span class="count">' + json['count'] + '</span>');
    третья
    HTML:
    if (json['count'] != 0) {
                            $('#cart > button').html('<img src="catalog/view/theme/default/image/cart.png"><span class="count">' + json['count'] + '</span>');
                        } else {
                            $('#cart > button').html('<img src="catalog/view/theme/default/image/cart.png">');
                        }
    берем catalog\view\theme\default\stylesheet\stylesheet.css

    переписываем стили
    HTML:
    /* cart */
    #cart {
        margin-bottom: 10px;
    }
    #cart > .btn {
        font-size: 12px;
        line-height: 18px;
        color: #FFF;
    }
    #cart.open > .btn {
        background-image: none;
        background-color: #FFFFFF;
        border: 1px solid #E6E6E6;
        color: #666;
        box-shadow: none;
        text-shadow: none;
    }
    #cart.open > .btn:hover {
        color: #444;
    }
    както так
    HTML:
    /* cart */
    #cart {
        margin-bottom: 10px;
    }
    #cart img {
        width: 50px;
        height: 40px;
    }
    #cart .count {
        color: #660000;
        position: absolute;
        margin: 2px 10px 20px -25px;
        font-size: 15px;
        font-weight: 600;
        border-radius: 10px;
        height: 20px;
        width: 20px;
        background: yellow;
    
    }
    #cart > .btn {
        font-size: 12px;
        line-height: 18px;
        color: #FFF;
    }
    #cart button.btn.btn-inverse {
        background: none;
        border: 0px;
    }
    #cart.open > .btn {
        background-image: none;
        background-color: none;
        border: 0px;
        color: #FFF;
        box-shadow: none;
        text-shadow: none;
    }
    #cart.open > .btn:hover {
        color: #FFF;
    }

    в итоге у меня получилось так
    img1.jpg img2.jpg
     

    Вложения:

    • cart.png
      cart.png
      Размер файла:
      9,4 КБ
      Просмотров:
      312
    LexaZ, Dasha, karpus и 9 другим нравится это.
  4. SergeyRV

    SergeyRV Новичок

    Сообщения:
    7
    Симпатии:
    0

    Спасибо, очень помогло. Я новичок и мучатся, пришлось бы долго. ))) Еще раз спасибо.
     
  5. Ecsiron

    Ecsiron Продвинутый пользователь

    Сообщения:
    415
    Симпатии:
    52
    Если бы это кто-нить в OCMOD перевел)
     
    zignatz нравится это.
  6. vikaharkov

    vikaharkov Продвинутый пользователь

    Сообщения:
    478
    Симпатии:
    61
    Из разряда свободного творчества (гулять, так гулять...)

    А не вдохновитесь ли ещё разок (например, в честь месячника "Борьбы за трезвость") шоб после попадания товара в Корзину вместо кругляшков с цифирками менялся цвет самой корзины, скажем из серого она бы превращалась в ярко-красный (я так думаю, шо для этого нужна будет вторая корзина, красная, но это уже мелочи...)
     
  7. LordShad0W

    LordShad0W Пользователь

    Сообщения:
    33
    Симпатии:
    1
    На 2.1.0.2 (rs1) не работает...
    Если корзина пустая, на кнопке пишет Undefined. (фото 1)
    Если добавить товар в корзину - кнопка пропадает, а вместо нее появляется еле видный силуэт обычной fa-fa-shoping cart и старого вида кнопка также с надписью undefined (фото 2.)
    А если просто обновить страницу, то вместо надписи undefined пишет ошибку:
    Undefined variable: text_items в файле cart.tpl

    у меня в этом файле, по инструкции:
    Код:
    <div id="cart" class="btn-group btn-block">
    <button type="button" data-toggle="dropdown" data-loading-text="<?php echo $text_loading; ?>" class="btn btn-inverse btn-block btn-lg dropdown-toggle"><img src="catalog/view/theme/default/image/cart.png"><?php if ($count > 0) { ?><span class="count"><?php echo $count; ?></span><?php } ?></button>
      <ul class="dropdown-menu pull-right">

    Тема дефолт, без изменений (только установленная), добавил все, по инструкции...
     

    Вложения:

    • 001.jpg
      001.jpg
      Размер файла:
      45,4 КБ
      Просмотров:
      73
    • 002.jpg
      002.jpg
      Размер файла:
      41,5 КБ
      Просмотров:
      74
    Последнее редактирование: 7 янв 2017
  8. solunski.d

    solunski.d Эксперт

    Сообщения:
    1.566
    Симпатии:
    428
    Я смотрю все хотят халявы) Знайте что все эти знания были получены учась и проводя опыты, это все время, а время очень дорого стоит.

    Это уже js найти 2 скрипта отвечающий за добавления товара в корзину и если json вернул "succes" то присвоить корзине новый класс, для которого прописан цвет.
     
  9. LordShad0W

    LordShad0W Пользователь

    Сообщения:
    33
    Симпатии:
    1
    Я не халявщик и никогда им не был, если это и меня касается...Также, как и немногие, потихоньку осваиваю код...Может пока знаний недостаточно, но не всё сразу...Задал вопрос, потому как в вашей инструкции, после установки выдало ошибку...Не более...
     
  10. solunski.d

    solunski.d Эксперт

    Сообщения:
    1.566
    Симпатии:
    428
    Это не вам было адресовано. Инструкция не моя.

    У вас старая версия, я не вижу смысла пытаться все это поставить на 2.1.0.2 (rs1) лучше выберете 2.3
     
  11. romali

    romali Пользователь

    Сообщения:
    69
    Симпатии:
    0
    Ребята подскажите как быть что то я уже запутался !!
    ситуация вроде как простая но не разберусь как поправить!!!
    Установлена тема http://opencart.templatemela.com/OPC08/OPC080198/OPC6/
    вроде все настроил только вот есть перекосы как поправить http://vizitm.com/
    Где что менять чтоб значок корзина была такой же как на шаблоне (убрать текст)
     

    Вложения:

  12. solunski.d

    solunski.d Эксперт

    Сообщения:
    1.566
    Симпатии:
    428
    На форуме где то есть ответ.
    1. Поменять текст в languages/название языка/common/cart.php файле
    2. Убрать в контроллере и подправить js
     
  13. romali

    romali Пользователь

    Сообщения:
    69
    Симпатии:
    0
    пробовал найти нашел только вас!!!! я не совсем понимаю пока в ОС но надеюсь вы мне подскажете!!!
     
  14. solunski.d

    solunski.d Эксперт

    Сообщения:
    1.566
    Симпатии:
    428
    Я задавал этот вопрос давно, когда столкнулся с задачей, вот тема.
     
  15. romali

    romali Пользователь

    Сообщения:
    69
    Симпатии:
    0
    Сейчас в языках поправил стало как нужно но стоит добавить товар и все надпись снова вылазит

    Там в твоей теме рекомендует править
    \catalog\controller\common\cart.php
    \catalog\controller\checkout\cart.php

    смотреть на
    $data['text_items'] =
    $json['total'] =

    что конкретно там нужно сделать (удалять или что то редактировать???
     
  16. solunski.d

    solunski.d Эксперт

    Сообщения:
    1.566
    Симпатии:
    428
    Читайте тему до конца.
    Найдите в common/cart.php
    $data['text_items'] и сделайте так чтобы она была равна
    PHP:
    $data['text_items'] = $this->cart->countProducts();
     
    Последнее редактирование: 5 апр 2017
  17. AdrianNight

    AdrianNight Новичок

    Сообщения:
    1
    Симпатии:
    0
    Если добавить в корзину товар, то добавляется в желтом кружочке количество товара. Но если удалить товар из корзины, то появляется текст null. Не пойму, как это поправить, может кто уже исправлял?
     

    Вложения:

    • null.png
      null.png
      Размер файла:
      7,4 КБ
      Просмотров:
      20
  18. zignatz

    zignatz Новичок

    Сообщения:
    7
    Симпатии:
    0
    Пытался проделать то же самое на opencart 2.3.0.2 сразу при добавлении в корзину undefined, а после перезагрузки показывается правильное количество. Подскажите, пожалуйста, в чем проблема.
     
  19. Ален

    Ален Эксперт

    Сообщения:
    2.052
    Симпатии:
    630
    проблема в js скрипте. Нужно смотреть по месту или у себя все это делать и потом вам давать ответ.
     
  20. zignatz

    zignatz Новичок

    Сообщения:
    7
    Симпатии:
    0
    Думаю да, так как изначально в нем отличаются строки, о которых говорится.
    Скрипт common.js до изменений
    загрузил c расширением txt, а то не знал, как добавить
     

    Вложения:

    • common.js.txt
      Размер файла:
      17,4 КБ
      Просмотров:
      24