Автор Тема: Отображение списка товаров  (Прочитано 3048 раз)

27 Ноябрь 2014, 14:54:19
  • Новичок
  • *
  • Сообщений: 2
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Как в prestashop 1.6 сделать отображение товаров в категориях списком? Чтобы выглядел таким же, как в админке
27 Ноябрь 2014, 15:05:40
Ответ #1
  • Ветеран
  • *****
  • Сообщений: 22125
  • Репутация: +25303/-1
  • Prestashop - просто и эффективно
    • Просмотр профиля
В файле /themes/default-bootstrap/js/global.js можно поменять вид list/grid в функции  bindGrid()
Эксперт Prestashop - решения всех проблем, написание модулей, создание тем для интернет-магазинов под Prestashop.
Эксперт Magento - создам сайт на Magento, программирование кастомных модулей для Magento, кастомизация тем Magento.
Лучшие цены!!!
27 Ноябрь 2014, 15:38:27
Ответ #2
  • Новичок
  • *
  • Сообщений: 2
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Видел этот вариант в гугле. Но выколите мне глаза, если там это есть
/*
* 2007-2014 PrestaShop
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* [url=http://prestashop-forum.ru/redgo.php?url=http://prestashop-forum.ru/redgo.php?url=http://opensource.org/licenses/afl-3.0.php]http://opensource.org/licenses/afl-3.0.php[/url]
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to [email]license@prestashop.com[/email] so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to [url=http://prestashop-forum.ru/redgo.php?url=http://prestashop-forum.ru/redgo.php?url=http://www.prestashop.com]http://www.prestashop.com[/url] for more information.
*
*  @author PrestaShop SA <[email]contact@prestashop.com[/email]>
*  @copyright  2007-2014 PrestaShop SA
*  @license    [url=http://prestashop-forum.ru/redgo.php?url=http://prestashop-forum.ru/redgo.php?url=http://opensource.org/licenses/afl-3.0.php]http://opensource.org/licenses/afl-3.0.php[/url]  Academic Free License (AFL 3.0)
*  International Registered Trademark & Property of PrestaShop SA
*/
//global variables
var responsiveflag = false;

$(document).ready(function(){
   highdpiInit();
   responsiveResize();
   $(window).resize(responsiveResize);
   if (navigator.userAgent.match(/Android/i))
   {
      var viewport = document.querySelector('meta[name="viewport"]');
      viewport.setAttribute('content', 'initial-scale=1.0,maximum-scale=1.0,user-scalable=0,width=device-width,height=device-height');
      window.scrollTo(0, 1);
   }
   blockHover();
   if (typeof quickView !== 'undefined' && quickView)
      quick_view();
   dropDown();

   if (typeof page_name != 'undefined' && !in_array(page_name, ['index', 'product']))
   {
      bindGrid();

       $(document).on('change', '.selectProductSort', function(e){
         if (typeof request != 'undefined' && request)
            var requestSortProducts = request;
          var splitData = $(this).val().split(':');
         if (typeof requestSortProducts != 'undefined' && requestSortProducts)
            document.location.href = requestSortProducts + ((requestSortProducts.indexOf('?') < 0) ? '?' : '&') + 'orderby=' + splitData[0] + '&orderway=' + splitData[1];
       });

      $(document).on('change', 'select[name="n"]', function(){
         $(this.form).submit();
      });

      $(document).on('change', 'select[name="manufacturer_list"], select[name="supplier_list"]', function() {
         if (this.value != '')
            location.href = this.value;
      });

      $(document).on('change', 'select[name="currency_payement"]', function(){
         setCurrency($(this).val());
      });
   }

   $(document).on('click', '.back', function(e){
      e.preventDefault();
      history.back();
   });
   
   jQuery.curCSS = jQuery.css;
   if (!!$.prototype.cluetip)
      $('a.cluetip').cluetip({
         local:true,
         cursor: 'pointer',
         dropShadow: false,
         dropShadowSteps: 0,
         showTitle: false,
         tracking: true,
         sticky: false,
         mouseOutClose: true,
         fx: {             
             open:       'fadeIn',
             openSpeed:  'fast'
         }
      }).css('opacity', 0. 8) ;

   if (!!$.prototype.fancybox)
      $.extend($.fancybox.defaults.tpl, {
         closeBtn : '<a title="' + FancyboxI18nClose + '" class="fancybox-item fancybox-close" href="javascript:;"></a>',
         next     : '<a title="' + FancyboxI18nNext + '" class="fancybox-nav fancybox-next" href="javascript:;"><span></span></a>',
         prev     : '<a title="' + FancyboxI18nPrev + '" class="fancybox-nav fancybox-prev" href="javascript:;"><span></span></a>'
      });
});

function highdpiInit()
{
   if($('.replace-2x').css('font-size') == "1px")
   {     
      var els = $("img.replace-2x").get();
      for(var i = 0; i < els.length; i++)
      {
         src = els[i].src;
         extension = src.substr( (src.lastIndexOf('.') +1) );
         src = src.replace("." + extension, "2x." + extension);
         
         var img = new Image();
         img.src = src;
         img.height != 0 ? els.src = src : els.src = els.src;
      }
   }
}


// Used to compensante Chrome/Safari bug (they don't care about scroll bar for width)
function scrollCompensate()
{
    var inner = document.createElement('p');
    inner.style.width = "100%";
    inner.style.height = "200px";

    var outer = document.createElement('div');
    outer.style.position = "absolute";
    outer.style.top = "0px";
    outer.style.left = "0px";
    outer.style.visibility = "hidden";
    outer.style.width = "200px";
    outer.style.height = "150px";
    outer.style.overflow = "hidden";
    outer.appendChild(inner);

    document.body.appendChild(outer);
    var w1 = inner.offsetWidth;
    outer.style.overflow = 'scroll';
    var w2 = inner.offsetWidth;
    if (w1 == w2) w2 = outer.clientWidth;

    document.body.removeChild(outer);

    return (w1 - w2);
}

function responsiveResize()
{
   compensante = scrollCompensate();
   if (($(window).width()+scrollCompensate()) <= 767 && responsiveflag == false)
   {
      accordion('enable');
       accordionFooter('enable');
      responsiveflag = true;   
   }
   else if (($(window).width()+scrollCompensate()) >= 768)
   {
      accordion('disable');
      accordionFooter('disable');
       responsiveflag = false;
   }
   if (typeof page_name != 'undefined' && in_array(page_name, ['category']))
      resizeCatimg();
}

function blockHover(status)
{
   $(document).off('mouseenter').on('mouseenter', '.product_list.grid li.ajax_block_product .product-container', function(e){

      if ($('body').find('.container').width() == 1170)
      {
         var pcHeight = $(this).parent().outerHeight();
         var pcPHeight = $(this).parent().find('.button-container').outerHeight() + $(this).parent().find('.comments_note').outerHeight() + $(this).parent().find('.functional-buttons').outerHeight();
         $(this).parent().addClass('hovered').css({'height':pcHeight + pcPHeight, 'margin-bottom':pcPHeight * (-1)});
      }
   });

   $(document).off('mouseleave').on('mouseleave', '.product_list.grid li.ajax_block_product .product-container', function(e){
      if ($('body').find('.container').width() == 1170)
         $(this).parent().removeClass('hovered').css({'height':'auto', 'margin-bottom':'0'});
   });
}

function quick_view()
{
   $(document).on('click', '.quick-view:visible, .quick-view-mobile:visible', function(e)
   {
      e.preventDefault();
      var url = this.rel;
      if (url.indexOf('?') != -1)
         url += '&';
      else
         url += '?';

      if (!!$.prototype.fancybox)
         $.fancybox({
            'padding':  0,
            'width':    1087,
            'height':   610,
            'type':     'iframe',
            'href':     url + 'content_only=1'
         });
   });
}

