Картинки подкатегорий в теме Гипермаркет
category.html
{if $category.subcategories} <div class="subcategories"> {foreach $category.subcategories as $sc} <div class="subcategory"> {if !empty($sc.image)} <div class="image"> <a href="{$sc.url}"><img src="{$wa_url}wa-data/public/shop/categories/{$sc.id}/{$sc.id}.200x200{$sc.image}" alt="{$sc.name|escape}"></a> </div> {/if} <a class="name" href="{$sc.url}">{$sc.name}</a> </div> {/foreach} </div> {/if}
И добавить в стили CSS
.subcategories .subcategory { display: inline-block; text-align: center; min-width: 33%; margin-bottom: 5px; padding: 5px 0; border: 1px solid transparent; } .subcategories .subcategory:hover { border: 1px solid #ccc; } .subcategories .subcategory .image { max-width: 300px; height: 200px; margin-top: 5px; margin-bottom: 5px; overflow: hidden; } .subcategories .subcategory .image a { line-height: 200px; } .subcategories .subcategory img { max-width: none; max-height: 100%; vertical-align: middle; } .subcategories .subcategory .name { font-weight: bold; }
0 comments