Сообщений в теме: 74

[feareel]

 Vaccina (21 Февраль 2014 - 03:41) писал:

выше код привела, он меняет ширину блоков у товаров, примените его и каталог должен встать на место и ровно стоять как на главной так и в списке товаров(категориях)

Спасибо, применил, но не помогло.

Отступ правого каталога продолжает гулять в зависимости от страницы.
Как сделать так, чтобы все страницы вне зависимости от контента были шириной 720 пикселей?

[Vaccina]

Попробуйте в main.css в самый конец добавить:

.cont700 .pad-box {
	overflow: hidden;
	width: 680px;
}

[feareel]

 Vaccina (21 Февраль 2014 - 05:08) писал:

Попробуйте в main.css в самый конец добавить:

.cont700 .pad-box {
overflow: hidden;
width: 680px;
}

Большое-большое спасибо! Наконец-то то, что надо.

[feareel]

Здравствуйте!

Подскажите пожалуйста, возможно ли в качестве фона шапки использовать не .png файл, а .swf (flash)? То есть вместо header_page.png использовать header_page.swf? И как это сделать? Сам файл у меня есть.

[@lina_va]

 feareel (23 Февраль 2014 - 18:26) писал:

Здравствуйте!

Подскажите пожалуйста, возможно ли в качестве фона шапки использовать не .png файл, а .swf (flash)? То есть вместо header_page.png использовать header_page.swf? И как это сделать? Сам файл у меня есть.

В качестве фона можно использовать файл с расширением swf.
Однако из-за этого ваш сайт будет грузиться дольше обычного.
изображение нужно загрузить в раздел Сайт-редактор шаблонов

[feareel]

 @lina_va (23 Февраль 2014 - 18:37) писал:

В качестве фона можно использовать файл с расширением swf.
Однако из-за этого ваш сайт будет грузиться дольше обычного.
изображение нужно загрузить в бэкофис

Спасибо за подсказку, но по каким-то причинам изображение не отображается.

Загрузил через бэкофис head.swf, прописал его в main.css:

.b_page {background: url({ASSETS_IMAGES_PATH}head.swf) no-repeat center top;}

Но на сайте он не отображается, почему?

http://volga-store.ru/

[@lina_va]

 feareel (23 Февраль 2014 - 18:46) писал:

Спасибо за подсказку, но по каким-то причинам изображение не отображается.

Загрузил через бэкофис head.swf, прописал его в main.css:

.b_page {background: url({ASSETS_IMAGES_PATH}head.swf) no-repeat center top;}

Но на сайте он не отображается, почему?

http://volga-store.ru/

Если Вы хотите применить фон только к шапке (как Вы писали выше), бэкграунд нужно прописать в блоке:

#header {
height: 124px;
}

Не вижу загруженного изображения
Его нужно загрузить в раздел Сайт-редактор шаблонов

[feareel]

1. Снова переделал шапку. Все работает, только не активна ссылка в корзину, подскажите пожалуйста, как исправить?

2. Где и как прописан цвет выделения кнопок в верхнем меню?

3. Хочу вместо кнопки "Главная", сделать маленькое лого, но чтобы оно выглядело и выделялось при наведении курсора как кнопка. Возможно ли это?

Спасибо!

http://volga-store.ru/

Прикрепленные изображения

• 
• 

Сообщение отредактировал feareel: 24 Февраль 2014 - 06:49

[Castiel]

 feareel (23 Февраль 2014 - 20:42) писал:

1. Снова переделал шапку. Все работает, только не активна ссылка в корзину, подскажите пожалуйста, как исправить?

2. Где и как прописан цвет выделения кнопок в верхнем меню?

3. Хочу вместо кнопки "Главная", сделать маленькое лого, но чтобы оно выглядело и выделялось при наведении курсора как кнопка. Возможно ли это?

Спасибо!

http://volga-store.ru/

1. Редактируем main.css
Находим

#cartInfo {
position: absolute;
font-size: 10px;
top: 65px;
left: 740px;
white-space: nowrap;
overflow: hidden;
height: 30px;
width: 340px;
}

Заменяем на

#cartInfo {
position: absolute;
font-size: 10px;
top: 65px;
left: 740px;
white-space: nowrap;
overflow: hidden;
height: 30px;
width: 340px;
z-index: 1;
}

Находим

#contactInfo {
position: absolute;
font-size: 12px;
top: 60px;
left: 500px;
}

Заменяем на

#contactInfo {
position: absolute;
font-size: 12px;
top: 60px;
left: 500px;
z-index: 1;
}

Цвет меню

