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


ChicksRoom

Регистрация: 26 марта 2014
Offline Активность: 17 сент. 2014 22:07
-----

#129600 Добавление Кнопки "увеличить Изображение".

Отправлено Vaccina на 27 Март 2014 - 04:08

1.В main.css в самый конец вставьте:
.goodsImageZoom a {
	margin-top: 10px;
	display: block;
}
2.вы вставляли данный виджет в шаблоне Товар, перед ним пропишите <br />
3.найдите:
input.button_cart_product {
	background-color: #FF99CC;
}
замените на:
input.button_cart_product {
	background-color: #FF99CC;
	width: 130px;
}
далее можете по своему усмотрению увеличить или уменьшить стиль width
4.1.перед кодом виджета данной кнопки пропишите <br />
5.найдите:
.prod_hold > div .prod-info-fly {
	width: 200px;
}
замените на:
.prod_hold > div .prod-info-fly {
	opacity: 0.9 !important;
	width: 200px;
}



#124020 Весна/дизайн... В Товаре Как Перенести Модификации/cвойства И Доставку

Отправлено Сake на 27 Февраль 2014 - 05:23

Цитата

Как искать ссылку на "Сравнение товара" ?

Попробуйте обновить ваш шаблон, так как в шаблоне по умолчанию на http://spring-demo.storeland.ru/ информация появляется автоматически без перезагрузки страницы.

Цитата

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

В шаблоне "Товар" найдите и удалите код

<!-- Блок выбора модификаций для текущей товарной позиции -->
		<div class="goodsDataMainModificationsBlock description" {% IF GOODS_NO_CHOISE_IN_PROPERTIES_FOR_MODIFICATIONS %}style="display:none;"{% ENDIF %}>
		  {% FOR goods_modifications_properties %}
	  <div class="goodsDataMainModificationsBlockProperty">
	   <!-- Выдаем списки со свойствами для модификаций, чтобы определить какую модификацию товара хочет пользователь -->
	   {% FOR values %}
		<!-- Если это первый элемент в списке -->
		{% IF goods_modifications_properties.values.first %}
		  <strong>{goods_modifications_properties.NAME}:</strong><br />
		  <select name="form[properties][]">
		{% ENDIF %}
			<option value="{goods_modifications_properties.values.ID}" {% IF goods_modifications_properties.values.SELECTED %}selected="selected"{% ENDIF %}>{goods_modifications_properties.values.NAME}</option>
		<!-- Если это последний элемент в списке -->
		{% IF goods_modifications_properties.values.last %}
		  </select>
		{% ENDIF %}
		{% ENDFOR %}
		</div>				 
	  {goods_modifications_properties.index | is_divided("2","","")}
		  {% ENDFOR %}
 
		  <!-- Данные по модификациям для текущей товарной позиции -->
		  {% FOR goods_modifications %}
			<div class="goodsDataMainModificationsList" rel="{goods_modifications.PROPERTIES_SLUG}">
	   <input type="hidden" name="id" value="{goods_modifications.ID}" />
	   <input type="hidden" name="art_number" value="{goods_modifications.ART_NUMBER}" />
	   <input type="hidden" name="price_now" value="{goods_modifications.PRICE_NOW}" />
	   <div class="price_now_formated" style="display:none">{goods_modifications.PRICE_NOW | money_format}</div>
	   <input type="hidden" name="price_old" value="{% IF goods_modifications.PRICE_NOW_WITHOUT_DISCOUNT>goods_modifications.PRICE_NOW %}{goods_modifications.PRICE_NOW_WITHOUT_DISCOUNT}{% ELSE %}{goods_modifications.PRICE_OLD}{% ENDIF %}" />
	   <div class="price_old_formated" style="display:none">{% IF goods_modifications.PRICE_NOW_WITHOUT_DISCOUNT>goods_modifications.PRICE_NOW %}{goods_modifications.PRICE_NOW_WITHOUT_DISCOUNT | money_format}{% ELSE %}{goods_modifications.PRICE_OLD | money_format}{% ENDIF %}</div>
	   <input type="hidden" name="rest_value" value="{goods_modifications.REST_VALUE}" />
	   <input type="hidden" name="measure_id" value="{goods_modifications.MEASURE_ID}" />
	   <input type="hidden" name="measure_name" value="{goods_modifications.MEASURE_NAME}" />
	   <input type="hidden" name="measure_desc" value="{goods_modifications.MEASURE_DESC}" />
	   <input type="hidden" name="measure_precision" value="{goods_modifications.MEASURE_PRECISION}" />
	   <input type="hidden" name="is_has_in_compare_list" value="{goods_modifications.IS_HAS_IN_COMPARE_LIST}" />
	   <div class="description" style="display:none">{goods_modifications.DESCRIPTION}</div>
			</div>
		  {% ENDFOR %}
		   
	 <!-- Блок описания модификации -->
	 <div class="goodsDataMainModificationsDescriptionBlock" {% IFNOT GOODS_MOD_DESCRIPTION %}style="display:none;"{% ENDIF %}>
	  {GOODS_MOD_DESCRIPTION}
	 </div>
	</div>

