0
<div class="main_menu-button">Меню <span>сайта</span></div>
<nav class="menu main_menu" itemscope itemtype="https://schema.org/SiteNavigationElement">
<a class="close-menu">Назад</a>
{% FOR menu %}
{% FOR header %}
{% FOR links %}
<a href="{menu.header.links.URL}" class="{% IF menu.header.links.SELECTED %}active{%ENDIF%} unselectable" {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %} itemprop="url">{menu.header.links.NAME}</a>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</nav>
<span class="overflowMenu"></span>
</div>
</div>
после него вставьте:
<!-- Популярные запросы -->
<div class="pdt-cat popular">
<div class="block-title">
<h3 class="title"><a href="{CATALOG_URL}" title="Популярные запросы">Популярные запросы:</a></h3>
{% IFNOT catalog_full_empty %}
<div class="mainnav owl-carousel" itemscope itemtype="https://schema.org/SiteNavigationElement">
{% FOR catalog_full %}
{% IFNOT catalog_full.HIDE && catalog_full.LEVEL = 0 %}
<div class="item" data-id="{catalog_full.ID}">
<a href="{catalog_full.URL}" title="{catalog_full.NAME}" itemprop="url"><span>{catalog_full.NAME}</span></a>
</div>
{% ENDIF %}
{% ENDFOR %}
</div>
{% ENDIF %}
</div>
<script>
// Рекомендуем для Вас Категории
$(".pdt-cat .mainnav").owlCarousel({
items: 1,
loop: false,
rewind: true,
lazyLoad: true,
margin: 0,
nav: true,
dots: false,
navText: [ , ],
autoWidth: true,
autoHeight: false,
autoplay: false,
autoplayHoverPause: true,
smartSpeed: 500,
mouseDrag: true,
touchDrag: true,
pullDrag: true
});
</script>
</div>
<div class="clear"></div>
далее зайдите в Редактор шаблонов-->main.css И найдите:
#Slider .button-heart{width:225px;}
после него вставьте:
/** Популярные запросы **/
.pdt-cat.popular .block-title {border-bottom: 1px solid #cecece;margin-bottom: 15px;line-height: 40px;}
.pdt-cat.popular .block-title .title {display: inline-block;vertical-align: middle;font-size: 20px;text-transform: none;font-weight: 400;line-height: 40px;padding: 5px 5px;float: left;}
.pdt-cat.popular .block-title .mainnav {position: relative;float: left;top: 5px;width: 70%;padding: 0 40px 0 25px;}
.pdt-cat.popular .block-title .mainnav .owl-nav div {border: 0;background: #ffffff;color: #000000;margin-top: -25px;}
.pdt-cat.popular .block-title .mainnav .item a {display: block;height: 32px;overflow: hidden;margin: 0 15px;font-size: 15px;}
.pdt-cat.popular{height:50px}
.pdt-cat.popular .owl-nav{position: absolute;bottom: calc(100% + 72px);height:0;width:98%;padding: 0 15px;display: flex;flex-wrap: wrap;justify-content: space-between;}
.pdt-cat.popular .owl-nav{padding:0;}
.pdt-cat.popular .owl-prev{background-size:30px 24px;background-repeat:no-repeat;background-position:left center; margin-left: -15px;
background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.5 31.5'%3E%3Cpath d='M.3 15c-.4.4-.4 1.1 0 1.6l10 10c.4.4 1.1.4 1.6 0 .4-.4.4-1.1 0-1.6l-8-8h26.6c.6 0 1.1-.5 1.1-1.1s-.5-1.1-1.1-1.1H3.8l8-8c.4-.4.4-1.1 0-1.6-.4-.4-1.2-.4-1.6 0L.3 15z' fill='%232e0041'/%3E%3C/svg%3E");}
.pdt-cat.popular .owl-next{background-size:30px 24px;background-repeat:no-repeat;background-position:right center;
background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.5 31.5'%3E%3Cpath d='M21.2 5c-.4-.4-1.1-.4-1.6 0-.4.4-.4 1.1 0 1.6l8 8H1.1c-.6 0-1.1.5-1.1 1.1s.5 1.1 1.1 1.1h26.6l-8 8c-.4.4-.4 1.2 0 1.6.4.4 1.2.4 1.6 0l10-10c.4-.4.4-1.1 0-1.6L21.2 5z' fill='%232e0041'/%3E%3C/svg%3E");}
.pdt-cat.popular .products-grid .item{padding-bottom:0;height:100%;}
.pdt-cat.popular .owl-nav{bottom:auto;top:0px;}
.pdt-cat.popular .block-title .mainnav {width: calc(100% - 250px );}
далее найдите:
#ageCheck .ageCheckContent .ageCheckWrp .ageCheckButtonsContainer .button:not(:last-of-type){margin:0 0 15px 0;}
после него вставьте:
.pdt-cat.popular .block-title .title {display: inline-block;vertical-align: middle;font-size: 14px;text-transform: none;font-weight: 400;line-height: 40px;padding: 5px 5px;float: left;width: 110px;line-height: 20px;text-align: center;}
.pdt-cat.popular .block-title .mainnav .item a {display: block;height: 32px;overflow: hidden;margin: 0 10px;font-size: 13px;}
.pdt-cat.popular .block-title .mainnav {width: calc(100% - 120px );height: 30px;overflow: hidden;}
.pdt-cat.popular .owl-prev{background-size: 60px 20px;background-repeat:no-repeat;background-position:left center;margin-left: -45px;background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.5 31.5'%3E%3Cpath d='M.3 15c-.4.4-.4 1.1 0 1.6l10 10c.4.4 1.1.4 1.6 0 .4-.4.4-1.1 0-1.6l-8-8h26.6c.6 0 1.1-.5 1.1-1.1s-.5-1.1-1.1-1.1H3.8l8-8c.4-.4.4-1.1 0-1.6-.4-.4-1.2-.4-1.6 0L.3 15z' fill='%232e0041'/%3E%3C/svg%3E");}
.pdt-cat.popular .owl-next{background-size: 63px 20px;background-repeat:no-repeat;background-position:right center;background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.5 31.5'%3E%3Cpath d='M21.2 5c-.4-.4-1.1-.4-1.6 0-.4.4-.4 1.1 0 1.6l8 8H1.1c-.6 0-1.1.5-1.1 1.1s.5 1.1 1.1 1.1h26.6l-8 8c-.4.4-.4 1.2 0 1.6.4.4 1.2.4 1.6 0l10-10c.4-.4.4-1.1 0-1.6L21.2 5z' fill='%232e0041'/%3E%3C/svg%3E");}
