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

[Andrew S.]

Плюс

[Andrew S.]

Есть

[Taisia]

прежде чем вносить какие то изменения в код сделайте бэкап сайта

далее во вкладке Сайт- Редактор шаблонов в файле ТОВАРЫ
найдите код (строка 297)

<div class="availability">В наличии </div>

замените на код

<div class="availability">В наличии &nbsp; {goods.MIN_REST_VALUE} шт. </div>

там же код (369 стр.)

<div class="availability">{% IF goods.MAX_REST_VALUE = 0 %}Под заказ{% ELSE %}В наличии{% ENDIF %}</div>

замените на код

<div class="availability">{% IF goods.MAX_REST_VALUE = 0 %}Под заказ{% ELSE %}В наличии  &nbsp; {goods.MIN_REST_VALUE} шт.{% ENDIF %}</div>

там же найти код (457стр.)

<div class="availability">{% IF goods.MAX_REST_VALUE = 0 %}Под заказ{% ELSE %}Товар есть в наличии{% ENDIF %}</div>

заменить его на код

<div class="availability">{% IF goods.MAX_REST_VALUE = 0 %}Под заказ{% ELSE %} В наличии &nbsp; {goods.MIN_REST_VALUE} шт.{% ENDIF %}</div>

Выводить количество в зависимости от единицы измерения не получится потому что эта переменная не доступна в файле ТОВАРЫ

Для карточки товара откройте файл ТОВАР

найдите код (111 стр.)

<p class="available-true" {% IF GOODS_MOD_REST_VALUE=0 %}style="display:none;"{% ENDIF %}>Товар есть в наличии</p>

замените на код

<p class="available-true" {% IF GOODS_MOD_REST_VALUE=0 %}style="display:none;"{% ENDIF %}>В наличии&nbsp; {goods.MIN_REST_VALUE}&nbsp;{GOODS_MOD_MEASURE_NAME}</p>

[Andrew S.]

Taisia (19 Март 2014 - 12:04) писал:

прежде чем вносить какие то изменения в код сделайте бэкап сайта

далее во вкладке Сайт- Редактор шаблонов в файле ТОВАРЫ
найдите код (строка 297)

<div class="availability">В наличии </div>

замените на код

<div class="availability">В наличии &nbsp; {goods.MIN_REST_VALUE} шт. </div>

там же код (369 стр.)

<div class="availability">{% IF goods.MAX_REST_VALUE = 0 %}Под заказ{% ELSE %}В наличии{% ENDIF %}</div>

замените на код

<div class="availability">{% IF goods.MAX_REST_VALUE = 0 %}Под заказ{% ELSE %}В наличии &nbsp; {goods.MIN_REST_VALUE} шт.{% ENDIF %}</div>

там же найти код (457стр.)

<div class="availability">{% IF goods.MAX_REST_VALUE = 0 %}Под заказ{% ELSE %}Товар есть в наличии{% ENDIF %}</div>

заменить его на код

<div class="availability">{% IF goods.MAX_REST_VALUE = 0 %}Под заказ{% ELSE %} В наличии &nbsp; {goods.MIN_REST_VALUE} шт.{% ENDIF %}</div>

Выводить количество в зависимости от единицы измерения не получится потому что эта переменная не доступна в файле ТОВАРЫ

Для карточки товара откройте файл ТОВАР

найдите код (111 стр.)

<p class="available-true" {% IF GOODS_MOD_REST_VALUE=0 %}style="display:none;"{% ENDIF %}>Товар есть в наличии</p>

замените на код

<p class="available-true" {% IF GOODS_MOD_REST_VALUE=0 %}style="display:none;"{% ENDIF %}>В наличии&nbsp; {goods.MIN_REST_VALUE}&nbsp;{GOODS_MOD_MEASURE_NAME}</p>

Выводить количество в зависимости от единицы измерения не получится потому что эта переменная не доступна в файле ТОВАРЫ -
Я имел ввиду, чтобы не "шт." подписывалось, а "шт", "кг", "м", "час", "день", "чел".. В зависимости от того, что выбрано в этом меню. Нельзя, да? Вы это имели ввиду?

[Vaccina]

если вы хотите чтобы автоматически устанавливалась ед.измерения, то воспользуйтесь сл.инструкцией:
http://forum.storela...ия/page__st__20

