Prestashop 1.6 Добавление в корзину без окна, а с анимацией

Тема в разделе "PrestaShop", создана пользователем sai_NT, 8 мар 2019.

Информация :
Приветствую гость, обрати внимание! Темы которые закреплены в разделах, в скором времени будут откреплены. Правила раздела PrestaShop

(Не актуальные темы) Каталоги:Модули PrestaShop 1.7Модули PrestaShop 1.5 - 1.6Шаблоны PrestaShop 1.7Шаблоны PrestaShop 1.5 - 1.6
(Не актуальные темы) Поиск / Запросы:Модули PrestaShop 1.7Модули PrestaShop 1.5 - 1.6Шаблоны PrestaShop 1.7Шаблоны PrestaShop 1.5 - 1.6
Полезная информация:Поддержка и помощь c PrestaShopУбираем ПрестаТраст, стучалки и прочую рекламуСовместные покупки модулей и шаблоновПеревод Prestashop и модулей
Модераторы: trace
  1. sai_NT

    sai_NT Постоялец

    Регистр.:
    10 фев 2007
    Сообщения:
    52
    Симпатии:
    58
    Ищу решение как преобразить и сделать удобней добавление в корзину товара. Считаю открытие попап-окна не юзерфрендли и хотел бы что-то наподобие флай эффекта или другую анимацию, чтобы покупателю не приходилось нажимать кнопку «Продолжить покупки».
    Буду рад вашей помощи.
     
  2. vitos1401

    vitos1401

    Регистр.:
    3 ноя 2012
    Сообщения:
    181
    Симпатии:
    283
    Приветствую! Посмотрите в сторону шаблона Warehouse .. Там есть возможность переключить pop-up окно на simple fly одним кликом мыши.. И покупателю не придется нажимать "Продолжить покупки"
     
    zen1, _sashok и sai_NT нравится это.
  3. sai_NT

    sai_NT Постоялец

    Регистр.:
    10 фев 2007
    Сообщения:
    52
    Симпатии:
    58
    Благодарю. Гляну демку. Но у меня есть уже шаблон и не хотел бы его менять.
     
  4. sai_NT

    sai_NT Постоялец

    Регистр.:
    10 фев 2007
    Сообщения:
    52
    Симпатии:
    58
    Пересмотрел все демки и не нашел в шаблоне Warehouse анимации при добавлении в корзину.
     
  5. zen1

    zen1

    Регистр.:
    6 дек 2016
    Сообщения:
    895
    Симпатии:
    1.693
    Hi This option you had it in the shopping cart module
     
  6. Belena27089

    Belena27089

    Регистр.:
    16 авг 2016
    Сообщения:
    457
    Симпатии:
    346
    sai_NT нравится это.
  7. zen1

    zen1

    Регистр.:
    6 дек 2016
    Сообщения:
    895
    Симпатии:
    1.693
    you have to modify 2 files ( ajax-cart.js ) ( product-list.tpl )
     
  8. Belena27089

    Belena27089

    Регистр.:
    16 авг 2016
    Сообщения:
    457
    Симпатии:
    346
    я правлю только blockcart.tpl, убираю вывод layer_cart , анимация уже на любителя прикручивается
     
    sai_NT нравится это.
  9. zen1

    zen1

    Регистр.:
    6 дек 2016
    Сообщения:
    895
    Симпатии:
    1.693
    what theme do you use ?
     
  10. Freiserk

    Freiserk Постоялец

    Регистр.:
    17 янв 2019
    Сообщения:
    76
    Симпатии:
    291
    Hi.

    Test with this:

    For Prestashop 1.6.1.23

    Files to edit:

    1º -> themes > xxxxx > product-list.tpl
    2º -> themes > xxxxx > js > modules > blockcart > ajax-cart.js
    3º -> themes > xxxxx > css > global.css

    We proceed:

    1st - Open product.list.tpl and on line 163 approximately we look for the following code:

    PHP:
    <span>{l s='Add to cart'}</span>
    We replace it with this:

    PHP:
    <span onClick="this.innerHTML='{l s='-AÑADIDO-'}'; return false" onmouseout="this.innerHTML='Add to cart';">{l s='Add to cart'}</span>
    Further down on line 167 we will see the same code mentioned above:

    PHP:
    <span>{l s='Add to cart'}</span>
    We also replace it with the following:

    PHP:
    <span onClick="this.innerHTML='{l s='-ADD-'}'; return false" onmouseout="this.innerHTML='Add to cart';">{l s='Add to cart'}</span>
    NOTE: The following part of code: {l s = '- ADDED-'} must be translated, since once the client presses the button to add to the basket, it is like the confirmation that it is added correctly.

    2nd - We open ajax-cart.js and in line 329 approximately we look for the following code:

    PHP:
    success: function(jsonData,textStatus,jqXHR)
                {
    Right below we add the following code:

    PHP:
    // add the picture to the cart
        
    var $element = $(callerElement).parent().parent().parent().find('a.product_image img,a.product_img_link img');
        if (!
    $element.length)
            
    $element = $('#bigpic');
        var 
    $picture $element.clone();
        var 
    pictureOffsetOriginal $element.offset();
        
    pictureOffsetOriginal.right = $(window).innerWidth() - pictureOffsetOriginal.left $element.width();

        if (
    $picture.length)
        {
            
    $picture.css({
                
    position'absolute',
                
    toppictureOffsetOriginal.top,
                
    rightpictureOffsetOriginal.right
            
    });
        }

        var 
    pictureOffset $picture.offset();
        var 
    cartBlock = $('#cart_block');
        if (!$(
    '#cart_block')[0] || !$('#cart_block').offset().top || !$('#cart_block').offset().left)
            
    cartBlock = $(parent.document).find('.shopping_cart');
        var 
    cartBlockOffset cartBlock.offset();
        
    cartBlockOffset.right = $(window).innerWidth() - cartBlockOffset.left cartBlock.width();

        
    // Check if the block cart is activated for the animation
        
    if (cartBlockOffset != undefined && $picture.length)
        {
            
    $picture.appendTo('body');
            
    $picture
                
    .css({
                    
    position'absolute',
                    
    toppictureOffsetOriginal.top,
                    
    rightpictureOffsetOriginal.right,
                    
    zIndex9999
                
    })
                .
    animate({
                    
    width$element.attr('width')*0.66,
                    
    height$element.attr('height')*0.66,
                    
    opacity0.2,
                    
    topcartBlockOffset.top 30,
                    
    rightcartBlockOffset.right 15
                
    }, 1000)
                .
    fadeOut(100, function() {
                    
    ajaxCart.updateCartInformation(jsonDataaddedFromProductPage);
                    $(
    this).remove();
                });
        }
    3rd - Open the global.css file and at the end add the following code:

    PHP:
    #layer_cart, .layer_cart_overlay {
    displaynoneimportant;
    }
    To finish, we cleaned the browser cache, cleaned the prestashop smarty cache and it should work correctly.

    The edited files are attached.
     

    Вложения:

    • fly2cart.zip
      Размер файла:
      46,9 КБ
      Просмотров:
      7
    Последнее редактирование: 10 мар 2019
    sai_NT, Belena27089, zen1 и ещё 1-му нравится это.