после чуть выше найдите код

<form action="{CART_ADD_GOODS_MODIFICATION_URL}" method="post" class="goodsDataForm cont700 hiden" >
	   <input type="hidden" name="hash" value="{HASH}" />
	  <input type="hidden" name="form[goods_from]" value="{GOODS_FROM}" />

и замените его на

<form action="{CART_ADD_GOODS_MODIFICATION_URL}" method="post" class="goodsDataForm cont700 hiden" >
	   <input type="hidden" name="hash" value="{HASH}" />
	  <input type="hidden" name="form[goods_from]" value="{GOODS_FROM}" />
	   
		<!-- Блок выбора модификаций для текущей товарной позиции -->
		<div class="goodsDataMainModificationsBlock description" {% IF GOODS_NO_CHOISE_IN_PROPERTIES_FOR_MODIFICATIONS %}style="display:none;"{% ENDIF %}>
		  {% FOR goods_modifications_properties %}
	   <div class="goodsDataMainModificationsBlockProperty">
	   <!-- Выдаем списки со свойствами для модификаций, чтобы определить какую модификацию товара хочет пользователь -->
	   {% FOR values %}
		<!-- Если это первый элемент в списке -->
		{% IF goods_modifications_properties.values.first %}
		  <strong>{goods_modifications_properties.NAME}:</strong><br />
		  <select name="form[properties][]">
		{% ENDIF %}
			<option value="{goods_modifications_properties.values.ID}" {% IF goods_modifications_properties.values.SELECTED %}selected="selected"{% ENDIF %}>{goods_modifications_properties.values.NAME}</option>
		<!-- Если это последний элемент в списке -->
		{% IF goods_modifications_properties.values.last %}
		  </select>
		{% ENDIF %}
		{% ENDFOR %}
		</div>				 
	  {goods_modifications_properties.index | is_divided("2","","")}
		  {% ENDFOR %}
 
		  <!-- Данные по модификациям для текущей товарной позиции -->
		  {% FOR goods_modifications %}
			<div class="goodsDataMainModificationsList" rel="{goods_modifications.PROPERTIES_SLUG}">
	   <input type="hidden" name="id" value="{goods_modifications.ID}" />
	   <input type="hidden" name="art_number" value="{goods_modifications.ART_NUMBER}" />
	   <input type="hidden" name="price_now" value="{goods_modifications.PRICE_NOW}" />
	   <div class="price_now_formated" style="display:none">{goods_modifications.PRICE_NOW | money_format}</div>
	   <input type="hidden" name="price_old" value="{% IF goods_modifications.PRICE_NOW_WITHOUT_DISCOUNT>goods_modifications.PRICE_NOW %}{goods_modifications.PRICE_NOW_WITHOUT_DISCOUNT}{% ELSE %}{goods_modifications.PRICE_OLD}{% ENDIF %}" />
	   <div class="price_old_formated" style="display:none">{% IF goods_modifications.PRICE_NOW_WITHOUT_DISCOUNT>goods_modifications.PRICE_NOW %}{goods_modifications.PRICE_NOW_WITHOUT_DISCOUNT | money_format}{% ELSE %}{goods_modifications.PRICE_OLD | money_format}{% ENDIF %}</div>
	   <input type="hidden" name="rest_value" value="{goods_modifications.REST_VALUE}" />
	   <input type="hidden" name="measure_id" value="{goods_modifications.MEASURE_ID}" />
	   <input type="hidden" name="measure_name" value="{goods_modifications.MEASURE_NAME}" />
	   <input type="hidden" name="measure_desc" value="{goods_modifications.MEASURE_DESC}" />
	   <input type="hidden" name="measure_precision" value="{goods_modifications.MEASURE_PRECISION}" />
	   <input type="hidden" name="is_has_in_compare_list" value="{goods_modifications.IS_HAS_IN_COMPARE_LIST}" />
	   <div class="description" style="display:none">{goods_modifications.DESCRIPTION}</div>
			</div>
		  {% ENDFOR %}
		   
	 <!-- Блок описания модификации -->
	 <div class="goodsDataMainModificationsDescriptionBlock" {% IFNOT GOODS_MOD_DESCRIPTION %}style="display:none;"{% ENDIF %}>
	  {GOODS_MOD_DESCRIPTION}
	 </div>
	</div>

Цитата

Перенести доставку под вкладку как в Осени: т.е. чтобы стали вкладки Общее - Доставка - Отзывы...

Найдите в шаблоне "Товар" строку

<a href="javascript:tabSwitch(1);" id="tab_1" class="active">Общее</a>

и замените её на

<a href="javascript:tabSwitch(1);" id="tab_1" class="active">Общее</a>
<a href="javascript:tabSwitch(5);" id="tab_5">Доставка</a>

далее найдите и удалите код

<!-- Блок описания вариантов доставки -->
	  <div class="span12">
		<h4>Условия доставки</h4>
		{% FOR goods_delivery %}
		  <h5>Вариант {goods_delivery.index}: {goods_delivery.NAME}</h5>
		  <div class="span12" >
			<p style="color: #333;">{goods_delivery.DESC}</p>
			{% IF goods_delivery.rules_empty %}
			  {% IF goods_delivery.PRICE=0 %}
				<strong class="black">Стоимость доставки: {goods_delivery.PRICE | money_format}</strong>
			  {% ELSE %}
				Стоимость доставки: {goods_delivery.PRICE | money_format}</span>
			  {% ENDIF %}
			{% ELSE %}
			  <table class="table">
				<thead>
				  <tr>
					<td><h5>Стоимость доставки зависит от суммы заказа</h5></td>
				  </tr>
				</thead>
				<tbody style="color: #333;">
				  {% FOR rules %}
					<tr>
					  <td>Для заказов больше {goods_delivery.rules.SUM_MORE_PRICE | money_format} - доставка {goods_delivery.rules.PRICE | money_format}</td>
					</tr>
				  {% ENDFOR %}
				  <tr>
					<td>Для заказов меньше {goods_delivery.SUM_LESS_PRICE | money_format} - доставка {goods_delivery.PRICE | money_format}</td>
				  </tr>
				</tbody>
			  </table>
			{% ENDIF %}
		  </div>
		{% ENDFOR %}
	  </div>
	  <!-- /Блок описания вариантов доставки -->

далее найдите строку

<div id="content_1" class="product-info tab-content">

и замените её на

<div id="content_5" class="tab-content">
	<!-- Блок описания вариантов доставки -->
	  <div class="span12">
		<h4>Условия доставки</h4>
		{% FOR goods_delivery %}
		  <h5>Вариант {goods_delivery.index}: {goods_delivery.NAME}</h5>
		  <div class="span12" >
			<p style="color: #333;">{goods_delivery.DESC}</p>
			{% IF goods_delivery.rules_empty %}
			  {% IF goods_delivery.PRICE=0 %}
				<strong class="black">Стоимость доставки: {goods_delivery.PRICE | money_format}</strong>
			  {% ELSE %}
				Стоимость доставки: {goods_delivery.PRICE | money_format}</span>
			  {% ENDIF %}
			{% ELSE %}
			  <table class="table">
				<thead>
				  <tr>
					<td><h5>Стоимость доставки зависит от суммы заказа</h5></td>
				  </tr>
				</thead>
				<tbody style="color: #333;">
				  {% FOR rules %}
					<tr>
					  <td>Для заказов больше {goods_delivery.rules.SUM_MORE_PRICE | money_format} - доставка {goods_delivery.rules.PRICE | money_format}</td>
					</tr>
				  {% ENDFOR %}
				  <tr>
					<td>Для заказов меньше {goods_delivery.SUM_LESS_PRICE | money_format} - доставка {goods_delivery.PRICE | money_format}</td>
				  </tr>
				</tbody>
			  </table>
			{% ENDIF %}
		  </div>
		{% ENDFOR %}
	  </div>
	  <!-- /Блок описания вариантов доставки -->
  </div>
  <div id="content_1" class="product-info tab-content">

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

#content_2, #content_3, #content_4 {
  display: none;
}

и замените на

#content_2, #content_3, #content_4, #content_5 {
  display: none;
}

Цитата

Добавить увеличение картинки как в Сиянии..., типа под картинкой сделать ссылку "увеличить" (лучше кнопкой..., хотя я ее и сам потом прикручу)

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

{% ENDIF %}
				 <a href="{goods_images.LARGE}" title="{goods_images.NAME}" class="cloud-zoom-gallery" rel="useZoom: 'zoom1', smallImage: '{goods_images.MEDIUM}' "><img src="{goods_images.ICON}" alt="{goods_images.NAME}" /></a>						
		  {% IF goods_images.last %}

и замените его на

{% ENDIF %}
				 <a href="{goods_images.LARGE}" data="{goods_images.ID}" title="{goods_images.NAME}" class="cloud-zoom-gallery" rel="useZoom: 'zoom1', smallImage: '{goods_images.MEDIUM}' "><img src="{goods_images.ICON}" alt="{goods_images.NAME}" /></a>						
		  {% IF goods_images.last %}

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

<!-- Большое изображение -->
	  <div class="image">
		<div id="wrap" style="top:0px;z-index:9999;position:relative;">
		  {% IF GOODS_IMAGE_EMPTY %}
			<img src="{ASSETS_IMAGES_PATH}no-photo-medium.png" alt="{GOODS_NAME}" title="Увеличить {GOODS_NAME}"  class="thumbnail .goods-image-medium "/>
		  {% ELSE %}
			<a itemprop="image" href="{GOODS_IMAGE_LARGE}" title="Увеличить {GOODS_NAME}" class="cloud-zoom" id="zoom1" rel="position: 'inside', showTitle: false, adjustX:-4, adjustY:-4" style="position: relative; display: block;">
			  <img src="{GOODS_IMAGE_MEDIUM}" title="{GOODS_NAME}" alt="{GOODS_NAME}" id="image" style="display: block;" class=".goods-image-medium" />
			</a>
		  {% ENDIF %}		 
		</div>
	  </div>

и замените его на

<!-- Большое изображение -->
	  <div class="image">
		<div id="wrap" style="top:0px;z-index:9999;position:relative;">
		  {% IF GOODS_IMAGE_EMPTY %}
			<img src="{ASSETS_IMAGES_PATH}no-photo-medium.png" alt="{GOODS_NAME}" title="Увеличить {GOODS_NAME}"  class="thumbnail .goods-image-medium "/>
		  {% ELSE %}
			<a itemprop="image" href="{GOODS_IMAGE_LARGE}" title="Увеличить {GOODS_NAME}" class="cloud-zoom" id="zoom1" rel="position: 'inside', showTitle: false, adjustX:-4, adjustY:-4" style="position: relative; display: block;">
			  <img src="{GOODS_IMAGE_MEDIUM}" title="{GOODS_NAME}" alt="{GOODS_NAME}" id="image" style="display: block;" class=".goods-image-medium" />
			</a>
		  {% ENDIF %}		 
		</div>
		<center class="goodsImageZoom" data="{GOODS_IMAGE_ID}"><a href="#">Увеличить изображение</a></center>
	  </div>
	 
	  {% IFNOT goods_images_empty %}
		<div class="goodsImageList" style="display: none;">
		{% FOR goods_images %}
		   <a href="{goods_images.LARGE}" data="{goods_images.ID}" title="{goods_images.NAME}" rel="gallery"><img src="{goods_images.ICON}" alt="{goods_images.NAME}" /></a>
		{% ENDFOR %}
		</div>
	  {% ENDIF %}

далее в файл main.js добавьте код

$(function() {
$('a[rel="gallery"]').fancybox();
  
  // Увеличение изображение при клике на него и открытие галереи изображений
  $('.goodsImageZoom a, .image-additional a').click(function(){
	  if($(this).closest('.image-additional').length) {
		$('.goodsImageZoom').attr('data', $(this).attr('data'));
		return(true);
	  }
	  $('.goodsImageList a[data="' + $('.goodsImageZoom').attr("data") + '"]').trigger('click');
	  return(false);
  });
});

Цитата

Как сделать в подвале адаптивную высоту "Контакты"..., чтобы она сама сужалась в зависимости я так понимаю от кол-ва заполненого в Основных настройках бэк-офиса (см.картинку)

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

#footer .column {
  margin-bottom: 15px;
  min-height: 348px;
}

и замените на

#footer .column {
  margin-bottom: 15px;
}



#123849 Сразу Поменять Основные Тона Сайта И Размеры Шрифтов В Меню.

Отправлено Alexey11 на 26 Февраль 2014 - 17:38

Данный блок кода в шаблоне style.css отвечает за шапку:

#header_colapse {position:relative;background-color:#ff0551;color:#ffffff;z-index: 1000;}

измените значение background-color на нужное вам.

Далее чтобы изменить цвет переключателя (чтобы свернуть или развернуть шапку) нужно внести изменения в данный код:

.toggler {position:absolute;display:block;width:25px;height:22px;background-color:#ff0551;bottom:-22px;left:0;text-indent:-9999px;cursor: pointer;z-index: 1000;}

Аналогично с предыдущим.

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

#header {position: relative;z-index: 99;background-color:#ffffff;border-top:3px solid #ff0551;}

Но на этот раз придется изменять значение параметра border-top , тоесть его цвет. Можно сделать данную полоску шире изменив первый параметр 3px.


Далее за шрифт в левом меню отвечает блок

.accordion a { text-decoration: none; font-size:11px; padding: 8px 10px 8px 20px; display: block; cursor: pointer; }

измените параметр font-size на нужный вам.



Также чтобы изменит цвет кнопочки корзины вам нужно отредактировать данный блок кода:

#header #cart .cart_circle {display:block;width:36px;height:36px;background:url('{ASSETS_IMAGES_PATH}cart_circle.png') 50% 50% no-repeat;background-color:#ff0551;-webkit-border-radius: 50%;-moz-border-radius: 50%;-khtml-border-radius: 50%;-ms-border-radius: 50%;border-radius: 50%;position:absolute;top:3px;right:0;transition: all 0.5s ease 0s;-webkit-transition: all 0.5s ease 0s;-ms-transition: all 0.5s ease 0s;-moz-transition: all 0.5s ease 0s;-o-transition: all 0.5s ease 0s;cursor:pointer;}


а именно background-color.

Если этого не достаточно, укажите пожалуйста что еще нужно изменить.


#8404 Изменения Верхней Части Шаблона Сайта

Отправлено Vaccina на 13 Октябрь 2011 - 00:50

По многим вопросам уже есть ответы на форуме:

а)
#header #logo {
	background: url("http://img.storeland.ru/web/upload/assets/images/10/9976/logo.png") no-repeat scroll 0 0 transparent;
	height: 79px;
	left: 10px;
	position: absolute;
	top: 18px;
	width: 300px;}

меняете значение left и top и он передвигается
меняете значения height и  width для изменения размера

б) http://forum.storela...ch__1#entry7043
http://forum.storela...ch__1#entry5739

в)http://forum.storela...ch__1#entry6730
http://forum.storela...ch__1#entry5622

г)http://forum.storela...arch__1#entry87
http://forum.storela...rch__1#entry842

д)http://forum.storela...ch__1#entry7882
http://forum.storela...ch__1#entry6881

е)http://forum.storela...p__718#entry718
http://forum.storela..._1194#entry1194
это блок шапки
#headerWrap {
	background: url("http://img.storeland.ru/web/upload/assets/images/10/9976/header_bg.jpg") repeat-x scroll 0 0 transparent;
	height: 150px;
}
чтобы сделать короче или длиньше по высоте, поменяйте значение height

ж)http://forum.storela...онтакте__st__20