function bindGrid()
{
   var view = $.totalStorage('display');
   
   if (!view && (typeof displayList != 'undefined') && displayList)
      view = 'list';

   if (view && view != 'grid')
      display(view);
   else
      $('.display').find('li#grid').addClass('selected');
   
   $(document).on('click', '#grid', function(e){
      e.preventDefault();
      display('grid');
   });

   $(document).on('click', '#list', function(e){
      e.preventDefault();
      display('list');
   });
}

function display(view)
{
   if (view == 'list')
   {
      $('ul.product_list').removeClass('grid').addClass('list row');
      $('.product_list > li').removeClass('col-xs-12 col-sm-6 col-md-4').addClass('col-xs-12');
      $('.product_list > li').each(function(index, element) {
         html = '';
         html = '<div class="product-container"><div class="row">';
            html += '<div class="left-block col-xs-4 col-xs-5 col-md-4">' + $(element).find('.left-block').html() + '<>';
            html += '<div class="center-block col-xs-4 col-xs-7 col-md-4">';
               html += '<div class="product-flags">'+ $(element).find('.product-flags').html() + '<>';
               html += '<h5 itemprop="name">'+ $(element).find('h5').html() + '</h5>';
               var rating = $(element).find('.comments_note').html(); // check : rating
               if (rating != null) {
                  html += '<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating" class="comments_note">'+ rating + '<>';
               }
               html += '<p class="product-desc">'+ $(element).find('.product-desc').html() + '</p>';
               var colorList = $(element).find('.color-list-container').html();
               if (colorList != null) {
                  html += '<div class="color-list-container">'+ colorList +'<>';
               }
               var availability = $(element).find('.availability').html();   // check : catalog mode is enabled
               if (availability != null) {
                  html += '<span class="availability">'+ availability +'</span>';
               }
            html += '<>';   
            html += '<div class="right-block col-xs-4 col-xs-12 col-md-4"><div class="right-block-content row">';
               var price = $(element).find('.content_price').html();       // check : catalog mode is enabled
               if (price != null) {
                  html += '<div class="content_price col-xs-5 col-md-12">'+ price + '<>';
               }
               html += '<div class="button-container col-xs-7 col-md-12">'+ $(element).find('.button-container').html() +'<>';
               html += '<div class="functional-buttons clearfix col-sm-12">' + $(element).find('.functional-buttons').html() + '<>';
            html += '<>';
         html += '<><>';
      $(element).html(html);
      });     
      $('.display').find('li#list').addClass('selected');
      $('.display').find('li#grid').removeAttr('class');
      $.totalStorage('display', 'list');
   }
   else
   {
      $('ul.product_list').removeClass('list').addClass('grid row');
      $('.product_list > li').removeClass('col-xs-12').addClass('col-xs-12 col-sm-6 col-md-4');
      $('.product_list > li').each(function(index, element) {
      html = '';
      html += '<div class="product-container">';
         html += '<div class="left-block">' + $(element).find('.left-block').html() + '<>';
         html += '<div class="right-block">';
            html += '<div class="product-flags">'+ $(element).find('.product-flags').html() + '<>';
            html += '<h5 itemprop="name">'+ $(element).find('h5').html() + '</h5>';
            var rating = $(element).find('.comments_note').html(); // check : rating
               if (rating != null) {
                  html += '<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating" class="comments_note">'+ rating + '<>';
               }
            html += '<p itemprop="description" class="product-desc">'+ $(element).find('.product-desc').html() + '</p>';
            var price = $(element).find('.content_price').html(); // check : catalog mode is enabled
               if (price != null) {
                  html += '<div class="content_price">'+ price + '<>';
               }
            html += '<div itemprop="offers" itemscope itemtype="http://schema.org/Offer" class="button-container">'+ $(element).find('.button-container').html() +'<>';
            var colorList = $(element).find('.color-list-container').html();
            if (colorList != null) {
               html += '<div class="color-list-container">'+ colorList +'<>';
            }
            var availability = $(element).find('.availability').html(); // check : catalog mode is enabled
            if (availability != null) {
               html += '<span class="availability">'+ availability +'</span>';
            }
         html += '<>';
         html += '<div class="functional-buttons clearfix">' + $(element).find('.functional-buttons').html() + '<>';
      html += '<>';     
      $(element).html(html);
      });
      $('.display').find('li#grid').addClass('selected');
      $('.display').find('li#list').removeAttr('class');
      $.totalStorage('display', 'grid');
   }   
}

