Бренды на главной в теме Bestmarket
В настройках плагина в список разрешённых размеров добавьте 200.
Перейдите в приложение Сайт - Блоки и создайте там новый блок home_brands:
<div class="p-block__inner"> <div class="h1 header {if $wa->isMobile()}header-mobile{/if}"> Бренды {if !$wa->isMobile()} <a class="slide-prev slide-nav js-brands-prev" href="javascript:;"><i class="fa fa-chevron-left"></i></a> <a class="slide-next slide-nav js-brands-next" href="javascript:;"><i class="fa fa-chevron-right"></i></a> {/if} </div> </div> <div class="p-thumbs {if $wa->isMobile()}p-mobile-scroll{/if}"> <div class="row js-brands"> {foreach shopProductbrandsPlugin::getBrands() as $b} <div class="col-5-row"> <a href="{$b.url}" title="{$b.name|escape}"> {if $b.image} <img alt="{$b.name|escape}" src="{$wa_url}wa-data/public/shop/brands/{$b.id}/{$b.id}.200{$b.image}"> {else} <span>{$b.name}</span> {/if} </a> </div> {/foreach} </div> </div> <style> .js-brands a { text-decoration: none; display: flex; height: 100px; text-align: center; justify-content: center; flex-direction: column; box-shadow: 0 5px 5px 0 rgba(126, 125, 118, 0.2); } .js-brands a img { max-height: 100px; max-width: 100%; } .js-brands a span { font-size: 150%; } </style> <script> $(function () { var brands = $(".js-brands"); var prev = $('.js-brands-prev'); var next = $('.js-brands-next'); brands.slick({ infinite: false, autoplay: true, autoplaySpeed: 8000, slidesToShow: 5, slidesToScroll: 5, rows: 0, dots: false, arrows: false, prevArrow: prev, nextArrow: next, responsive: [ { breakpoint: 2024, settings: { slidesToShow: 5, slidesToScroll: 5 } }, { breakpoint: 1000, settings: { slidesToShow: 4, slidesToScroll: 4 } }, { breakpoint: 800, settings: { slidesToShow: 3, slidesToScroll: 3 } }, { breakpoint: 600, settings: { slidesToShow: 2, slidesToScroll: 2 } }, { breakpoint: 480, settings: { slidesToShow: 2, slidesToScroll: 2 } }, { breakpoint: 320, settings: { slidesToShow: 1, slidesToScroll: 1 } } ] }); prev.click(function () { brands.slick('slickPrev'); }); next.click(function () { brands.slick('slickNext'); }); }) </script>
Далее перейдите в приложение Магазин - Витрина - Шаблоны
В файле home.split.html в нужном месте добавьте код:
<div class="p-block"> {$wa->block('home_brands')} </div>
В файл home.single.html в нужном месте добавьте код:
<div class="p-block"> <div class="container"> {$wa->block('home_brands')} </div> </div>
Чтобы добавить комментарий, зарегистрируйтесь или войдите
0 комментариев