Ребята, нужно карусель с категориями на главной заменит на простое расположение иконок (без карусели), например как здесь:
Как сделать, подскажите. Спасибо.
По пути в файле style.css
/oc-content/themes/veronika/css/style.css
находим и заменяем кодом ниже изложенным
от
/* TOP CATEGORIES */
и
до
/* BORDER ROUNDING */
ЗАМЕНЯЕМ НА ЭТОТ КОД...
/* TOP CATEGORIES */
#category-navigation {float:left;clear:both;width:100%;}
.top-cat-wrap {float:left;width:100%;clear:both;display:block;}
#body-home .top-cat-wrap.border-top {border-top:1px solid #f2f2f2;}
#body-home .top-cat-wrap.border-top #top-cat {padding-bottom:0;}
#top-cat {width:100%;float:left;background:#fff;padding:22px 10px 10px 10px;;position:relative;z-index:5;margin:0;}
#body-search #top-cat {background: #fdfdfd; border-top: 1px solid #f0f0f0; border-bottom: 1px solid #9fad7c; padding-top: 32px; padding-bottom: 0;}
#body-search #top-cat ul li .img {border-color:#e0e0e0;}
#body-search #top-cat ul li .img:hover {border-color:#fdfdfd;}
#body-item .container-outer > .container {margin-top:10px;}
#body-item div.breadcrumb {margin:8px 0 10px 2px;}
#top-cat h1 {float:left;width:40%;font-size:18px;color:#444;text-align:center;font-weight:500;margin:0 30% 20px 30%;padding:0 0 15px 0;border-bottom:1px dashed #ddd;}
#top-cat .cat-inside {margin:0 auto;width:100%;max-width:1200px;}
#top-cat ul {width: 100%;clear: both;text-align:center;display:block;margin:0 auto;float:none;}
#top-cat ul li {display:block;margin:0 5px 20px 5px;width:120px;float:left;}
#top-cat ul li.resp {display:none;}
#top-cat ul li a {float:left;width:100%;clear:both;display:block;}
#top-cat ul li a:hover .fa {color:#fff!important;}
#top-cat ul li.cat-gray a:hover .img .fa {color:#666!important;}
#top-cat ul li a:hover .name {text-decoration:underline;}
#top-cat ul li a:hover .img.no-color {background:#F44336;}
#top-cat ul li .img {display:inline-block;margin:0 auto;position:relative;width:70px;border:1px solid #e6e6e6;clear:both;text-align:center;height:70px;background:#fff;box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.06);-moz-box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.06);-webkit-box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.06);-webkit-border-radius: 35px; -moz-border-radius: 35px; border-radius: 35px;-webkit-transition:0.1s linear all;-moz-transition:0.1s linear all;-ms-transition:0.1s linear all;-o-transition:0.1s linear all;transition:0.1s linear all;}
#top-cat ul li .img span {opacity:0;z-index:1;display:block;position:absolute;top:0;left:0;width:100%;height:100%;-webkit-border-radius: 35px; -moz-border-radius: 35px; border-radius: 35px;-webkit-transition: opacity 0.1s ease-in-out; -moz-transition: opacity 0.1s ease-in-out; -ms-transition: opacity 0.1s ease-in-out; -o-transition: opacity 1s ease-in-out; transition: opacity 0.1s ease-in-out;box-shadow: -5px -5px 20px rgba(0,0,0,0.05) inset;-moz-box-shadow: -5px -5px 20px rgba(0,0,0,0.05) inset;-webkit-box-shadow: -5px -5px 20px rgba(0,0,0,0.05) inset;}
#top-cat ul li a:hover .img span {opacity:1;}
#top-cat ul li .img .fa {position:relative;z-index:2;font-size:23px;line-height:68px;text-align:center;color:#F44336;-webkit-transition:0.1s linear all;-moz-transition:0.1s linear all;-ms-transition:0.1s linear all;-o-transition:0.1s linear all;transition:0.1s linear all;}
#top-cat ul li.cat-gray .img {background:rgba(255, 255,255, 0.7)!important;}
#top-cat ul li.cat-gray .img .fa {color:#ccc!important;}
#top-cat ul li.cat-gray .img img {opacity:0.7;}
#top-cat ul li.cat-gray a:hover .img img {opacity:1;}
#top-cat ul li .img img {width:auto;height:24px;max-width:100%;margin:23px auto;position:relative;z-index:9;}
#top-cat ul li .name {margin:10px 0 0 0;float:left;width:100%;text-align:center;height:40px;line-height:20px;font-weight:500;font-size:13px;color:#333;word-wrap: break-word; word-break: break-word;}
#top-cat ul.ul-search li.cat-highlight .name {font-weight:bold;text-transform:uppercase;}
.top-cat-ul-wrap {padding:0;}
.home-container .white {padding:8px 0 0 0;}
#top-cat ul {width:100%!important;}
#top-cat ul li {display:block;margin:0 5px 20px 5px;width:120px;float:left;position:relative;min-height:100px;}
#top-cat ul li a {position:absolute;top:0;left:0;width:100%;height:100%;}
#top-cat ul li .name {margin:10px 0 0 0;float:left;width:100%;text-align:center;height:40px;line-height:20px;font-weight:500;font-size:13px;color:#333;word-wrap: break-word; word-break: break-word;}
/* TOP CATEGORIES */
.top-cat-ul-wrap {float:left;clear:both;width:100%;max-width:100%;min-width:100%;position:relative;padding:0 40px;}
.top-cat-ul-wrap .ul-box {padding-left:3%;float:left;clear:both;width:100%;overflow:hidden;}
#top-cat .arrows {display:none;position:absolute;background:transparent;top:0;height:110px;margin-top:0px;width:35px;cursor
ointer;}
#top-cat .arrows .fa {float:left;clear:both;width:100%;text-align:center;font-size:40px;line-height:60px;color:#666;}
#top-cat .arrows:hover .fa, #top-cat .arrows:active .fa {color:#000;}
#top-cat .arrows.left-arrow {left:0;}
#top-cat .arrows.left-arrow:hover {left:-5px;}
#top-cat .arrows.right-arrow {right:0;}
#top-cat .arrows.right-arrow:hover {right:-5px;}
/* BORDER ROUNDING */