function dropDown()
{
   elementClick = '#header .current';
   elementSlide =  'ul.toogle_content';       
   activeClass = 'active';         

   $(elementClick).on('click', function(e){
      e.stopPropagation();
      var subUl = $(this).next(elementSlide);
      if(subUl.is(':hidden'))
      {
         subUl.slideDown();
         $(this).addClass(activeClass);   
      }
      else
      {
         subUl.slideUp();
         $(this).removeClass(activeClass);
      }
      $(elementClick).not(this).next(elementSlide).slideUp();
      $(elementClick).not(this).removeClass(activeClass);
      e.preventDefault();
   });

   $(elementSlide).on('click', function(e){
      e.stopPropagation();
   });

   $(document).on('click', function(e){
      e.stopPropagation();
      var elementHide = $(elementClick).next(elementSlide);
      $(elementHide).slideUp();
      $(elementClick).removeClass('active');
   });
}

function accordionFooter(status)
{
   if(status == 'enable')
   {
      $('#footer .footer-block h4').on('click', function(){
         $(this).toggleClass('active').parent().find('.toggle-footer').stop().slideToggle('medium');
      })
      $('#footer').addClass('accordion').find('.toggle-footer').slideUp('fast');
   }
   else
   {
      $('.footer-block h4').removeClass('active').off().parent().find('.toggle-footer').removeAttr('style').slideDown('fast');
      $('#footer').removeClass('accordion');
   }
}

function accordion(status)
{
   leftColumnBlocks = $('#left_column');
   if(status == 'enable')
   {
      $('#right_column .block .title_block, #left_column .block .title_block, #left_column #newsletter_block_left h4').on('click', function(){
         $(this).toggleClass('active').parent().find('.block_content').stop().slideToggle('medium');
      })
      $('#right_column, #left_column').addClass('accordion').find('.block .block_content').slideUp('fast');
   }
   else
   {
      $('#right_column .block .title_block, #left_column .block .title_block, #left_column #newsletter_block_left h4').removeClass('active').off().parent().find('.block_content').removeAttr('style').slideDown('fast');
      $('#left_column, #right_column').removeClass('accordion');
   }
}

function resizeCatimg()
{
   var div = $('.cat_desc').parent('div');
   var image = new Image;
   $(image).load(function(){
       var width  = image.width;
       var height = image.height;
      var ratio = parseFloat(height / width);
      var calc = Math.round(ratio * parseInt(div.outerWidth(false)));
      div.css('min-height', calc);
   });
   if (div.length)
      image.src = div.css('background-image').replace(/url\("?|"?\)$/ig, '');
}[/i]
27 Ноябрь 2014, 16:36:55
Ответ #3
  • Модератор
  • Ветеран
  • *****
  • Сообщений: 86688
  • Репутация: +25428/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Если не видите, то используйте поиск по тексту.
27 Ноябрь 2014, 16:43:22
Ответ #4
  • Модератор
  • Ветеран
  • *****
  • Сообщений: 86688
  • Репутация: +25428/-0
  • Сообщество PrestaShop
    • Просмотр профиля
02 Октябрь 2023, 15:58:28
Ответ #5
  • Новичок
  • *
  • Сообщений: 9
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
А есть решение для версии 8.1?