#mainmenu li a {
font: bold 12px/40px Helvetica, Tahoma, Arial, sans-serif;
color: #FFF;
display: block;
float: left;
padding-right: 15px;
padding-left: 15px;
text-transform: uppercase;
text-decoration: none;
background: url(http://design.volga-store.ru/tm_link_border.gif) no-repeat right top;
}

color: #FFF; цвет

3. Можно нарисовать отдельную кнопку для Главной и использовать ее.
Для этого редактируем шаблон HTML
Находим

<li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li>

Заменяем на

<li><a href="{menu.header.links.URL}" {% IF menu.header.links.NAME = Главная %}class="firstmain"{%ENDIF%}{% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li>

Далее добавляем стили

.firstmain a {
height: 38px;
width: 80px;
background: url('{ASSETS_IMAGES_PATH}'fon.png) no-repeat !important;
margin-top: 2px;
text-align: right;
}

fon.png фон кнопки для главной

[feareel]

 Castiel (24 Февраль 2014 - 10:51) писал:

1. Редактируем main.css
Находим

#cartInfo {
position: absolute;
font-size: 10px;
top: 65px;
left: 740px;
white-space: nowrap;
overflow: hidden;
height: 30px;
width: 340px;
}

Заменяем на

#cartInfo {
position: absolute;
font-size: 10px;
top: 65px;
left: 740px;
white-space: nowrap;
overflow: hidden;
height: 30px;
width: 340px;
z-index: 1;
}

Находим

#contactInfo {
position: absolute;
font-size: 12px;
top: 60px;
left: 500px;
}

Заменяем на

#contactInfo {
position: absolute;
font-size: 12px;
top: 60px;
left: 500px;
z-index: 1;
}

Цвет меню

#mainmenu li a {
font: bold 12px/40px Helvetica, Tahoma, Arial, sans-serif;
color: #FFF;
display: block;
float: left;
padding-right: 15px;
padding-left: 15px;
text-transform: uppercase;
text-decoration: none;
background: url(http://design.volga-store.ru/tm_link_border.gif) no-repeat right top;
}

color: #FFF; цвет

3. Можно нарисовать отдельную кнопку для Главной и использовать ее.
Для этого редактируем шаблон HTML
Находим

<li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li>

Заменяем на

<li><a href="{menu.header.links.URL}" {% IF menu.header.links.NAME = Главная %}class="firstmain"{%ENDIF%}{% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li>

Далее добавляем стили

.firstmain a {
height: 38px;
width: 80px;
background: url('{ASSETS_IMAGES_PATH}'fon.png) no-repeat !important;
margin-top: 2px;
text-align: right;
}

fon.png фон кнопки для главной

Спасибо, помогло

[feareel]

ааа, нет. что-то последний пункт не работает. все вот так прописал, картинку добавил и ничего не изменилось

[Alexey11]

Добавьте данный блок кода в шаблон Main.css

.firstmain{background: url(http://design.volga-store.ru/gerb.png) no-repeat !important;}

[feareel]

Спасибо, но получается просто статичная картинка...

Может по-другому попробовать, сделать в шапке копию обычной кнопки, которые у нас везде в товарах, каталоге, корзине и тд. Просто я потом поменяю изображение read_more.jpg на свое.

Суть в том, что мне нужна анимированая кнопка, чтобы она при наведении меняла цвет. Как все остальные кнопки. Помогите осуществить пожалуйста задумку. Просто поместить в шапку такую же кнопку как например в корзине.

Спасибо

Прикрепленные изображения

• 
• 

[Vaccina]

Для этого необходимо изменить значения background в сл.блоках:

#mainmenu li a {
	background: url("http://design.volga-store.ru/tm_link_border.gif") no-repeat scroll right top rgba(0, 0, 0, 0);
	color: #FFFFFF;
	display: block;
	float: left;
	font: bold 12px/40px Helvetica,Tahoma,Arial,sans-serif;
	padding-left: 15px;
	padding-right: 15px;
	text-decoration: none;
	text-transform: uppercase;
}
#mainmenu li a:hover {
	background: url("http://design.volga-store.ru/tm_link_border.gif") repeat-x scroll center bottom rgba(0, 0, 0, 0);
}

первый блок отвечает за статичную кнопку, второй за кнопку при наведении

[feareel]

 Vaccina (25 Февраль 2014 - 04:07) писал:

Для этого необходимо изменить значения background в сл.блоках:

#mainmenu li a {
background: url("http://design.volga-store.ru/tm_link_border.gif") no-repeat scroll right top rgba(0, 0, 0, 0);
color: #FFFFFF;
display: block;
float: left;
font: bold 12px/40px Helvetica,Tahoma,Arial,sans-serif;
padding-left: 15px;
padding-right: 15px;
text-decoration: none;
text-transform: uppercase;
}
#mainmenu li a:hover {
background: url("http://design.volga-store.ru/tm_link_border.gif") repeat-x scroll center bottom rgba(0, 0, 0, 0);
}

первый блок отвечает за статичную кнопку, второй за кнопку при наведении

Спасибо, но....

вы не совсем поняли... мне не нужно полностью менять все кнопки в шапке. Мне нужно чтобы первая кнопка была другая, которую я сам нарисую. А все остальные чтобы остались как есть.

[Vaccina]

 Alexey11 (24 Февраль 2014 - 18:59) писал:

Добавьте данный блок кода в шаблон Main.css

.firstmain{background: url(http://design.volga-store.ru/gerb.png) no-repeat !important;}

в этом случае необходима инструкция выше, данный блок отвечает за статичную кнопку и чтобы при наведении она менялась, добавьте:

.firstmain:hover{background: url(http://design.volga-store.ru/gerb2.png) no-repeat !important;}

где gerb2.png картинка при наведении

[feareel]

 Vaccina (25 Февраль 2014 - 04:57) писал:

в этом случае необходима инструкция выше, данный блок отвечает за статичную кнопку и чтобы при наведении она менялась, добавьте:

.firstmain:hover{background: url(http://design.volga-store.ru/gerb2.png) no-repeat !important;}

где gerb2.png картинка при наведении

Большое спасибо! Работает!

Еще вопросы:

1. Как скрыть текст кнопки "Главная", чтобы его видно не было, чтобы была видна только картинка? Потому как позже я туда помещу логотип в качестве gerb.png и текст будет мешать.
2. Можно ли gerb.png и gerb2.png реализовать в одном файле как это сделано в файлах: tm_link_border.gif, read_more.png и тд...? Так как при наведении происходит задержка пока подгрузится файл gerb2.png

Заранее спасибо!

[Vaccina]

1. Попробуйте в стилях:

.firstmain{background: url(http://design.volga-store.ru/gerb.png) no-repeat !important;}

добавить text-indent: 9999px;

.firstmain{
background: url(http://design.volga-store.ru/gerb.png) no-repeat !important;
text-indent: 9999px;
}

2. Для этого в стилях background после no-repeat необходимо прописать значения расположения фона left top или пиксельные значения пример:

.firstmain{background: url(http://design.volga-store.ru/gerb.png) no-repeat left top !important;}
.firstmain:hover{background: url(http://design.volga-store.ru/gerb.png) no-repeat left 40px !important;}

[feareel]

 Vaccina (25 Февраль 2014 - 05:26) писал:

1. Попробуйте в стилях:

.firstmain{background: url(http://design.volga-store.ru/gerb.png) no-repeat !important;}

добавить text-indent: 9999px;

.firstmain{
background: url(http://design.volga-store.ru/gerb.png) no-repeat !important;
text-indent: 9999px;
}

2. Для этого в стилях background после no-repeat необходимо прописать значения расположения фона left top или пиксельные значения пример:

.firstmain{background: url(http://design.volga-store.ru/gerb.png) no-repeat left top !important;}
.firstmain:hover{background: url(http://design.volga-store.ru/gerb.png) no-repeat left 40px !important;}

Спасибо!

Сделал как Вы написали.

1.

.firstmain{background: url(http://design.volga-store.ru/gerb.png) no-repeat left top !important;}

Это работает, но вторая часть нет. В моем случае это:

.firstmain:hover{
  background: url({ASSETS_IMAGES_PATH}gerb.png) no-repeat left 93px !important;
}

При наведении курсора картинка не отображается....

gerb.png у меня размером 100*186... Как сделать так чтобы кнопка была размером 100*93? сейчас она очень маленького размера. И как сделать чтобы вторая часть картинки все таки отображалась, когда наводишь курсор?

2.
text-indent: 9999px; не работает... Когда указываешь этот код, то пропадает текст во всем меню. Возможно ли сделать просто чтобы gerb.png был "выше" надписи Главная?

[Vaccina]

Вы убрали пункт "Главная" от чего уже стили для класса "firstmain" не работают, если вам необходимо сделать для первого пункта, тогда:

firstmain{background: url(http://design.volga-store.ru/gerb.png) no-repeat left top !important;}
.firstmain:hover{background: url(http://design.volga-store.ru/gerb.png) no-repeat left 40px !important;}

замените на:

#mainmenu li:first-child a{background: url(http://design.volga-store.ru/gerb.png) no-repeat left top !important;}
#mainmenu li:first-child a:hover{background: url(http://design.volga-store.ru/gerb.png) no-repeat left 40px !important;}