Бренды слайдером на главной в теме Удобная покупка

В нужном месте в файле home.html вставьте код:

<div class="brands-slider">
    <div class="products-slider-name"><h2>Бренды</h2></div>
    <ul class="products-slider-0">
    {foreach shopProductbrandsPlugin::getBrands() as $b}
      <li>
        <div class="image">
            <a href="{$b.url}" title="{$b.name|escape}">
                <span class="fix"></span>
                {if $b.image}<img alt="{$b.name|escape}" width="150" src="{$wa_url}wa-data/public/shop/brands/{$b.id}/{$b.id}{$b.image}">{else}{$b.name|escape}{/if}
            </a>
        </div>
      </li>
    {/foreach}
    </ul>
</div>

При необходимости ширину картинки (width="150") измените на нужную вам.

Далее в файл стилей css либо в блок <style></style> добавьте следующие стили:

.brands-slider .jcarousel-prev, .brands-slider .jcarousel-next {
  top: -78px;
  right: 20px;
}
.brands-slider .jcarousel-prev {
  right: 50px;
}

.brands-slider .image {
    height: 70px;
    padding: 0 5px;
}

.brands-slider .image img {
    max-height: 70px;
    vertical-align: middle;
}
.brands-slider .image a {
    font-size: 150%;
    text-decoration: none;
    text-shadow: 0 0 5px;
}

.brands-slider .image span.fix {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}


Posted: May 10, 2016
Was this article helpful? Yes No

0 comments

    Add comment

    To add a comment please sign up or login