Опубликовано: 17 мая 2016
Как уменьшить ширину темы?
Хотелось бы уменьшить ширину рабочей области на 10%, подскажите как это сделать?
Т.е. на десктоп версии, если нажать в браузере ctrl+"-", то ширина получается как хотелось бы по-умолчанию.
- Коломна, ул. Кирова, 60а, офис 7
- +7 (995) 656-25-45
- kolmakov.igor@gmail.com
Комментарии (3)
Попробуйте экспериментировать с настройками ширины контейнера, в блоке пользовательских стилей:
@media only screen and (min-width: 993px) { .container { width: 85%; min-width: 950px; } }Спасибо, помогло.
Здравствуйте! А как можно увеличить ширину, не повреждая структуру мобильной версии. И можно ли в мобильной версии поменять местами купить и блок с фото(нелогично сейчас).
На данный момент для ширины ставлю в пользовательских стилях следующее:
/*ширина боковой панели с фильтром, было 25%*/
.maincontent nav.sidebar.col-grid {
padding: 0 0.25rem 0 0.75rem;
}
.row-grid .col-grid.l3 {
width: 15%;
margin-left: 0;
}
.row-grid .col-grid.l9 {
width: 85%;
margin-left: 0;
}
/*ширина сайта, было 1280*/
.container {
width: 85%;
min-width: 950px;
}
.container {
margin: 0 auto;
padding: 0;
width: 100%;
max-width: 1280px;
}
1) Попробуйте использовать медиа запросы:
@media only screen and (min-width: 993px) { тут ваши правила для настольных экранов }2) В файле product.html поднимите блок вывода изображения выше блока вывода блока выбора покупки. Блок вывода изображения:
{if method_exists($product, 'getVideo')} {$video = $product->getVideo(['96x96'])} {/if} {if $product.images || !empty($video.url)} <div class="col-grid s12 {if $is_sidebar_product}l7{else}l8{/if}"> <div class="fill-background"> {* видео как вкладка {include file="product.images.html" inline video=null} *} {include file="product.images.html" inline} </div> </div> {/if}В новой версии на одном сайте своем сделал, а на втором старая версия почему то:
<!-- purchase -->
<div id="cart-flyer" class="product-sidebar fill-background">
{if !empty($theme_settings.share)}<!-- share -->
<div class="share-wrapper">
{$theme_settings.share}
</div>
{/if}
{if !empty($product.rating) && $product.rating > 0}
<div id="product-rating-wrapper">
{$wa->shop->ratingHtml($product.rating, '24')}
<span itemprop="ratingValue" style="display: none;">{$product.rating}</span>
<span itemprop="reviewCount" style="display: none;">{$reviews_total_count}</span>
</span>
</div>
{/if}
<div class="cart">
{include file="product.cart.html" inline}
<!-- plugin hook: 'frontend_product.cart' -->
{* @event frontend_product.%plugin_id%.cart *}
{foreach $frontend_product as $k => $_}{if $k !== 'quickorder-plugin'}{$_.cart}{/if}{/foreach}
</div>
<!-- plugin hook: 'frontend_product.block_aux' -->
{* @event frontend_product.%plugin_id%.block_aux *}
{if !empty($frontend_product)}
<div class="aux">
{foreach $frontend_product as $_}{$_.block_aux}{/foreach}
</div>
{/if}
</div>
</div>
{if $product.images}
<div class="col-grid s12 {if $is_sidebar_product}l7{else}l8{/if}">
<div class="fill-background">
{include file="product.images.html" inline}
{shopSetPlugin::set($product)}
</div>
</div>
{/if}
<!-- product info -->
Там лишь немного отличается блок:
{if $product.images}
<div class="col-grid s12 {if $is_sidebar_product}l7{else}l8{/if}">
<div class="fill-background">
{include file="product.images.html" inline}
{shopSetPlugin::set($product)}
</div>
</div>
{/if}