Вертикальное МЕНЮ группы товаров

[Alina]

Создаёте в любом графическом редакторе изображение (или берёте ниже мой), желательно в формате *.png с разрешением 180 на 64.

Делите его ровно пополам и закрашиваете подходящими цветами вашей темы. Верхняя часть - это состояние меню по дефолту. Нижняя - при наведении мыши.

И кидаете ваше изображение в папку catalog/view/theme/ВАША ТЕМА/image.

Вот пример:

Далее, открываете файл со стилями вашей темы: catalog/view/theme/ВАША ТЕМА/stylesheet/stylesheet.css и находите в нём блок:

#category ul {
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 8px;
	padding-left: 12px;
	list-style: url('../image/bullet_1.png');
}

Меняете в нем строки на эти:

#category ul {
	margin-top: 0px;
	margin-bottom: 0px;
	 margin-left: 0px;
	 padding-left: 0px;
	list-style-type:none;
}

Затем, в самом конце, добавляем 4 блока нашего меню:

#category {
	width: 178px;
	margin: 0px;
	padding: 0px 0 0 0px;
	list-style-type:none;
}
#category li a {
	height: 32px;
	height: 23px;
	text-decoration: none;
}
#category li a:link, #category li a:visited {
	color: #3a75c4;
	display: block;
	background:  url('../image/menu.png');
	z-index: 2;
	padding: 8px 0 0 5px;
}
#category li a:hover, #category li #category {
	color: #FFFFFF;
	background:  url('../image/menu.png') 0 -32px;
	padding: 8px 0 0 5px;
}

Всё.

В итоге:

А где так прописать для версии 1,5,1,3 ?

[RedMi]

Подскажите пожалуйста как сделать такое меню на версии 1.5.3 там другой код, при замене данного результата нет