Перейти к содержимому


Отображение Цен


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 18

#1 punkkez

punkkez

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 492 сообщений

Отправлено 23 Октябрь 2013 - 17:55

как можно сделать такое же отображение цены?

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

  • Снимок.JPG


#2 Сake

Сake

    Активный участник

  • Модератоpы
  • 5 979 сообщений

Отправлено 24 Октябрь 2013 - 01:40

Пожалуйста, уточните ваш вопрос. Вы хотите сделать отображение актуальной цены, так и старой цены? или же только какой-то цены конкретно? По сути если делать реализацию именно актуальной цены, то тут необходимо изображение подложки на котором будет размещена цена.

#3 punkkez

punkkez

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 492 сообщений

Отправлено 24 Октябрь 2013 - 07:02

я хочу чтобы визуальное отображение цены было таким же как в скрине выше

#4 empty9228

empty9228

    Активный участник

  • Модератоpы
  • 618 сообщений

Отправлено 24 Октябрь 2013 - 07:51

Здравствуйте! Говоря, "таким же как в скрине выше", Вы имеет ввиду шрифт, цвет, кнопку, старую цену?

#5 punkkez

punkkez

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 492 сообщений

Отправлено 24 Октябрь 2013 - 08:12

именно

#6 empty9228

empty9228

    Активный участник

  • Модератоpы
  • 618 сообщений

Отправлено 24 Октябрь 2013 - 11:19

Для этого
1. Скачайте изображения этой кнопки с сайта, на котором вы это нашли.
2. Отправьте ссылку с сайта, что бы мы могли посмотреть, какие стили там применяются.

#7 punkkez

punkkez

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 492 сообщений

Отправлено 24 Октябрь 2013 - 12:18

готово.
ссылка
Скрытый текст

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

  • cena.jpg


#8 Stasya

Stasya

    Активный участник

  • Модератоpы
  • 4 007 сообщений

Отправлено 24 Октябрь 2013 - 20:32

В конец файла main.css добавьте блок
.cena {
color: #789035;
font-size: 18px;
font-family: ptsansnarrow, Arial Narrow;
font-style: normal;
}
и в шаблоне HTML найдите блок
<div class="goodsListItemPriceNew">
<a href="{index_page_goods.URL_MIN_PRICE_NOW}">{index_page_goods.MIN_PRICE_NOW | money_format}</a>
</div>
и замените его на
<div class="goodsListItemPriceNew">
<div style="background:url('ссылка на картинку') no-repeat; margin-left:73px; height:38px;padding-top:10px;">
<a href="{index_page_goods.URL_MIN_PRICE_NOW}">
<span class="cena">{index_page_goods.MIN_PRICE_NOW | money_format}</span></a>
</div></div>

Далее там же найдите блок
<div class="goodsListItemPriceNew">
												 <a href="{index_page_new_goods.URL_MIN_PRICE_NOW}">{index_page_new_goods.MIN_PRICE_NOW | money_format}</a>
								 </div>
и замените его на
<div class="goodsListItemPriceNew">
<div style="background:url('ссылка на картинку') no-repeat; margin-left:73px; height:38px;padding-top:10px;">
<a href="{index_page_new_goods.URL_MIN_PRICE_NOW}">
<span class="cena">{index_page_new_goods.MIN_PRICE_NOW | money_format}</span></a>
</div></div>
Найдите блок
<div class="goodsListItemPriceNew">
<a href="{index_page_favorites_goods.URL_MIN_PRICE_NOW}">{index_page_favorites_goods.MIN_PRICE_NOW | money_format}</a>
</div>
и замените его на
<div class="goodsListItemPriceNew">
<div style="background:url('ссылка на картинку') no-repeat; margin-left:73px; height:38px;padding-top:10px;">
<a href="{index_page_favorites_goods.URL_MIN_PRICE_NOW}">
<span class="cena">{index_page_favorites_goods.MIN_PRICE_NOW | money_format}</span></a>
</div></div>

Теперь в шаблоне Товары найдите блок
<div class="goodsListItemPriceNew">
<a href="{goods.URL_MIN_PRICE_NOW}">{goods.MIN_PRICE_NOW | money_format}</a>			 </div>
и замените его на
<div class="goodsListItemPriceNew">
<div style="background:url('ссылка на картинку') no-repeat; margin-left:73px; height:38px;padding-top:10px;">
<a href="{goods.URL_MIN_PRICE_NOW}">
<span class="cena">{goods.MIN_PRICE_NOW | money_format}</span></a>
</div></div>
И в шаблоне Поиск найдите блок
<div class="goodsListItemPriceNew">
				 <a href="{goods.URL_MIN_PRICE_NOW}">{goods.MIN_PRICE_NOW | money_format}</a>
			 </div>
и замените его на
<div class="goodsListItemPriceNew">
<div style="background:url('ссылка на картинку') no-repeat; margin-left:73px; height:38px;padding-top:10px;">
<a href="{goods.URL_MIN_PRICE_NOW}">
<span class="cena">{goods.MIN_PRICE_NOW | money_format}</span></a>
</div></div>

Картинку Вам необходимо загрузить в разделе Сайт-> Редактор шаблонов-> Добавить файлы. И затем вставьте ссылку на эту картинку во все эти блоки.

#9 punkkez

punkkez

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 492 сообщений

Отправлено 24 Октябрь 2013 - 21:21

теперь осталось выровнять и исправить проблему в отображении цен.
Попробуйте на главной странице выбрать вкладку "новинки" и "хиты продаж" там почему то отображается только одна цена

#10 Сake

Сake

    Активный участник

  • Модератоpы
  • 5 979 сообщений

Отправлено 25 Октябрь 2013 - 02:49

Найдите в файле стилей main.css

.goodsListItemBlock a span span {
	color: #377411;
	font-size: 17px;
	font-weight: bold;
}

и замените на

.goodsListItemBlock a span span {
	color: #377411;
	font-size: 13px;
	font-weight: bold;
}

далее в шаблоне "HTML" найдите

<div class="goodsListItemPriceNew">
<div style="background:url(http://design.izh-futbolka.ru/cena.jpg) no-repeat; margin-left:73px; height:38px;padding-top:10px;">
<a href="{index_page_favorites_goods.URL_MIN_PRICE_NOW}">
<span class="cena">{index_page_favorites_goods.MIN_PRICE_NOW | money_format}</span></a>
</div></div>

и замените на

<div class="goodsListItemPriceNew">
<div style="background:url(http://design.izh-futbolka.ru/cena.jpg) no-repeat; margin-left:73px; height:38px;padding-top:10px;">
<a href="{index_page_new_goods.URL_MIN_PRICE_NOW}">
<span class="cena">{index_page_new_goods.MIN_PRICE_NOW | money_format}</span></a>
</div></div>

далее найдите

<div class="goodsListItemPriceNew">
<div style="background:url(http://design.izh-futbolka.ru/cena.jpg) no-repeat; margin-left:73px; height:38px;padding-top:10px;">
<a href="{index_page_new_goods.URL_MIN_PRICE_NOW}">
<span class="cena">{index_page_new_goods.MIN_PRICE_NOW | money_format}</span></a>
</div></div>

и замените на

<div class="goodsListItemPriceNew">
<div style="background:url(http://design.izh-futbolka.ru/cena.jpg) no-repeat; margin-left:73px; height:38px;padding-top:10px;">
<a href="{index_page_favorites_goods.URL_MIN_PRICE_NOW}">
<span class="cena">{index_page_favorites_goods.MIN_PRICE_NOW | money_format}</span></a>
</div></div>

после в разделе Настройки -> Валюты измените символ валюты на руб.

#11 punkkez

punkkez

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 492 сообщений

Отправлено 25 Октябрь 2013 - 10:55

теперь надо чтобы старая цена отображалась на одной линии с новой ценой, как в каталоге, так и на главной

#12 ne_yana

ne_yana

    Активный участник

  • Модератоpы
  • 1 190 сообщений

Отправлено 25 Октябрь 2013 - 15:30

Просмотр сообщенияpunkkez (25 Октябрь 2013 - 10:55) писал:

теперь надо чтобы старая цена отображалась на одной линии с новой ценой, как в каталоге, так и на главной
Здравствуйте, в файле main.css замените
.goodsListItemPriceOld, .goodsListItemPriceOld a, .goodsListItemPriceOld a span span {
color: #5309a6;
font-weight: normal;;
}
на
.goodsListItemPriceOld, .goodsListItemPriceOld a, .goodsListItemPriceOld a span span {
color: #5309a6;
font-weight: normal;
float: left;
margin-left: 2px;
margin-top: -11px;
}

Добавьте
.goodsListItemPriceNew {
margin-left: 8px;
}


#13 punkkez

punkkez

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 492 сообщений

Отправлено 25 Октябрь 2013 - 16:46

а как сделать перечеркнутую старую цену
и еще увидел неправильное отображение в разделе "толстовки"

#14 ne_yana

ne_yana

    Активный участник

  • Модератоpы
  • 1 190 сообщений

Отправлено 25 Октябрь 2013 - 18:04

Просмотр сообщенияpunkkez (25 Октябрь 2013 - 16:46) писал:

а как сделать перечеркнутую старую цену
и еще увидел неправильное отображение в разделе "толстовки"
Замените
.goodsListItemPriceOld, .goodsListItemPriceOld a, .goodsListItemPriceOld a span span {
color: #837e7e;
font-weight: normal;
float: left;
margin-left: 2px;
margin-top: -11px;
}
на
.goodsListItemPriceOld, .goodsListItemPriceOld a, .goodsListItemPriceOld a span span {
color: #837e7e;
font-weight: normal;
float: left;
margin-left: 2px;
margin-top: -11px;
text-decoration: line-through;
}

и
.goodsListItemBlock {
height: 320px;
width: 210px;
margin: 5px;
overflow: hidden;
}
на
.goodsListItemBlock {
height: 343px;
width: 210px;
margin: 5px;
overflow: hidden;
}


#15 punkkez

punkkez

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 492 сообщений

Отправлено 25 Октябрь 2013 - 19:09

теперь в том же разделе "толстовки" у одного товара цена находится ниже чем у соседнего товара, и еще перечеркивается кнопка "подробнее"

#16 sengun

sengun

    Активный участник

  • Модератоpы
  • 1 139 сообщений
  • ГородНижний Новгород

Отправлено 25 Октябрь 2013 - 22:34

Просмотр сообщенияpunkkez (25 Октябрь 2013 - 19:09) писал:

теперь в том же разделе "толстовки" у одного товара цена находится ниже чем у соседнего товара, и еще перечеркивается кнопка "подробнее"
Здравствуйте. В шаблоне "Товары" замените код
<div style="background:url(http://design.izh-futbolka.ru/cena.jpg) no-repeat; margin-left:73px; height:38px;padding-top:10px;">
на этот
<div style="background:url(http://design.izh-futbolka.ru/cena.jpg) no-repeat; height:36px; line-height: 36px; width: 120px;">
теперь код
<div><a class="readmore-3" title="{goods.NAME}" href="{goods.URL}">Подробнее</a>			 </div>
			 </div>
на этот
</div>
<div><a class="readmore-3" title="{goods.NAME}" href="{goods.URL}">Подробнее</a>			 </div>
Далее в main.css замените код
.goodsListItemPriceOld, .goodsListItemPriceOld a, .goodsListItemPriceOld a span span {
color: #837e7e;
font-weight: normal;
float: left;
margin-left: 2px;
margin-top: -11px;
text-decoration: line-through;
}
на этот
.goodsListItemPriceOld {
position: absolute;
bottom: 47px;
left: 5px;
}
.goodsListItemPriceOld, .goodsListItemPriceOld a, .goodsListItemPriceOld a span span {
color: #837e7e;
font-weight: normal;
float: left;
text-decoration: line-through;
}
Далее код
.goodsListItemPriceNew {
margin-left: 8px;
}
замените на этот
.goodsListItemPriceNew {
position: absolute;
bottom: 37px;
right: 0;
}


#17 punkkez

punkkez

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 492 сообщений

Отправлено 26 Октябрь 2013 - 07:46

в каталоге теперь все нормально но на главной цены вообще съехали

#18 miyako

miyako

    Активный участник

  • Модератоpы
  • 5 372 сообщений

Отправлено 26 Октябрь 2013 - 08:13

Просмотр сообщенияpunkkez (26 Октябрь 2013 - 07:46) писал:

в каталоге теперь все нормально но на главной цены вообще съехали

Найдите код в main.css -
.goodsListItemBlock {
height: 343px;
width: 210px;
margin: 5px;
overflow: hidden;
}
и замените на -
.goodsListItemBlock {
height: 343px;
width: 210px;
margin: 5px;
overflow: hidden;
position: relative;
}

Далее найдите в шаблоне HTML код -
<div style="background:url(http://design.izh-futbolka.ru/cena.jpg) no-repeat;  margin-left:73px;  height:38px; padding-top:10px; ">
и в коде удалите  margin-left:73px; и  padding-top:10px;
Результат -
<div style="background:url(http://design.izh-futbolka.ru/cena.jpg) no-repeat;   height:38px;  ">


#19 punkkez

punkkez

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 492 сообщений

Отправлено 26 Октябрь 2013 - 08:20

немного не тот код нужен был
подправил на другой
<div style="background:url(http://design.izh-futbolka.ru/cena.jpg) no-repeat; height:36px; line-height: 36px; width: 120px;">





Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных