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

[Andrew S.]

Добрый день!

Подскажите, что несёт за собой такая идея? Реализуема ли она здесь?



А то людям тяжело смотреть товары...

[Vaccina]

Тут пожалуй больше в удобстве дело, данная таблица компактна и в первые секунды клиент увидит множество товаров, что увеличивает процент проявления большего интереса к ним или к конкретному.
По подобному вопросу уже имеются инструкции по реализации:
http://forum.storela...дификация-цена/

[Andrew S.]

Vaccina (14 Март 2015 - 05:42) писал:

Тут пожалуй больше в удобстве дело, данная таблица компактна и в первые секунды клиент увидит множество товаров, что увеличивает процент проявления большего интереса к ним или к конкретному.
По подобному вопросу уже имеются инструкции по реализации:
http://forum.storela...дификация-цена/

Вакцина, вы же знаете, я не знаю как и куда всё это вставлять. И мне та таблица не очень нравится. Мне бы как на скриншоте.. Правда тёмный фон уже сменился на светлый..

[Vaccina]

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

<ul>
										 {% IF GOODS_VIEW_TYPE=2 %}
											 <li><a href="?goods_view_type=2" class="btn table current"></a></li>
											 <li><a href="?goods_view_type=1" class="btn list "></a></li>
										 {% ELSE %}
											 <li><a href="?goods_view_type=2" class="btn table "></a></li>
											 <li><a href="?goods_view_type=1" class="btn list current"></a></li>
										 {% ENDIF %}
									 </ul>

замените на:

<ul>
		
										 {% IF GOODS_VIEW_TYPE=2 %}
											 <li><a href="?goods_view_type=2" class="btn table current"></a></li>
											 <li><a href="?goods_view_type=1" class="btn list "></a></li>
		 <li><a href="?goods_view_type=3" class="btn table_mini "></a></li>
										 {% ELSEIF GOODS_VIEW_TYPE=1 %}
											 <li><a href="?goods_view_type=2" class="btn table "></a></li>
											 <li><a href="?goods_view_type=1" class="btn list current"></a></li>
		 <li><a href="?goods_view_type=3" class="btn table_mini "></a></li>
		 {% ELSE %}
											 <li><a href="?goods_view_type=2" class="btn table"></a></li>
											 <li><a href="?goods_view_type=1" class="btn list "></a></li>
		 <li><a href="?goods_view_type=3" class="btn table_mini current"></a></li>
										 {% ENDIF %}
									 </ul>

Далее в main.css найдите:

a.btn.table.current,a.btn.table:hover {
background-position: -25px -1px;
}
a.btn.list, a.btn.table {
transition: none;
transition-duration: 300s;
}

замените на:

a.btn.table_mini {
background: url('{ASSETS_IMAGES_PATH}sprites3.png?design=snow') no-repeat 11px 9px #fff;
background-position: -25px -28px;
}
a.btn.table.current,a.btn.table:hover, a.btn.table_mini:hover {
background-position: -25px -1px;
}
a.btn.list, a.btn.table, a.btn.table_mini {
transition: none;
transition-duration: 300s;
}

Далее скачайте файл sprites2.png на его основе создайте файл для 2 иконок sprites3.png для 3го вида отображения товаров и загрузите в редактор шаблонов, старый файл не удаляйте

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

<!-- Если отображаем товары списком -->
										 {% IF GOODS_VIEW_TYPE=1 %}

замените на:

<!-- Если отображаем товары мелкой таблицей -->
										 {% IF GOODS_VIEW_TYPE=3 %}
		 <div class="goods-list table_mini">
						 <!-- Проходим по массиву товаров -->
						 {% FOR goods %}
							 <figure class="goodsList">
								 <div class="goodListMain clr">
									 <div class="goodsListImg">
										 <!-- Бирки -->
									 {% IF goods.IS_NEW %}
										 <div class="menu-item-badges new">
											 <a href="{CATALOG_NEW_URL}" title="Перейти на страницу &laquo;Новинки&raquo;"><span>Новинка</span></a>
										 </div>
									 {% ELSEIF goods.IS_TOP %}
										 <div class="menu-item-badges hit">
											 <a href="{CATALOG_TOP_SALES_URL}" title="Перейти на страницу &laquo;Хит Продаж&raquo;"><span>Хит Продаж</span></a>
										 </div>
									 {% ELSEIF goods.MAX_DISCOUNT>0 %}
										 <div class="menu-item-badges disc">
											 <a href="{goods.MAX_DISCOUNT_URL}" title="Перейти на страницу &laquo;Акции&raquo;"><span>Скидка</span><span class="discNum"> {goods.MAX_DISCOUNT}%</span></a>
										 </div>
									 {% ENDIF %}
									 <!-- END Бирки -->
										 <div class="goodsListImgBlcok">
											 <div class="catalog-gallery-img">
												 {% FOR images %}
													 {% IF goods.images.first %}
														 <a class="menu-item-icon" title="{goods.images.NAME}" target="_blank" href="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png?design=snow{% ELSE %}{goods.images.LARGE}{% ENDIF %}">
															 <div class="zoom">
															 </div>
														 </a>
													 {% ELSE %}
														 <a itemprop="image" href="{goods.images.LARGE}" target="_blank" title="{goods.images.NAME}"></a>
													 {% ENDIF %}
												 {% ENDFOR images %}
											 </div>
											 <a href="{goods.URL}"><img src="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png?design=snow{% ELSE %}{goods.IMAGE_SMALL}{% ENDIF %}" alt="{goods.NAME}" /></a>
										 </div>
										 <div class="goodsListStik"></div>
									 </div>
									 <div class="goodsListContent">
<div class="info">
<h3 class="goodsListNameTovar">
<a href="{goods.URL}" title="Перейти на страницу &laquo;{goods.NAME}&raquo;">{goods.NAME}</a>
</h3>
<div class="goodsListDesc">
<div class="descShort">
{% IF goods.DESCRIPTION_SHORT %}{goods.DESCRIPTION_SHORT}{% ENDIF %}
</div>
</div>
</div>
										 <div class="goodsListPriceBlock">
											 <div class="prices">
												 <ul class="cost">
													 <!-- Старая цена -->
													 {% IF goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>goods.MIN_PRICE_NOW %}
														 <li class="last">{goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | money_format}</li>
													 {% ELSEIF goods.MIN_PRICE_OLD>goods.MIN_PRICE_NOW %}
														 <li class="last">{goods.MIN_PRICE_OLD | money_format}</li>
													 {% ENDIF %}
													 <!-- END Старая цена -->
													
													
													
<li class="minPrice">Макс. цена: {goods.MIN_PRICE_NOW | money_format}.</li>
{% IF goods.MIN_REST_VALUE = 0 %}
<li class="availability false">На заказ со склада партнёра.</li>
{% ELSE %}
<li class="availability true">Есть в наличии в Хабаровске.</li>
{% ENDIF %}
													
													
												 </ul>
											 </div>
											 <div class="goodsToCartBlock">
												 <!-- Если товара нет в наличие и в настройках отключена возможность класть -->
												 {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE && goods.MAX_REST_VALUE==0 %}
													 <div class="tovar-available">
														 <span rel="false" class="catalog-available-false" >
															 <div class="stikno">Товара нет в наличии</div>
														 </span>
													 </div>
												 {%ELSE%}
													 <!-- форма добавления в корзину -->
													 <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" id="goodsListFormId{goods.MIN_PRICE_NOW_ID}" class="goodsListForm">
														 <div class="btnToCart">
															 <input type="hidden" name="hash" value="{HASH}" />
															 <input type="hidden" name="form[goods_from]" value="{goods.GOODS_FROM}" />
															 <input type="hidden" name="form[goods_mod_id]" value="{goods.MIN_PRICE_NOW_ID}" />
															 <!-- кнопка добавить в корзину -->
															 <a class="btn toCart btn-success" onclick="addItem('#goodsListFormId{goods.MIN_PRICE_NOW_ID}');
																	 return false;" href="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}?hash={HASH | url_amp}&amp;form%5Bgoods_from%5D={goods.GOODS_FROM}&amp;form%5Bgoods_mod_id%5D={goods.MIN_PRICE_NOW_ID}" title="Положить &laquo;{goods.NAME}&raquo; в корзину">
																 В корзину
																 <span class="basket_add"></span>
															 </a>
														 </div>
														 <div class="numeric">
															 <input type="number" name="form[goods_mod_quantity]" class="quantity" min="1" max="9999" step="1" value="1" title="Количество">
														 </div>
													 </form>
													 <!-- END форма добавления в корзину -->
												 {% ENDIF %}
												 <!-- Если есть возможность добавить товар в избранное -->
												 {% IF goods.IS_HAS_IN_FAVORITES_LIST %}
													 <a class="wishlist add_to_wishlist_small_text added"
														 data-action-is-add="0"
														 data-action-add-url="{FAVORITES_ADD_URL}"
														 data-action-delete-url="{FAVORITES_DELETE_URL}"
														 data-action-add-title="Добавить «{goods.NAME}» в избранное"
														 data-action-delete-title="Убрать «{goods.NAME}» из избранного"
														 data-action-text-add="Добавить в избранное"
														 data-action-text-delete="Удалить из избранного"
														 title="Убрать «{goods.NAME}» из избранного"
														 href="{FAVORITES_DELETE_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;return_to={CURRENT_URL | urlencode}"
														 >Удалить из избранного</a>
												 {% ELSE %}
													 <a class="wishlist add_to_wishlist_small_text"
														 data-action-is-add="1"
														 data-action-add-url="{FAVORITES_ADD_URL}"
														 data-action-delete-url="{FAVORITES_DELETE_URL}"
														 data-action-add-title="Добавить «{goods.NAME}» в избранное"
														 data-action-delete-title="Убрать «{goods.NAME}» из избранного"
														 data-action-text-add="Добавить в избранное"
														 data-action-text-delete="Удалить из избранного"
														 title="Добавить «{goods.NAME}» в избранное" href="{FAVORITES_ADD_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;return_to={CURRENT_URL | urlencode}"
														 >Добавить в избранное</a>
												 {% ENDIF %}
												 <!-- END Если есть возможность добавить товар в избранное -->
												 <!-- Если в тарифном плане подключен модуль сравнения товаров и он не выключен в настройках магазина -->
												 {% IF TARIFF_FEATURE_GOODS_COMPARE && SETTINGS_COMPARE_DISABLE=0 %}
													 {% IF goods.IS_HAS_IN_COMPARE_LIST %}
														 <a class="compare add_to_compare_small_text added"
															 data-action-is-add="0"
															 data-action-add-url="{COMPARE_ADD_URL}"
															 data-action-delete-url="{COMPARE_DELETE_URL}"
															 data-action-add-title="Добавить «{goods.NAME}» в список сравнения с другими товарами"
															 data-action-delete-title="Убрать «{goods.NAME}» из списка сравнения с другими товарами"
															 data-action-text-add="Добавить к сравнению"
															 data-action-text-delete="Убрать из сравнения"
															 title="Убрать «{goods.NAME}» из списка сравнения с другими товарами"
															 href="{COMPARE_DELETE_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;from={goods.GOODS_FROM}&amp;return_to={CURRENT_URL | urlencode}"
															 >Убрать из сравнения</a>
													 {% ELSE %}
														 <a class="compare add_to_compare_small_text"
															 data-action-is-add="1"
															 data-action-add-url="{COMPARE_ADD_URL}"
															 data-action-delete-url="{COMPARE_DELETE_URL}"
															 data-action-add-title="Добавить «{goods.NAME}» в список сравнения с другими товарами"
															 data-action-delete-title="Убрать «{goods.NAME}» из списка сравнения с другими товарами"
															 data-action-text-add="Добавить к сравнению"
															 data-action-text-delete="Убрать из сравнения"
															 title="Добавить «{goods.NAME}» в список сравнения с другими товарами"
															 href="{COMPARE_ADD_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;from={goods.GOODS_FROM}&amp;return_to={CURRENT_URL | urlencode}"
															 >Добавить к сравнению</a>
													 {% ENDIF %}
												 {% ENDIF %}
												 <!-- END Если в тарифном плане подключен модуль сравнения товаров и он не выключен в настройках магазина -->
											 </div>
										 </div>
									 </div>
								 </div>
							 </figure>
						 {% ENDFOR goods%}
						 <!-- Проходим по массиву товаров -->
					 </div>
		
		
		
		 <!-- Если отображаем товары списком -->
										 {% ELSEIF GOODS_VIEW_TYPE=1 %}

После данного изменения 3 вид должен отображаться как товары списком, их остается простилизовать, в main.css после

.goodsTableButton>form {
max-width: 100%;
height: 50px;
padding: 0px 5%;
}

вставьте:

.table_mini figure .goodsListImg {
width: 10%;
}
.table_mini figure .goodsListContent {
padding-left: 5px;
width: 90%;
}
.table_mini figure .info {
float: left;
width: 50%;
}
.table_mini figure .goodsListPriceBlock {
border-left: 1px solid #444;
float: right;
padding: 0 5px;
width: 50%;
}
.table_mini figure .goodsListForm {
float: left;
width: 50%;
}
.table_mini figure .goodsToCartBlock > a {
float: right;
min-width: 150px;
width: 40%;
}

[Andrew S.]

Vaccina (31 Март 2015 - 01:46) писал:

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

<ul>
										 {% IF GOODS_VIEW_TYPE=2 %}
											 <li><a href="?goods_view_type=2" class="btn table current"></a></li>
											 <li><a href="?goods_view_type=1" class="btn list "></a></li>
										 {% ELSE %}
											 <li><a href="?goods_view_type=2" class="btn table "></a></li>
											 <li><a href="?goods_view_type=1" class="btn list current"></a></li>
										 {% ENDIF %}
									 </ul>

замените на:

<ul>
		
										 {% IF GOODS_VIEW_TYPE=2 %}
											 <li><a href="?goods_view_type=2" class="btn table current"></a></li>
											 <li><a href="?goods_view_type=1" class="btn list "></a></li>
		 <li><a href="?goods_view_type=3" class="btn table_mini "></a></li>
										 {% ELSEIF GOODS_VIEW_TYPE=1 %}
											 <li><a href="?goods_view_type=2" class="btn table "></a></li>
											 <li><a href="?goods_view_type=1" class="btn list current"></a></li>
		 <li><a href="?goods_view_type=3" class="btn table_mini "></a></li>
		 {% ELSE %}
											 <li><a href="?goods_view_type=2" class="btn table"></a></li>
											 <li><a href="?goods_view_type=1" class="btn list "></a></li>
		 <li><a href="?goods_view_type=3" class="btn table_mini current"></a></li>
										 {% ENDIF %}
									 </ul>

Далее в main.css найдите:

a.btn.table.current,a.btn.table:hover {
background-position: -25px -1px;
}
a.btn.list, a.btn.table {
transition: none;
transition-duration: 300s;
}

замените на:

a.btn.table_mini {
background: url('{ASSETS_IMAGES_PATH}sprites3.png?design=snow') no-repeat 11px 9px #fff;
background-position: -25px -28px;
}
a.btn.table.current,a.btn.table:hover, a.btn.table_mini:hover {
background-position: -25px -1px;
}
a.btn.list, a.btn.table, a.btn.table_mini {
transition: none;
transition-duration: 300s;
}

Далее скачайте файл sprites2.png на его основе создайте файл для 2 иконок sprites3.png для 3го вида отображения товаров и загрузите в редактор шаблонов, старый файл не удаляйте

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

<!-- Если отображаем товары списком -->
										 {% IF GOODS_VIEW_TYPE=1 %}

замените на:

<!-- Если отображаем товары мелкой таблицей -->
										 {% IF GOODS_VIEW_TYPE=3 %}
		 <div class="goods-list table_mini">
						 <!-- Проходим по массиву товаров -->
						 {% FOR goods %}
							 <figure class="goodsList">
								 <div class="goodListMain clr">
									 <div class="goodsListImg">
										 <!-- Бирки -->
									 {% IF goods.IS_NEW %}
										 <div class="menu-item-badges new">
											 <a href="{CATALOG_NEW_URL}" title="Перейти на страницу &laquo;Новинки&raquo;"><span>Новинка</span></a>
										 </div>
									 {% ELSEIF goods.IS_TOP %}
										 <div class="menu-item-badges hit">
											 <a href="{CATALOG_TOP_SALES_URL}" title="Перейти на страницу &laquo;Хит Продаж&raquo;"><span>Хит Продаж</span></a>
										 </div>
									 {% ELSEIF goods.MAX_DISCOUNT>0 %}
										 <div class="menu-item-badges disc">
											 <a href="{goods.MAX_DISCOUNT_URL}" title="Перейти на страницу &laquo;Акции&raquo;"><span>Скидка</span><span class="discNum"> {goods.MAX_DISCOUNT}%</span></a>
										 </div>
									 {% ENDIF %}
									 <!-- END Бирки -->
										 <div class="goodsListImgBlcok">
											 <div class="catalog-gallery-img">
												 {% FOR images %}
													 {% IF goods.images.first %}
														 <a class="menu-item-icon" title="{goods.images.NAME}" target="_blank" href="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png?design=snow{% ELSE %}{goods.images.LARGE}{% ENDIF %}">
															 <div class="zoom">
															 </div>
														 </a>
													 {% ELSE %}
														 <a itemprop="image" href="{goods.images.LARGE}" target="_blank" title="{goods.images.NAME}"></a>
													 {% ENDIF %}
												 {% ENDFOR images %}
											 </div>
											 <a href="{goods.URL}"><img src="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png?design=snow{% ELSE %}{goods.IMAGE_SMALL}{% ENDIF %}" alt="{goods.NAME}" /></a>
										 </div>
										 <div class="goodsListStik"></div>
									 </div>
									 <div class="goodsListContent">
<div class="info">
<h3 class="goodsListNameTovar">
<a href="{goods.URL}" title="Перейти на страницу &laquo;{goods.NAME}&raquo;">{goods.NAME}</a>
</h3>
<div class="goodsListDesc">
<div class="descShort">
{% IF goods.DESCRIPTION_SHORT %}{goods.DESCRIPTION_SHORT}{% ENDIF %}
</div>
</div>
</div>
										 <div class="goodsListPriceBlock">
											 <div class="prices">
												 <ul class="cost">
													 <!-- Старая цена -->
													 {% IF goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>goods.MIN_PRICE_NOW %}
														 <li class="last">{goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | money_format}</li>
													 {% ELSEIF goods.MIN_PRICE_OLD>goods.MIN_PRICE_NOW %}
														 <li class="last">{goods.MIN_PRICE_OLD | money_format}</li>
													 {% ENDIF %}
													 <!-- END Старая цена -->
													
													
													
<li class="minPrice">Макс. цена: {goods.MIN_PRICE_NOW | money_format}.</li>
{% IF goods.MIN_REST_VALUE = 0 %}
<li class="availability false">На заказ со склада партнёра.</li>
{% ELSE %}
<li class="availability true">Есть в наличии в Хабаровске.</li>
{% ENDIF %}
													
													
												 </ul>
											 </div>
											 <div class="goodsToCartBlock">
												 <!-- Если товара нет в наличие и в настройках отключена возможность класть -->
												 {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE && goods.MAX_REST_VALUE==0 %}
													 <div class="tovar-available">
														 <span rel="false" class="catalog-available-false" >
															 <div class="stikno">Товара нет в наличии</div>
														 </span>
													 </div>
												 {%ELSE%}
													 <!-- форма добавления в корзину -->
													 <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" id="goodsListFormId{goods.MIN_PRICE_NOW_ID}" class="goodsListForm">
														 <div class="btnToCart">
															 <input type="hidden" name="hash" value="{HASH}" />
															 <input type="hidden" name="form[goods_from]" value="{goods.GOODS_FROM}" />
															 <input type="hidden" name="form[goods_mod_id]" value="{goods.MIN_PRICE_NOW_ID}" />
															 <!-- кнопка добавить в корзину -->
															 <a class="btn toCart btn-success" onclick="addItem('#goodsListFormId{goods.MIN_PRICE_NOW_ID}');
																	 return false;" href="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}?hash={HASH | url_amp}&amp;form%5Bgoods_from%5D={goods.GOODS_FROM}&amp;form%5Bgoods_mod_id%5D={goods.MIN_PRICE_NOW_ID}" title="Положить &laquo;{goods.NAME}&raquo; в корзину">
																 В корзину
																 <span class="basket_add"></span>
															 </a>
														 </div>
														 <div class="numeric">
															 <input type="number" name="form[goods_mod_quantity]" class="quantity" min="1" max="9999" step="1" value="1" title="Количество">
														 </div>
													 </form>
													 <!-- END форма добавления в корзину -->
												 {% ENDIF %}
												 <!-- Если есть возможность добавить товар в избранное -->
												 {% IF goods.IS_HAS_IN_FAVORITES_LIST %}
													 <a class="wishlist add_to_wishlist_small_text added"
														 data-action-is-add="0"
														 data-action-add-url="{FAVORITES_ADD_URL}"
														 data-action-delete-url="{FAVORITES_DELETE_URL}"
														 data-action-add-title="Добавить «{goods.NAME}» в избранное"
														 data-action-delete-title="Убрать «{goods.NAME}» из избранного"
														 data-action-text-add="Добавить в избранное"
														 data-action-text-delete="Удалить из избранного"
														 title="Убрать «{goods.NAME}» из избранного"
														 href="{FAVORITES_DELETE_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;return_to={CURRENT_URL | urlencode}"
														 >Удалить из избранного</a>
												 {% ELSE %}
													 <a class="wishlist add_to_wishlist_small_text"
														 data-action-is-add="1"
														 data-action-add-url="{FAVORITES_ADD_URL}"
														 data-action-delete-url="{FAVORITES_DELETE_URL}"
														 data-action-add-title="Добавить «{goods.NAME}» в избранное"
														 data-action-delete-title="Убрать «{goods.NAME}» из избранного"
														 data-action-text-add="Добавить в избранное"
														 data-action-text-delete="Удалить из избранного"
														 title="Добавить «{goods.NAME}» в избранное" href="{FAVORITES_ADD_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;return_to={CURRENT_URL | urlencode}"
														 >Добавить в избранное</a>
												 {% ENDIF %}
												 <!-- END Если есть возможность добавить товар в избранное -->
												 <!-- Если в тарифном плане подключен модуль сравнения товаров и он не выключен в настройках магазина -->
												 {% IF TARIFF_FEATURE_GOODS_COMPARE && SETTINGS_COMPARE_DISABLE=0 %}
													 {% IF goods.IS_HAS_IN_COMPARE_LIST %}
														 <a class="compare add_to_compare_small_text added"
															 data-action-is-add="0"
															 data-action-add-url="{COMPARE_ADD_URL}"
															 data-action-delete-url="{COMPARE_DELETE_URL}"
															 data-action-add-title="Добавить «{goods.NAME}» в список сравнения с другими товарами"
															 data-action-delete-title="Убрать «{goods.NAME}» из списка сравнения с другими товарами"
															 data-action-text-add="Добавить к сравнению"
															 data-action-text-delete="Убрать из сравнения"
															 title="Убрать «{goods.NAME}» из списка сравнения с другими товарами"
															 href="{COMPARE_DELETE_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;from={goods.GOODS_FROM}&amp;return_to={CURRENT_URL | urlencode}"
															 >Убрать из сравнения</a>
													 {% ELSE %}
														 <a class="compare add_to_compare_small_text"
															 data-action-is-add="1"
															 data-action-add-url="{COMPARE_ADD_URL}"
															 data-action-delete-url="{COMPARE_DELETE_URL}"
															 data-action-add-title="Добавить «{goods.NAME}» в список сравнения с другими товарами"
															 data-action-delete-title="Убрать «{goods.NAME}» из списка сравнения с другими товарами"
															 data-action-text-add="Добавить к сравнению"
															 data-action-text-delete="Убрать из сравнения"
															 title="Добавить «{goods.NAME}» в список сравнения с другими товарами"
															 href="{COMPARE_ADD_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;from={goods.GOODS_FROM}&amp;return_to={CURRENT_URL | urlencode}"
															 >Добавить к сравнению</a>
													 {% ENDIF %}
												 {% ENDIF %}
												 <!-- END Если в тарифном плане подключен модуль сравнения товаров и он не выключен в настройках магазина -->
											 </div>
										 </div>
									 </div>
								 </div>
							 </figure>
						 {% ENDFOR goods%}
						 <!-- Проходим по массиву товаров -->
					 </div>
		
		
		
		 <!-- Если отображаем товары списком -->
										 {% ELSEIF GOODS_VIEW_TYPE=1 %}

После данного изменения 3 вид должен отображаться как товары списком, их остается простилизовать, в main.css после

.goodsTableButton>form {
max-width: 100%;
height: 50px;
padding: 0px 5%;
}

вставьте:

.table_mini figure .goodsListImg {
width: 10%;
}
.table_mini figure .goodsListContent {
padding-left: 5px;
width: 90%;
}
.table_mini figure .info {
float: left;
width: 50%;
}
.table_mini figure .goodsListPriceBlock {
border-left: 1px solid #444;
float: right;
padding: 0 5px;
width: 50%;
}
.table_mini figure .goodsListForm {
float: left;
width: 50%;
}
.table_mini figure .goodsToCartBlock > a {
float: right;
min-width: 150px;
width: 40%;
}

Долго боялся это начать! Вот начал. Спасибо. Сейчас напишу какие мелкие недочёты подправить бы хотелось...

[Andrew S.]

У меня самостоятельно не получается подправить, всё начинает съезжать.

Вот скриншот:



1. Расширить немного поле для количества выводимых товаров на страницу. Оно уже давно смущало, туда цифра 100 никогда не помещалась.

2. Поставить иконки на расстоянии 10 пикселей друг от друга, а от они аж пирамидкой встали:



Так они раньше были.

3. Убрать вертикальные линии между левой частью и правой.

4. Расширить поле с названием и описанием товара, многое не вмещается.

5. Поставить по-середине по-вертикали блок с количеством и кнопкой "Купить".

6. При нажатии кнопки "Добавить в избранное" - надпись смещается и смещается "Добавить к сравнению". Как бы сделать так, чтобы ничто не уползало никуда..



7. Подскажите, где искать эти избранные товары, т.к. они нигде не отображаются? Нашёл

8. Когда нажимаю кнопку "Добавить к сравнению", появляется чёрная надпись вверху около поиска и меню корзины:



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

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

[Firefly]

Andrew S. (25 Апрель 2015 - 16:06) писал:

У меня самостоятельно не получается подправить, всё начинает съезжать.

Вот скриншот:

Kratlij-spisok-nakonec-to.png

1. Расширить немного поле для количества выводимых товаров на страницу. Оно уже давно смущало, туда цифра 100 никогда не помещалась.

2. Поставить иконки на расстоянии 10 пикселей друг от друга, а от они аж пирамидкой встали:

10px.png

Так они раньше были.

1. Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css найдите код:

}
select[name='per_page'] {
width: 52px
}

Замените на:

}
select[name='per_page'] {
width: 55px
}

2. В main.css найдите код:

.cort .left ul {
float: left;
width: 22%;

Замените на:

.cort .left ul {
float: left;
width: 35%;

Найдите код:

.cort .left ul li {
float: left;
width: 30px;
height: 30px;
padding-left: 10px;
}

Замените на:

.cort .left ul li {
float: left;
width: 40px;
height: 30px;
padding-left: 10px;
}

3, 4. В main.css найдите код:

.table_mini figure .info {
float: left;
width: 50%;
}

Замените на:

.table_mini figure .info {
float: left;
width: 52%;
}

Найдите код:

.table_mini figure .goodsListPriceBlock {
border-left: 1px solid #444;
float: right;
padding: 0 5px;
width: 50%;
}

Замените на:

.table_mini figure .goodsListPriceBlock {
float: right;
padding: 0 5px;
width: 48%;
}

[Andrew S.]

Вот смотрите:



Я предлагаю:

А. В поле 3 уменьшить целиком эти две надписи с иконками процентов на 10. Можно так сделать? Так всё будет помещаться при нажатии. И по возможности сократить ширину этого поля для увеличения основного поля 2 по ширине.

Б. А вот лишнее поле 1 - сократить по ширине, увеличив на такое же расстояние по ширине поле 2.

В. Размер шрифта в поле 1 сделать таким же как в поле 2:



Тогда всё будет помещаться гораздо эффективнее.

Г. Также заметил проблему небольшую. Если активен режим таблицы или списка с крупным отображением, то значки тёмные:



А когда активен наш новый режим, кнопка не становится тёмной, она только при наведении темнеет:



А также значки смещены на 1 пиксель влево, нужно подвинуть на 1 пиксель вправо:



Д. В адаптивном шаблоне. Стали как-то странно смещены значки смены режима отображения каталога. И в "Пункте А" я предлагаю уменьшить 2 надписи с иконками, может они как раз будут помещаться.

Сообщение отредактировал Andrew S.: 28 Апрель 2015 - 09:10

[Ирина345]

Andrew S. (25 Апрель 2015 - 19:06) писал:

Вот смотрите:

Polya.png

Я предлагаю:

А. В поле 3 уменьшить целиком эти две надписи с иконками процентов на 10. Можно так сделать? Так всё будет помещаться при нажатии. И по возможности сократить ширину этого поля для увеличения основного поля 2 по ширине.

Б. А вот лишнее поле 1 - сократить по ширине, увеличив на такое же расстояние по ширине поле 2.

В. Размер шрифта в поле 1 сделать таким же как в поле 2:

Font-size.png


Тогда всё будет помещаться гораздо эффективнее.

Г. Также заметил проблему небольшую. Если активен режим таблицы или списка с крупным отображением, то значки тёмные:

Knopki_tab.png Knopki_spis_krup.png

А когда активен наш новый режим, кнопка не становится тёмной, она только при наведении темнеет:

Knopki_spis_melkij.png Knopki_spis_melkij2.png

Д. В адаптивном шаблоне. Стали как-то странно смещены значки смены режима отображения каталога. И в "Пункте А" я предлагаю уменьшить 2 надписи с иконками, может они как раз будут помещаться.

Screen73.jpg

Здравствуйте, в конец main.css добавьте

.descShort {
  font-size: 1.2em;
}

a.btn.table_mini.current {
  background-position: -25px -1px;
}

[Andrew S.]

Ирина345 (27 Апрель 2015 - 11:49) писал:

Здравствуйте, в конец main.css добавьте

.descShort {
font-size: 1.2em;
}

a.btn.table_mini.current {
background-position: -25px -1px;
}

Вакцина, помогите, пожалуйста, тут. Они неправильно всё понимают и помощь только почему-то выборочная. Вообще не то подсказали. Шрифт увеличился у описания товаров. А нужно было, чтобы уменьшился шрифт у описания наличия.

[Andrew S.]

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



Видно, же, что идёт диспропорция.

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

И в остальном - поля подрегулировать...

[Ирина345]

Andrew S. (28 Апрель 2015 - 08:20) писал:

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

Disproporciya.png

Видно, же, что идёт диспропорция.

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

И в остальном - поля подрегулировать...

Здравствуйте,
найдите а main.css

.table_mini figure .goodsToCartBlock > a {
  float: right;
  min-width: 150px;
  width: 40%;
}

замените на

.table_mini figure .goodsToCartBlock > a {
  float: right;
  min-width: 150px;
  width: 40%;
  margin-top: -7px;
}

Что бы уменьшить размер надписи о наличие добавьте в конец файла

li.availability {
  font-size: 14px;
}

[Andrew S.]

Ирина345 (28 Апрель 2015 - 10:17) писал:

Здравствуйте,
найдите а main.css

.table_mini figure .goodsToCartBlock > a {
float: right;
min-width: 150px;
width: 40%;
}

замените на

.table_mini figure .goodsToCartBlock > a {
float: right;
min-width: 150px;
width: 40%;
margin-top: -7px;
}

Что бы уменьшить размер надписи о наличие добавьте в конец файла

li.availability {
font-size: 14px;
}

Спасибо, но прежде чем что-то писать - нужно, же, наверное, подумать: последний код меняет размер шрифта в любом режиме отображения каталога. Я даже думал его не вставлять. Но потом чисто для интереса вставил и убедился в том, что сразу это понял.

Придётся всё заново описывать. Будет сообщение номер 14 (четырнадцать).

[Andrew S.]

Вот исходное изображение:



1. Как видно, значки смещены на 1 пиксель влево, что смотрится коряво:



Если их троих сдвинуть на 1 пиксель вправо, будет ровно:



2. Неэффективно заняты места в таблице для данных. Для некоторых товаров может не хватать места для текста и он будет вылазить внизу:



Вот если сместить границу между инфо и правой частью:



И смотрится лучше.

3. Слишком крупный шрифт о том, есть товар или нет в наличии:



Вот как если его уменьшить:



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

4. Вот что становится с таблицей при нажатии на "Добавить в избранное:



Наверное потому, что это не помещается в ячейку в таблице:



Нужно расширить эту ячейку влево по горизонтали:



Чтобы всё помещалось:



5. В адаптивном шаблоне нарушилось положение кнопок вида каталога и "Добавить к сравнению и в избранное" - прячутся начала этих строк.



Разве не плохо ли сделать так, чтобы это отображалось теперь правильно?

Оно так отображается после инструкций и изменений, которые были проведены в этой теме.

Надеюсь на разрешение этих проблем.

[Vaccina]

1. В main.css найдите:

.cort .left ul li {
  float: left;
  height: 30px;
  padding-left: 10px;
  width: 40px;
}

замените на:

.cort .left ul li {
  float: left;
  height: 30px;
  margin-left: 10px;
  padding: 0 !important;
  width: 30px !important;
}

2. В main.css найдите:

.table_mini figure .goodsListForm {
  float: left;
  width: 50%;
}

замените на:

.table_mini figure .goodsListForm {
  float: left;
  width: auto;
}

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

.table_mini figure .goodsListPriceBlock {
  float: right;
  padding: 0 5px;
  width: 48%;
}

замените на:

.table_mini figure .goodsListPriceBlock {
  float: right;
  padding: 0 5px;
  width: 325px;
}

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

.table_mini figure .info {
  float: left;
  width: 50%;
}

замените на:

.table_mini figure .info {
  float: left;
  margin-right: -325px;
  padding-right: 325px;
  width: 100%;
}

3. В main.css добавьте:

.goodsListPriceBlock .availability {
  font-size: 14px;
}

4.В main.css найдите:

.table_mini figure .goodsToCartBlock > a {
  float: right;
  margin-top: -6px;
  min-width: 150px;
  width: 40%;
}

замените на:

.table_mini figure .goodsToCartBlock > a {
  float: right;
  margin-top: -6px;
  min-width: 160px;
  width: 40%;
}

5.В main.css после:

@media screen and (max-width: 540px) {

пропишите:

.table_mini figure .goodsListPriceBlock {
  width: 50%;
}
.table_mini figure .goodsToCartBlock > a {
  margin-top: -6px;
  min-width: auto;
  width: 80%;
}

[Andrew S.]

Vaccina (29 Апрель 2015 - 03:40) писал:

1. В main.css найдите:

.cort .left ul li {
float: left;
height: 30px;
padding-left: 10px;
width: 40px;
}

замените на:

.cort .left ul li {
float: left;
height: 30px;
margin-left: 10px;
padding: 0 !important;
width: 30px !important;
}

2. В main.css найдите:

.table_mini figure .goodsListForm {
float: left;
width: 50%;
}

замените на:

.table_mini figure .goodsListForm {
float: left;
width: auto;
}

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

.table_mini figure .goodsListPriceBlock {
float: right;
padding: 0 5px;
width: 48%;
}

замените на:

.table_mini figure .goodsListPriceBlock {
float: right;
padding: 0 5px;
width: 325px;
}

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

.table_mini figure .info {
float: left;
width: 50%;
}

замените на:

.table_mini figure .info {
float: left;
margin-right: -325px;
padding-right: 325px;
width: 100%;
}

3. В main.css добавьте:

.goodsListPriceBlock .availability {
font-size: 14px;
}

4.В main.css найдите:

.table_mini figure .goodsToCartBlock > a {
float: right;
margin-top: -6px;
min-width: 150px;
width: 40%;
}

замените на:

.table_mini figure .goodsToCartBlock > a {
float: right;
margin-top: -6px;
min-width: 160px;
width: 40%;
}

5.В main.css после:

@media screen and (max-width: 540px) {

пропишите:

.table_mini figure .goodsListPriceBlock {
width: 50%;
}
.table_mini figure .goodsToCartBlock > a {
margin-top: -6px;
min-width: auto;
width: 80%;
}

Добрый день! Начал всё менять и всё по-уползало не туда...

1. Строка с выбором количества уползла вниз.

Как её вернуть на место? В двух разных браузерах такая картина. Я так понял, что в IE она стоит на месте только потому, что там нет кнопок выбора "вверх-вниз" и она помещается. В остальные браузерах - проблема.

2. В отличии от 2х кнопок, новая не "светится" при активном режиме:

"Светится" только когда на неё наводишь:

Как сделать так, чтобы человек понимал какой режим сейчас активен? То есть сделать для людей. Чтобы она подсвечивалась. Тут по-моему вообще мы не сделали никаких изменений....

3. Уменьшился также шрифт в режиме крупного списка, что не нужно было. Этот шрифт нужно было уменьшить только в режиме мелкого списка.

Можно этот шрифт уменьшить только тут?

Иначе, опять-таки, криво это смотрится в режиме крупного списка. Идёт предложение с одним шрифтом и потом бах.. Пошёл уже другой размер шрифта. Некрасиво - жуть.
И в товаре уменьшился (((((((

4. Да, как бы хорошо, мы расширили ячейку для "добавить туда и туда", но нужно уменьшить шрифты и иконки для этих подписей, т.к. они не вмещаются в адаптивном режиме!

Получается: "бавить в избранное" и "бавить к сравнению". Я уже молчу о том что бы было если всё-таки нажать на кнопку "бавить". Вообще расширится и вылезет не понять куда.
Второй вариант - сделать так, чтобы в режиме краткого списка эти надписи ПРАВИЛЬНО переносились на новую строку, а правильно - это, как мне кажется, так:

А то они обрезаются, что я показал в предыдущем сообщении.

5. Теперь в адаптивном каждое слово переносится на новую строку. Это тоже жуть. Почему так случилось - не понятно.

Как сделать как было?

6. Ещё одна новая проблема, значки теперь встали вертикально, а не горизонтально и между ними нет отступа. Это так было изначально?

Хотелось бы, чтобы они располагались горизонтально, они съедают кучу пространства. И желательно чтобы был отступ.

7. Картинки в кнопках не сдвинулись на 1 пиксель вправо:

Стоят всё также неровно. Я там рисунок подкорректировал и всё равно. Картинку не могу перезалить, т.к. и так вторая уже стала непрозрачной. Так и первая станет непрозрачной.

8. Ещё нужно, чтобы информация о наличии переносилась всегда на следующую строку. Тут видно, как короткая строка "На заказ" размещается на первой строке. А нужно, чтобы она переносилась также, как и "Есть в наличии в Хабаровске":



Надеюсь скорее всё исправить. Сайт сейчас может отпугивать клиентов своим несовершенством во многих делах.

О, спасительная Вакцина, снизойдите, пожалуйста в данную тему

Сообщение отредактировал Andrew S.: 02 Май 2015 - 15:47

[Vaccina]

1. К сожалению, проблему так и не удалось просмотреть самолично, проверила в Opera, Chrome, IE, Mozilla, кнопка не уползает.
2. В main.css после:

a.btn.list.current, a.btn.list:hover {
  background-position: 1px -1px;
  transition-duration: 300s;
}

вставьте:

.btn.table_mini.current {
  background-position: 1px -1px;
}

3, 8. В main.css найдите:

.goodsListPriceBlock .availability {
  font-size: 14px;
}

замените на:

.goods-list.table_mini .goodsListPriceBlock .availability {
  font-size: 14px;
  display:block;
}

5.В main.css после:

.table_mini figure .info {
  float: left;
  margin-right: -325px;
  padding-right: 325px;
  width: 100%;
}

попробуйте заменить на:

.table_mini figure .info {
  float: left;
  margin-right: -325px;
  min-width: 470px;
  padding-right: 325px;
  width: 100%;
}

6.В main.css найдите:

.cort .left > ul {
  min-width: 78px;
  width: 23%;
}

замените на:

.cort .left > ul {
  margin-right: 10px;
  min-width: 78px;
  width: auto;
}
.cort .left ul li:first-child {
  margin-left: 0;
}

7.В main.css найдите:

.cort .left ul {
  float: left;
  width: 35%;
}

замените на:

.cort .left ul {
  float: left;
  margin-left: 5px;
  width: 35%;
}

[Andrew S.]

Vaccina (06 Май 2015 - 01:26) писал:

1. К сожалению, проблему так и не удалось просмотреть самолично, проверила в Opera, Chrome, IE, Mozilla, кнопка не уползает.
2. В main.css после:

a.btn.list.current, a.btn.list:hover {
background-position: 1px -1px;
transition-duration: 300s;
}

вставьте:

.btn.table_mini.current {
background-position: 1px -1px;
}

3, 8. В main.css найдите:

.goodsListPriceBlock .availability {
font-size: 14px;
}

замените на:

.goods-list.table_mini .goodsListPriceBlock .availability {
font-size: 14px;
display:block;
}

5.В main.css после:

.table_mini figure .info {
float: left;
margin-right: -325px;
padding-right: 325px;
width: 100%;
}

попробуйте заменить на:

.table_mini figure .info {
float: left;
margin-right: -325px;
min-width: 470px;
padding-right: 325px;
width: 100%;
}

6.В main.css найдите:

.cort .left > ul {
min-width: 78px;
width: 23%;
}

замените на:

.cort .left > ul {
margin-right: 10px;
min-width: 78px;
width: auto;
}
.cort .left ul li:first-child {
margin-left: 0;
}

7.В main.css найдите:

.cort .left ul {
float: left;
width: 35%;
}

замените на:

.cort .left ul {
float: left;
margin-left: 5px;
width: 35%;
}

Вакцина, Вы надолго сегодня тут? Я не буду отходить от компьютера чтобы всё доделать...

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

Подскажите просто как подкорректировать по ширине эту ячейку, расширить на пикселей 5. И чтобы если не поможет, я расширю, например на пикселей 10. Я просто зависимость не понял, когда начинаю самостоятельно всё менять, у меня всё ползёт!

[Vaccina]

Я тут примерно до 8 утра по мск, как понимаю, речь идет о поле ввода количества, в main.css найдите:

input.quantity, td.number span {
  margin-right: 0.6em;
  width: 44px;
}

в нем увеличьте параметр width

[Andrew S.]

Vaccina (06 Май 2015 - 01:55) писал:

Я тут примерно до 8 утра по мск, как понимаю, речь идет о поле ввода количества, в main.css найдите:

input.quantity, td.number span {
margin-right: 0.6em;
width: 44px;
}

в нем увеличьте параметр width

1. Да нет, я имею в виду, вы же на основе таблицы реализовали отображение этим мелким списком или нет? Мне кажётся всё не помещается потому, что ячейка стала слишком маленькой.

Мы же расширили поле описания товара - получается расширили как бы слишком сильно. Или ячейку с добавлениями расширили слишком сильно.



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

В двух разных браузерах эта проблема и слава Богу, что я ими пользуюсь, т.к. все проблемы там всплывают и получается чёткий контроль:



2. На рисунке также показано, что картинки-бэкграунды "1" не сдвинулись на пиксель вправо, ничего не помогает.