[Andrew S.]

Vaccina (20 Март 2014 - 05:09) писал:

если вы хотите чтобы автоматически устанавливалась ед.измерения, то воспользуйтесь сл.инструкцией:
http://forum.storela...ия/page__st__20

В "Товары" вставил - всё заработало. А в "Товар" вставил - не показывает количество.

[sengun]

Andrew S. (20 Март 2014 - 12:51) писал:

В "Товары" вставил - всё заработало. А в "Товар" вставил - не показывает количество.

Замените строку в "Товар"

<p class="available-true" {% IF GOODS_MOD_REST_VALUE=0 %}style="display:none;"{% ENDIF %}>В наличии&nbsp; {goods.MIN_REST_VALUE}&nbsp;{GOODS_MOD_MEASURE_NAME}</p>

на такую

<p class="available-true" {% IF GOODS_MOD_REST_VALUE=0 %}style="display:none;"{% ENDIF %}>В наличии&nbsp; {GOODS_MOD_REST_VALUE}&nbsp;{GOODS_MOD_MEASURE_NAME}</p>

[Andrew S.]

Короче я тут никого не хочу мучить, в шаблоне "Товары" написал ед. (единиц) заместо шт. А в карточке товара всё отлично склоняется. Всё получилось.

[Andrew S.]

Ссlk

[Andrew S.]

Помогите тут, пожалуйста.......

Сообщение отредактировал Andrew S.: 26 Март 2014 - 11:11

[Andrew S.]

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

1. После вставленного в main.js кода, обрезающего название товара в коротком списке, добавьте обрезание наименований для таблицы

$('.products-grid .product-name a').each(function(){
while ($(this).outerHeight() >= 41) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

Далее в main.css уменьшите высоту блока с названием товара в коде

.products-grid h2 {height:8em;overflow:hidden;font-size: 1em;}

задайте высоту 40px; и допишите margin:0;

Замените

.products-grid .availability { line-height:21px; }

на

.products-grid .availability { line-height:21px; display: inline-block;}

Теперь замените

.products-grid .price-box-for-regular-price { /*margin:17px 0 15px;*/ height:34px; }

на это

.products-grid .price-box-for-regular-price { /*margin:17px 0 15px;*/ min-height:20px !important; margin-top:10px; margin-bottom:0px;}

Здесь отредактируйте отступы по усмотрению (зеленое и фиолетовое расстояние).

2. Растянем строки по всей ширине добавлением

.products-list-2 li.item { width: 100%;}

Если правильно понял про лишние пиксели, то они уберутся при добавлении стилей

.products-list-2 .product-box {padding: 0;}

и в коде

.products-list-2 .product-name { vertical-align: middle; display: table-cell; height: 50px; line-height: 50px; padding: 0 5px; max-width: 55%;}

line-height задайте 49px;

Также добавьте

.products-list-2 .img { min-width: 52px;}

чтобы наименования товаров тоже начинались на одном уровне.


Границы картинок:

.products-list-2 li.item:nth-of-type(2n+1) .img { border: 1px solid #f1f1f1;}
.products-list-2 li.item:nth-of-type(2n+2) .img { border: 1px solid #fff; }

Чтобы выровнять картинки в своих блоках по центру, замените

.products-list-2 .img img { max-width: 50px; max-height: 50px; }

на

.products-list-2 .img img { max-width: 50px; max-height: 50px; margin:auto;}

Здравствуйте, Sengun. Подскажите, пожалуйста, как тут обрезать название чтобы любое название товара помещалось на одну строчку:

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

[Vaccina]

В шаблоне Товар найдите:

<h1 class="item-title-cards-h1" itemprop="name">{GOODS_NAME}</h1>

замените на:

<h1 class="item-title-cards-h1" itemprop="name" title="{GOODS_NAME}">{GOODS_NAME}</h1>

Далее в bootstrap-responsive.min.css найдите:

.row h1.item-title-cards-h1 {
	color: #854242;
	font-size: 13px;
	font-weight: 900;
}

замените на:

.row h1.item-title-cards-h1 {
	color: #854242;
	font-size: 13px;
	font-weight: 900;
	display: block;
	height: 20px;
	overflow: hidden;
}

[Andrew S.]

Vaccina (17 Апрель 2014 - 04:01) писал:

В шаблоне Товар найдите:

<h1 class="item-title-cards-h1" itemprop="name">{GOODS_NAME}</h1>

замените на:

<h1 class="item-title-cards-h1" itemprop="name" title="{GOODS_NAME}">{GOODS_NAME}</h1>

Далее в bootstrap-responsive.min.css найдите:

.row h1.item-title-cards-h1 {
color: #854242;
font-size: 13px;
font-weight: 900;
}

замените на:

.row h1.item-title-cards-h1 {
color: #854242;
font-size: 13px;
font-weight: 900;
display: block;
height: 20px;
overflow: hidden;
}

Да, всё так, только подставить еще многоточие "...", чтобы человек понимал, что название обрезано..

Мы ещё так сделали в каталоге..

[sengun]

Andrew S. (17 Апрель 2014 - 13:07) писал:

Да, всё так, только подставить еще многоточие "...", чтобы человек понимал, что название обрезано..

Мы ещё так сделали в каталоге..

Здравствуйте.
Если хотите сделать по такому же принципу, как в каталоге, то в bootstrap-responsive.min.css отмените последнее изменение (height: 20px; overflow: hidden;), а в main.js добавьте код

if ($('.item-title-cards-h1').length ){
while ($('.item-title-cards-h1').outerHeight() >= 35) {
$('.item-title-cards-h1').text($('.item-title-cards-h1').text().slice(0,-4)+'...');
}
}

сразу после

$('.products-grid .product-name a').each(function(){
while ($(this).outerHeight() >= 41) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

[Andrew S.]

sengun (17 Апрель 2014 - 19:37) писал:

Здравствуйте.
Если хотите сделать по такому же принципу, как в каталоге, то в bootstrap-responsive.min.css отмените последнее изменение (height: 20px; overflow: hidden;), а в main.js добавьте код

if ($('.item-title-cards-h1').length ){
while ($('.item-title-cards-h1').outerHeight() >= 35) {
$('.item-title-cards-h1').text($('.item-title-cards-h1').text().slice(0,-4)+'...');
}
}

сразу после

$('.products-grid .product-name a').each(function(){
while ($(this).outerHeight() >= 41) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

Да, спасибо. Теперь title товара обрезается как надо!

[Andrew S.]

sengun (17 Апрель 2014 - 19:37) писал:

Здравствуйте.
Если хотите сделать по такому же принципу, как в каталоге, то в bootstrap-responsive.min.css отмените последнее изменение (height: 20px; overflow: hidden;), а в main.js добавьте код

if ($('.item-title-cards-h1').length ){
while ($('.item-title-cards-h1').outerHeight() >= 35) {
$('.item-title-cards-h1').text($('.item-title-cards-h1').text().slice(0,-4)+'...');
}
}

сразу после

$('.products-grid .product-name a').each(function(){
while ($(this).outerHeight() >= 41) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

Здравствуйте! Помогите, пожалуйста, сделать такое же обрезающееся краткое описание товара в режиме краткого списка:

Цвет шрифта как в тексте, как строчка о наличии товара, темно-серый. Нежирный, обычный.
Подскажите, пожалуйста, какое число нужно будет сделать больше или меньше, чтобы выбрать оптимальную длину описания без увеличения высоты полей таблицы.
И, если можно, сделайте возможность выбора шрифта в ХХem или в другой форме, чтобы я вас потом не теребил и сам откорректировал величину шрифта.
Не знаю, 2 или три строки заняло бы описание. Поэтому бы сам сидел и подгонял.

Тут именно Sengun всегда помогал как надо сделать. Спасибо ему и лучше я бы подождал его ответа.

Сообщение отредактировал Andrew S.: 21 Апрель 2014 - 20:59

[Andrew S.]

Что-то у меня было уведомление, что здесь ответили, а ответа не вижу...

[sengun]

Andrew S. (20 Апрель 2014 - 18:03) писал:

Здравствуйте! Помогите, пожалуйста, сделать такое же обрезающееся краткое описание товара в режиме краткого списка:
Краткое описание.png
Цвет шрифта как в тексте, как строчка о наличии товара, темно-серый. Нежирный, обычный.
Подскажите, пожалуйста, какое число нужно будет сделать больше или меньше, чтобы выбрать оптимальную длину описания без увеличения высоты полей таблицы.
И, если можно, сделайте возможность выбора шрифта в ХХem или в другой форме, чтобы я вас потом не теребил и сам откорректировал величину шрифта.
Не знаю, 2 или три строки заняло бы описание. Поэтому бы сам сидел и подгонял.

Тут именно Sengun всегда помогал как надо сделать. Спасибо ему и лучше я бы подождал его ответа.

Здравствуйте.
В шаблоне "Товары" замените

<div style="float: left; display: table;">
<div class="span5 img">
<a href="{goods.URL | url_amp}" title="{goods.NAME}" class="thumbnail"><img class="goods-image-other" src="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png{% ELSE %}{goods.IMAGE_OTHER}{% ENDIF %}" alt="{goods.NAME}" /></a>
</div>
<h2 class="product-name"><a href="{goods.URL | url_amp}" title="{goods.NAME}">{goods.NAME}</a></h2>
</div>

на

<div style="float: left; display: table; width: 70%;">
<div class="span5 img">
<a href="{goods.URL | url_amp}" title="{goods.NAME}" class="thumbnail"><img class="goods-image-other" src="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png{% ELSE %}{goods.IMAGE_OTHER}{% ENDIF %}" alt="{goods.NAME}" /></a>
</div>
<div style="width: 85%; height: 50px; display: inline-block;">
<h2 class="product-name" {% IFNOT goods.DESCRIPTION_SHORT %}style="vertical-align: middle; display: table-cell; height: 50px; line-height: 49px; padding: 0 5px; max-width: 55%;"{% ENDIF %}><a href="{goods.URL | url_amp}" title="{goods.NAME}">{goods.NAME}</a></h2>
{% IF goods.DESCRIPTION_SHORT %}<div class="desc_short">{goods.DESCRIPTION_SHORT}</div>{% ENDIF %}
</div>
</div>

Далее в main.js замените

$('.products-list-2 .product-name a').each(function(){
while ($(this).outerWidth() >= 390) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

на такой код

$('.products-list-2 .product-name a').each(function(){
while ($(this).outerHeight() >= 21) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

$('.products-list-2 .desc_short').each(function(){
while ($(this).outerHeight() >= 31) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

И в main.css замените

.products-list-2 .product-name { vertical-align: middle; display: table-cell; height: 50px; line-height: 49px; padding: 0 5px; max-width: 55%;}
.products-list-2 .product-name a {font-size: 14px;}

на такой код

.products-list-2 .product-name { display: inline-block; padding: 0 5px; margin-bottom: 0;}
.products-list-2 .product-name a {font-size: 14px; line-height: 19px;}
.products-list-2 .desc_short { display: inline-block; padding: 0 5px; font-size: 11px; line-height: 15px; color: #858484;}

здесь .products-list-2 .desc_short - стили для того краткого описания. font-size: 11px - размер шрифта, line-height: 15px - высота строки, или интерлиньяж.

Немного о скриптах, обрубающих текст.
Данный скрипт

$('.products-list-2 .product-name a').each(function(){
while ($(this).outerHeight() >= 21) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

обрезает последние символы наименования товара до тех пор, пока высота блока не станет меньше или равной 20 пикселям.
Следующий скрипт

$('.products-list-2 .desc_short').each(function(){
while ($(this).outerHeight() >= 31) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

обрезает короткое описание товара до тех пор, пока блок, содержащий его не станет по высоте меньше или равен 30 пикселям.
Соответственно, высота ячейки товара не превысит 50 пикселей, какой бы длины не было описание и название товара.
И здесь, выходит, можно поиграться сразу с двумя стилями описания - размером шрифта и высотой строки. Если, например, размер шрифта сделать таким, что даже две его строки будут занимать больше 30 пикселей, т.е. текст обрежется до одной строки, то можно уменьшить высоту строки и тогда, две строки текста описания будут занимать по высоте меньше и могут обе уместиться в отведенное пространство.
Но есть одно "но", если сделать размер шрифта таким большим, что даже одна строка будет занимать по высоте больше 30 пикселей, то скрипт работать не будет. Но до такого, я думаю, не дойдет - для этого нужен действительно огромный шрифт.

[Andrew S.]

sengun (24 Апрель 2014 - 15:18) писал:

Здравствуйте.
В шаблоне "Товары" замените

<div style="float: left; display: table;">
<div class="span5 img">
<a href="{goods.URL | url_amp}" title="{goods.NAME}" class="thumbnail"><img class="goods-image-other" src="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png{% ELSE %}{goods.IMAGE_OTHER}{% ENDIF %}" alt="{goods.NAME}" /></a>
</div>
<h2 class="product-name"><a href="{goods.URL | url_amp}" title="{goods.NAME}">{goods.NAME}</a></h2>
</div>

на

<div style="float: left; display: table; width: 70%;">
<div class="span5 img">
<a href="{goods.URL | url_amp}" title="{goods.NAME}" class="thumbnail"><img class="goods-image-other" src="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png{% ELSE %}{goods.IMAGE_OTHER}{% ENDIF %}" alt="{goods.NAME}" /></a>
</div>
<div style="width: 85%; height: 50px; display: inline-block;">
<h2 class="product-name" {% IFNOT goods.DESCRIPTION_SHORT %}style="vertical-align: middle; display: table-cell; height: 50px; line-height: 49px; padding: 0 5px; max-width: 55%;"{% ENDIF %}><a href="{goods.URL | url_amp}" title="{goods.NAME}">{goods.NAME}</a></h2>
{% IF goods.DESCRIPTION_SHORT %}<div class="desc_short">{goods.DESCRIPTION_SHORT}</div>{% ENDIF %}
</div>
</div>

Далее в main.js замените

$('.products-list-2 .product-name a').each(function(){
while ($(this).outerWidth() >= 390) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

на такой код

$('.products-list-2 .product-name a').each(function(){
while ($(this).outerHeight() >= 21) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

$('.products-list-2 .desc_short').each(function(){
while ($(this).outerHeight() >= 31) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

И в main.css замените

.products-list-2 .product-name { vertical-align: middle; display: table-cell; height: 50px; line-height: 49px; padding: 0 5px; max-width: 55%;}
.products-list-2 .product-name a {font-size: 14px;}

на такой код

.products-list-2 .product-name { display: inline-block; padding: 0 5px; margin-bottom: 0;}
.products-list-2 .product-name a {font-size: 14px; line-height: 19px;}
.products-list-2 .desc_short { display: inline-block; padding: 0 5px; font-size: 11px; line-height: 15px; color: #858484;}

здесь .products-list-2 .desc_short - стили для того краткого описания. font-size: 11px - размер шрифта, line-height: 15px - высота строки, или интерлиньяж.

Немного о скриптах, обрубающих текст.
Данный скрипт

$('.products-list-2 .product-name a').each(function(){
while ($(this).outerHeight() >= 21) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

обрезает последние символы наименования товара до тех пор, пока высота блока не станет меньше или равной 20 пикселям.
Следующий скрипт

$('.products-list-2 .desc_short').each(function(){
while ($(this).outerHeight() >= 31) {
$(this).text($(this).text().slice(0,-4)+'...');
}
});

обрезает короткое описание товара до тех пор, пока блок, содержащий его не станет по высоте меньше или равен 30 пикселям.
Соответственно, высота ячейки товара не превысит 50 пикселей, какой бы длины не было описание и название товара.
И здесь, выходит, можно поиграться сразу с двумя стилями описания - размером шрифта и высотой строки. Если, например, размер шрифта сделать таким, что даже две его строки будут занимать больше 30 пикселей, т.е. текст обрежется до одной строки, то можно уменьшить высоту строки и тогда, две строки текста описания будут занимать по высоте меньше и могут обе уместиться в отведенное пространство.
Но есть одно "но", если сделать размер шрифта таким большим, что даже одна строка будет занимать по высоте больше 30 пикселей, то скрипт работать не будет. Но до такого, я думаю, не дойдет - для этого нужен действительно огромный шрифт.

Огого.. Попробую сейчас...

[Andrew S.]

Со шрифтом всё нормально получилось, спасибо!


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

1. Помогите уменьшить три междустрочных интервала в каждой ячейке, это надо куда-то вставить функцию line-height: ХХpx; ?
Нашел междустрочный интервал! Сразу и не понял, что это интерлиньяж.. Помогите отцентрировать по вертикали информацию во всех ячейках:


2. Можно ли по аналогии с наведением на название товара сделать такое же отображение при наведении на описание? Простейшую такую выплывающую подсказку, как на первом изображении и тут: