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


Изменение Дизайна (Главная Страница, Карточка Товара)


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

#1 carden25

carden25

    Пользователь

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

Отправлено 19 Декабрь 2017 - 10:31

Аккаунт 428896
Добрый день! Необходимо сделать следующее:
1. Шапка.
Телефон и почту перенести вправо на уровень с поиском, сделать крупнее.
Поиск сделать длиннее и расположить между лого и контактами.
Увеличить поле поиска.
Иконки соцсетей убрать(позже добавлю)

2. Слайдер. Сделать слайды кликабельными. Как изменить цвет фона? Можно ли слайдер уменьшить по высоте? Покажите как можно отключить слайдер на время пока не сделал слайды?
3 убрать после слайдера иконки с текстом
4 Карточка товара
При отображении товаров перенести корзина сверху вниз под описание товара и сделать
кнопку жёлтой)
Выделить цену жирным и поменять цвет цены на черный
Описание товара сделать черным цветом
5 Описание товара
При открывании самого товара цвет цены черный и жирный, цвет кнопки жёлтый
Описание товара черный цвет
6 в описании товара есть вкладка Условия доставки. Как изменить содержимое этой вкладки ?

#2 metry

metry

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

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

Отправлено 19 Декабрь 2017 - 17:00

Добрый день. Для внесения изменений зайдите в Редактор шаблонов-->main.css и найдите:
#header .header-right .header-right-inner #search_mini_form .form-search input.inputText, #menu .nav-right .block-search #search_mini_form2 .form-search input.inputText {font-size: 12px;height:auto;line-height:20px;width: 235px;padding: 10px 20px;border: 1px solid #d8d8d8;border-radius: 22px;-webkit-border-radius: 22px;-moz-border-radius: 22px;}
#header .header-right .header-right-inner #search_mini_form .form-search input.inputText:focus {width: 250px;outline:none;}

замените на:
#header .header-right .header-right-inner #search_mini_form .form-search input.inputText, #menu .nav-right .block-search #search_mini_form2 .form-search input.inputText {font-size: 12px;height:auto;line-height:20px;width: 285px;padding: 10px 20px;border: 1px solid #d8d8d8;border-radius: 22px;-webkit-border-radius: 22px;-moz-border-radius: 22px;}
#header .header-right .header-right-inner #search_mini_form .form-search input.inputText:focus {width: 290px;outline:none;}

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

#header .header-right .header-right-inner #search_mini_form .form-search input.inputText {width: 170px;}
#header .header-right .header-right-inner #search_mini_form .form-search input.inputText:focus, #menu .nav-right .block-search #search_mini_form2 .form-search input.inputText:focus {width: 180px;}

замените на:

#header .header-right .header-right-inner #search_mini_form .form-search input.inputText {width: 270px;}
#header .header-right .header-right-inner #search_mini_form .form-search input.inputText:focus, #menu .nav-right .block-search #search_mini_form2 .form-search input.inputText:focus {width: 280px;}

далее найдите:
#header #logo {text-align: left;margin-left: 0px;}

после него вставьте:
#header .header-right .header-right-inner {float:right;}

далее найдите:
#header #logo {text-align: center;}

после него вставьте:

.header-right ul.contact-us-now {z-index: 2;list-style: none;margin: 0;padding:0;float:right;display:none;}


далее в конец кода main.css вставьте:

.header-right ul.contact-us-now {z-index: 2;list-style: none;margin: 0;padding:0;float:right;}
.header-right ul.contact-us-now li {display: inline-block;float: left;line-height: 36px;margin-left: 15px;padding-left: 28px;background: url("//design.topshoper.ru/ico-contactusnow.png?design=azure") no-repeat left -1px;font-size: 110%;}
.header-right ul.contact-us-now li:first-child {margin-left: 0px;}
.header-right ul.contact-us-now li.c-phone {background-position: left -36px;padding-left: 26px;}
.header-right ul.contact-us-now li label {float: left;line-height: 36px;margin: 0 5px 0 0;color: #909090;}
.header-right ul.contact-us-now li.c-phone.hide {display:none;}
@media all and (min-width: 768px) {
#header-top .topheader-left ul.contact-us-now {z-index: 2;list-style: none;margin: 0;padding:0;display:none;}
}

далее зайдите в Редактор шаблонов-->HTML и найдите:

		 <div class="header-right col-sm-8 col-xs-12">
			 <div class="header-right-inner">
			 <ul class="connect-us">
				 <li><a href="#" class="fa fa-facebook"></a></li>
				 <li><a href="#" class="fa fa-twitter"></a></li>
				 <li><a href="#" class="fa fa-youtube"></a></li>
				 <li><a href="#" class="fa fa-vk"></a></li>
			 </ul>
			 <form id="search_mini_form" action="{SEARCH_URL}" method="get" title="Поиск по магазину" onsubmit="if($(this).find('.form-search').val()) return false;">
				 <div class="form-search">
				 <input type="text" name="q" value="{SEARCH_QUERY}" class="inputText" placeholder="Поиск по магазину...">
				 <input type="hidden" name="goods_search_field_id" value="0">
				 <button type="submit" title="Искать" class="button search-submit"></button>
				 </div>
			 </form>
			 </div>
		 </div>

замените на:

		 <div class="header-right col-sm-8 col-xs-12">
			 <div class="header-right-inner">
			 <!--ul class="connect-us">
				 <li><a href="#" class="fa fa-facebook"></a></li>
				 <li><a href="#" class="fa fa-twitter"></a></li>
				 <li><a href="#" class="fa fa-youtube"></a></li>
				 <li><a href="#" class="fa fa-vk"></a></li>
			 </ul-->
			 <form id="search_mini_form" action="{SEARCH_URL}" method="get" title="Поиск по магазину" onsubmit="if($(this).find('.form-search').val()) return false;">
				 <div class="form-search">
				 <input type="text" name="q" value="{SEARCH_QUERY}" class="inputText" placeholder="Поиск по магазину...">
				 <input type="hidden" name="goods_search_field_id" value="0">
				 <button type="submit" title="Искать" class="button search-submit"></button>
				 </div>
			 </form>
			 </div>
				 <ul class="contact-us-now">
			 {% IF SETTINGS_STORE_EMAIL_MAIN %}<li class="c-email"><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></li>{% ENDIF %}
			 {% IF SETTINGS_STORE_PHONE_NUMBER1 %}<li class="c-phone"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a></li>{% ENDIF %}
			 {% IF SETTINGS_STORE_PHONE_NUMBER2 %}<li class="c-phone hide"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{SETTINGS_STORE_PHONE_CITY_CODE2}{SETTINGS_STORE_PHONE_NUMBER2}">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}({SETTINGS_STORE_PHONE_CITY_CODE2}){SETTINGS_STORE_PHONE_NUMBER2}</a></li>{% ENDIF %}
			 {% IF SETTINGS_STORE_PHONE_NUMBER3 %}<li class="c-phone hide"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{SETTINGS_STORE_PHONE_CITY_CODE3}{SETTINGS_STORE_PHONE_NUMBER3}">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}({SETTINGS_STORE_PHONE_CITY_CODE3}){SETTINGS_STORE_PHONE_NUMBER3}</a></li>{% ENDIF %}
		 </ul>

		 </div>

2.В бэк-офисе вашего интернет-магазина зайти в раздел Сайт -> Редактор шаблонов и в левом блоке: "Изображения" найти файлы: slide1.png, slide2.png, slide3.png, slide4.png, открыть их и заменить на свои изображения.Размер слайда зависит от размера загружаемых картинок. Рекомендуемый размер загружаемых картинок 1920x570px .  Вместо 570 можете задать высоту чуть меньше.

Чтобы отключить слайд зайдите в Редактор шаблонов-->main.css и найдите:

#slideshow {margin: 0 0;position: relative;}

замените на:

#slideshow {margin: 0 0;position: relative; display:none;}

3. Для внесения изменений зайдите в Редактор шаблонов-->main.css и найдите:
#topsl {margin: 40px 0 0;padding-bottom: 27px;border-bottom: 1px solid #e9e9e9;}

замените на:

#topsl {margin: 40px 0 0;padding-bottom: 27px;border-bottom: 1px solid #e9e9e9;display:none;}

4. Уточните, пожалуйста, приложив скриншот.

5. Для внесения изменений зайдите в Редактор шаблонов-->main.css и найдите:

.price-box .special-price .price {color: #3cabda;font-size: 180%;}

замените на:
.price-box .special-price .price {color: #090909;font-size: 180%;font-weight:bold;}

далее найдите:
.product-shop .short-description {color:#666666;border-bottom: 1px solid #e9e9e9;margin-bottom: 20px;}

замените на:

.product-shop .short-description {color:#0b0a0a;border-bottom: 1px solid #e9e9e9;margin-bottom: 20px;}

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

.product-shop .wrap-qty .qty-set input {padding: 5px;border-radius: 100%;-webkit-border-radius: 100%;font-size: 100%;line-height: 10px;height: 28px;width: 28px;border: 1px solid #dfdfdf;background: #ffffff url("{ASSETS_IMAGES_PATH}nav-cir.png?design=azure") no-repeat left top;}

замените на:

.product-shop .wrap-qty .qty-set input {padding: 5px;border-radius: 100%;-webkit-border-radius: 100%;font-size: 100%;line-height: 10px;height: 28px;width: 28px;border: 1px solid #ceda07;background: #c6c01f url("{ASSETS_IMAGES_PATH}nav-cir.png?design=azure") no-repeat left top;}

6. Содержимое вкладки Условия доставки формируется на основе данных введенных в разделе Настройки-->Доставка-->Вариант доставки.

#3 carden25

carden25

    Пользователь

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

Отправлено 20 Декабрь 2017 - 00:42

Спасибо!
Также необходимо сделать как на картинке http://skrinshoter.r...191217/TTfyaW?a
Перенести кнопку вниз, цвет кнопки желтый, и сделать текст описания товара черным цветом

#4 RayLi

RayLi

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

  • Модераторы
  • 2 857 сообщений

Отправлено 20 Декабрь 2017 - 16:40

Просмотр сообщенияcarden25 (20 Декабрь 2017 - 00:42) писал:

Спасибо!
Также необходимо сделать как на картинке http://skrinshoter.r...191217/TTfyaW?a
Перенести кнопку вниз, цвет кнопки желтый, и сделать текст описания товара черным цветом

Здравствуйте.
В данном случае в шаблоне Товары найдите, пожалуйста, данный код:

						<span class="ico-product sale">Скидка</span>
					  {% ENDIF %}
					  <div class="cart-wrap">
						<!--a class="add-cart quick btn-cart button" title="Быстро оформить заказ" 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}" {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE %}{% IF goods.MAX_REST_VALUE=0 %}style="display:none;"{% ENDIF %}{% ENDIF %}></a-->
						<a class="add-cart btn-cart button" title="В корзину" 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}" {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE %}{% IF goods.MAX_REST_VALUE=0 %}style="display:none;"{% ENDIF %}{% ENDIF %}>В корзину</a>
					  </div>
					  <div class="item-img-info">

И замените его вот этим вот кодом:

						<span class="ico-product sale">Скидка</span>
					  {% ENDIF %}
					  <div class="item-img-info">


Далее там же найдите, пожалуйста, следующий код:

							 <div class="rating" style="width:0%" alt="Рейтинг не определён" title="Рейтинг не определён"></div>
							  {% ENDIF %}
							</div>
						  </div>
						</div>
					  </div>
					</div>
				  </div>
				</div>
			  </div>
			{% ENDFOR %}
		  </div>
		{% ELSE %}
		  <!-- Вывод товаров Списком -->

И замените его этим вот кодом:

								<div class="rating" style="width:0%" alt="Рейтинг не определён" title="Рейтинг не определён"></div>
							  {% ENDIF %}
							</div>
						  </div>
						</div>
					  </div>
						<div class="cart-wrap">
						<!--a class="add-cart quick btn-cart button" title="Быстро оформить заказ" 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}" {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE %}{% IF goods.MAX_REST_VALUE=0 %}style="display:none;"{% ENDIF %}{% ENDIF %}></a-->
						<a class="add-cart btn-cart button" title="В корзину" 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}" {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE %}{% IF goods.MAX_REST_VALUE=0 %}style="display:none;"{% ENDIF %}{% ENDIF %}>В корзину</a>
					  </div>
					</div>
				  </div>
				</div>
			  </div>
			{% ENDFOR %}
		  </div>
		{% ELSE %}
		  <!-- Вывод товаров Списком -->


#5 carden25

carden25

    Пользователь

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

Отправлено 20 Декабрь 2017 - 23:42

Добрый вечер. Спасибо, кнопка переместилась вниз

1.Нужно сделать чтобы она всегда была желтая, а при наведении тускло желтая.
2.Следующее:
Хит - заполнение цветом красным
Новинка - заполнение цветом зеленым
Товары из категории "Вы смотрели" цена товара тоже жирным
+ еще пару нюансов в этом файле. https://yadi.sk/i/68BF7N0U3Qog55

2. Следующее. Шапка сайта выглядит не очень аккуратно сейчас.
Вот тут нарисовал как примерно вижу: https://yadi.sk/i/pr2yNPVU3Qoat2
Вот нашел на форуме понравилось как сделали, можно также сделать? http://skrinshoter.r...201217/1I033v?a

Благодарю

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

  • изменения.png


#6 RayLi

RayLi

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

  • Модераторы
  • 2 857 сообщений

Отправлено 21 Декабрь 2017 - 09:52

Просмотр сообщенияcarden25 (20 Декабрь 2017 - 23:42) писал:

Добрый вечер. Спасибо, кнопка переместилась вниз

1.Нужно сделать чтобы она всегда была желтая, а при наведении тускло желтая.
2.Следующее:
Хит - заполнение цветом красным
Новинка - заполнение цветом зеленым
Товары из категории "Вы смотрели" цена товара тоже жирным
+ еще пару нюансов в этом файле. https://yadi.sk/i/68BF7N0U3Qog55

2. Следующее. Шапка сайта выглядит не очень аккуратно сейчас.
Вот тут нарисовал как примерно вижу: https://yadi.sk/i/pr2yNPVU3Qoat2
Вот нашел на форуме понравилось как сделали, можно также сделать? http://skrinshoter.r...201217/1I033v?a

Благодарю

Здравствуйте.
В шаблоне main.css найдите, пожалуйста, данный код:



.products-grid .item .item-inner .item-info .info-inner {
	border: 1px solid #e9e9e9;
	border-top: none;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

И замените его вот этим кодом:

.products-grid .item .item-inner .item-info .info-inner {
	border: 1px solid #e9e9e9;
	border-top: none;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	height: 125px;
}


Далее в самый конец того же шаблона добавьте, пожалуйста, следующий код:

.info-inner .cart-wrap {line-height: 35px;}
.add-cart.btn-cart.button {background: #ffdc4d;font-weight: 600;border-radius: 3px;border: 1px solid #000;color: #000;}


После чего там же найдите, пожалуйста, следующий код:

.rating-box {
	background: url('{ASSETS_IMAGES_PATH}bkg_rating.png?design=azure') repeat-x scroll 0 0 transparent;
	display: inline-block;
	height: 12px;
	position: relative;
	vertical-align: middle;
	width: 60px;
	margin: 3px 12px 0 0;
}

И замените его этим вот кодом:

.rating-box {
	background: url('{ASSETS_IMAGES_PATH}bkg_rating.png?design=azure') repeat-x scroll 0 0 transparent;
	display: inline-block;
	height: 12px;
	position: relative;
	vertical-align: middle;
	width: 60px;
	margin: 1px 0px 0 0;
}

Там же находим данный код:

.viewed .block-content .item .product-price .price-box .price {
	margin: 5px 0;
	color: #3cabda;
}

И заменяем его вот этим вот кодом:

.viewed .block-content .item .product-price .price-box .price {
	margin: 5px 0;
	color: #3cabda;
	font-weight: bold;
}


#7 carden25

carden25

    Пользователь

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

Отправлено 21 Декабрь 2017 - 22:24

Спасибо. Здесь все хорошо: http://skrinshoter.r...211217/cxSulu?a Можно ли сделать чтобы кнопка желтая "В корзину" меняла цвет на более светлый желтый цвет при наведении на нее?

Следующее: на главной странице кнопка в корзину улетела наверх почему-то http://skrinshoter.r...211217/0nKQ65?a
Как сделать чтобы было в одном стиле как тут: http://skrinshoter.r...211217/cxSulu?a

И как поменять цвет заливки ХИТ и НОВИНКА на фото товара?
Благодарю

#8 metry

metry

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

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

Отправлено 22 Декабрь 2017 - 10:49

Добрый день. Для внесения изменений зайдите в Редактор шаблонов-->main.css и найдите:

.products-grid .item:hover .item-inner .item-img .cart-wrap .btn-cart {border-color: #3cabda;background-color: #3cabda;color: #FFF;}

замените на:

.products-grid .item:hover .item-inner .item-img .cart-wrap .btn-cart {border-color: #F1EB41;background-color: #F1EB41;color: #000;}

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

.products-grid .item .item-inner .item-img .cart-wrap {position: absolute;top: -7px;width: 100%;height: 36px;z-index: 3;text-align: center;}

замените на:

.products-grid .item .item-inner .item-img .cart-wrap {position: absolute;bottom:-44%;width: 100%;height: 36px;z-index: 3;text-align: center;}



3. В main.css найдите:
.ico-product.best {background: #3cabda;left: 10px;}
- для background задайте свой код цвета. Код цвета можно подобрать на этомресурсе.

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

.ico-product.new {background: #de44c3;left: 10px;}

- для background задайте свой код цвета. Код цвета можно подобрать на этомресурсе.

#9 carden25

carden25

    Пользователь

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

Отправлено 23 Декабрь 2017 - 14:06

Добрый день! Спасибо
Возникла проблема. Когда заходишь в категорию например для детей кнопка В корзину не добавляет товар в корзину и по стилю отличается от кнопки В корзину на главной странице. КАк сделать ее активной и привести в один стиль с главной страницей:
http://skrinshoter.r...231217/FuFOTf?a
главная страница: http://skrinshoter.r...231217/CebWRN?a

2. На странице товара 2 кнопки В корзину и быстрый заказ. На них пропал значок корзины, как его снова сделать?
http://skrinshoter.r...231217/koxNLy?a

Сообщение отредактировал carden25: 23 Декабрь 2017 - 16:23


#10 carden25

carden25

    Пользователь

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

Отправлено 23 Декабрь 2017 - 15:57

Просмотр сообщенияRayLi (20 Декабрь 2017 - 16:40) писал:

Здравствуйте.
В данном случае в шаблоне Товары найдите, пожалуйста, данный код:

<span class="ico-product sale">Скидка</span>
{% ENDIF %}
<div class="cart-wrap">
<!--a class="add-cart quick btn-cart button" title="Быстро оформить заказ" 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}" {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE %}{% IF goods.MAX_REST_VALUE=0 %}style="display:none;"{% ENDIF %}{% ENDIF %}></a-->
<a class="add-cart btn-cart button" title="В корзину" 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}" {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE %}{% IF goods.MAX_REST_VALUE=0 %}style="display:none;"{% ENDIF %}{% ENDIF %}>В корзину</a>
</div>
<div class="item-img-info">

И замените его вот этим вот кодом:

<span class="ico-product sale">Скидка</span>
{% ENDIF %}
<div class="item-img-info">


Далее там же найдите, пожалуйста, следующий код:

<div class="rating" style="width:0%" alt="Рейтинг не определён" title="Рейтинг не определён"></div>
{% ENDIF %}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% ENDFOR %}
</div>
{% ELSE %}
<!-- Вывод товаров Списком -->

И замените его этим вот кодом:

<div class="rating" style="width:0%" alt="Рейтинг не определён" title="Рейтинг не определён"></div>
{% ENDIF %}
</div>
</div>
</div>
</div>
<div class="cart-wrap">
<!--a class="add-cart quick btn-cart button" title="Быстро оформить заказ" 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}" {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE %}{% IF goods.MAX_REST_VALUE=0 %}style="display:none;"{% ENDIF %}{% ENDIF %}></a-->
<a class="add-cart btn-cart button" title="В корзину" 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}" {% IF SETTINGS_GOODS_DONT_PUT_TO_CART_MORE_THAN_AVAILABLE %}{% IF goods.MAX_REST_VALUE=0 %}style="display:none;"{% ENDIF %}{% ENDIF %}>В корзину</a>
</div>
</div>
</div>
</div>
</div>
{% ENDFOR %}
</div>
{% ELSE %}
<!-- Вывод товаров Списком -->


1 пункт из предыдущего письма сам сделал. Я обратно вернул как написал выше и у меня теперь нормально стала отображаться кнопка: http://skrinshoter.r...231217/xEqHLQ?a
2. На странице товара 2 кнопки В корзину и быстрый заказ.Там не отображается корзинка. Как ее сделать чтоб отображалась? Также цвет при наведении (сейчас он синий): http://skrinshoter.r...231217/eGdixq?a
3. Как изменить цвет кнопки Оформить заказ в корзине: http://skrinshoter.r...231217/TSBKLM?a и в Быстром заказе: http://skrinshoter.r...231217/pmgDuA?a
4. Как в режиме быстрый просмотр сделать такого же стиля как "В корзину" кнопку "Подробнее" http://skrinshoter.r...231217/3GU7i0?a5.5. 5. Как поменять цвет кнопки В корзину на главной странице. Сейчас когда на нее наводишь меняется цвет шрифта и корзиночка становится белой. Я не понял как его можно менять. Я хотел бы с другими цветами попробовать: http://skrinshoter.r...231217/tp05Pk?a
6. Хит и новинка в карточке товара съезжают с фото товара - некрасиво получается, как сиправить?: http://skrinshoter.r...231217/E56p9X?a

Сообщение отредактировал carden25: 23 Декабрь 2017 - 16:56


#11 Firefly

Firefly

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

  • Модераторы
  • 3 753 сообщений

Отправлено 23 Декабрь 2017 - 16:38

Просмотр сообщенияcarden25 (23 Декабрь 2017 - 15:57) писал:

1 пункт из предыдущего письма сам сделал. Я обратно вернул как написал выше и у меня теперь нормально стала отображаться кнопка: http://skrinshoter.r...231217/xEqHLQ?a
2. На странице товара 2 кнопки В корзину и быстрый заказ.Они сейчас отличаются по стилю и цвету от кнопок на главной странице. Как изменить цвет кнопки и сделать закругление? Также цвет при наведении (сейчас он синий): http://skrinshoter.r...231217/sGB6V0?a
3. Как изменить цвет кнопки Оформить заказ в корзине: http://skrinshoter.r...231217/TSBKLM?a и в Быстром заказе: http://skrinshoter.r...231217/pmgDuA?a
4. Как в режиме быстрый просмотр сделать такого же стиля как "В корзину" кнопку "Подробнее" http://skrinshoter.r...231217/3GU7i0?a5.5. 5. Как поменять цвет кнопки В корзину на главной странице. Сейчас когда на нее наводишь меняется цвет шрифта и корзиночка становится белой. Я не понял как его можно менять. Я хотел бы с другими цветами попробовать: http://skrinshoter.r...231217/tp05Pk?a

Здравствуйте.
Изменения Вам внес.
Корзину можно изменить только в графическом редакторе. Файл расположен в разделе Изображения (Сайт - Редактор шаблонов) с названием action-llist.png

#12 carden25

carden25

    Пользователь

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

Отправлено 23 Декабрь 2017 - 20:15

2. На странице товара 2 кнопки В корзину и быстрый заказ.Они сейчас отличаются по стилю и цвету от кнопок на главной странице. Как изменить цвет кнопки и сделать закругление? Также цвет при наведении (сейчас он синий): http://skrinshoter.r...231217/sGB6V0?a   Как все таки поменять цвет при наведении в самом товаре? Хочу попробовать оранжевый.
п.3, п.4 не увидел изменения, кнопка по старому отображается
p.S. кэш почистил

#13 carden25

carden25

    Пользователь

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

Отправлено 23 Декабрь 2017 - 21:27

Также в самом товаре Хит и Новинка выезжают за пределы фото . как исправить?: http://skrinshoter.r...231217/EfbNLF?a

Еще, как убрать кнопки соц сетей в футере и справа сбоку: http://skrinshoter.r...231217/6De7J6?a

Сообщение отредактировал carden25: 23 Декабрь 2017 - 22:47


#14 carden25

carden25

    Пользователь

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

Отправлено 26 Декабрь 2017 - 23:41

Здравствуйте? Поможете с изменениями выше?

#15 Mr.Nito

Mr.Nito

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

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

Отправлено 27 Декабрь 2017 - 11:26

Просмотр сообщенияcarden25 (23 Декабрь 2017 - 21:27) писал:

Также в самом товаре Хит и Новинка выезжают за пределы фото . как исправить?: http://skrinshoter.r...231217/EfbNLF?a

Еще, как убрать кнопки соц сетей в футере и справа сбоку: http://skrinshoter.r...231217/6De7J6?a
main.css

-иконку поправил кодом
.general-img .ico-product {top: 10px;height:32px;left: 25px;}
св-во
left: 25px

-соц.сети скрыл строкой
#community_widget_right,#footer .link-follow {display:none;}


#16 carden25

carden25

    Пользователь

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

Отправлено 27 Декабрь 2017 - 15:33

Просмотр сообщенияMr.Nito (27 Декабрь 2017 - 11:26) писал:


main.css

-иконку поправил кодом
.general-img .ico-product {top: 10px;height:32px;left: 25px;}
св-во
left: 25px

-соц.сети скрыл строкой
#community_widget_right,#footer .link-follow {display:none;}

Следующее. Шапка сайта выглядит не очень аккуратно сейчас.
Вот тут нарисовал как примерно вижу: https://yadi.sk/i/pr2yNPVU3Qoat2
Вот нашел на форуме понравилось как сделали, можно также сделать? http://skrinshoter.r...201217/1I033v?a





Просмотр сообщенияMr.Nito (27 Декабрь 2017 - 11:26) писал:


main.css

-иконку поправил кодом
.general-img .ico-product {top: 10px;height:32px;left: 25px;}
св-во
left: 25px

-соц.сети скрыл строкой
#community_widget_right,#footer .link-follow {display:none;}

Следующее. Шапка сайта выглядит не очень аккуратно сейчас.
Вот тут нарисовал как примерно вижу: https://yadi.sk/i/pr2yNPVU3Qoat2
Вот нашел на форуме понравилось как сделали, можно также сделать? http://skrinshoter.r...201217/1I033v?a





#17 Mr.Nito

Mr.Nito

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

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

Отправлено 27 Декабрь 2017 - 16:17

Просмотр сообщенияcarden25 (27 Декабрь 2017 - 15:33) писал:

Следующее. Шапка сайта выглядит не очень аккуратно сейчас.
Вот тут нарисовал как примерно вижу: https://yadi.sk/i/pr2yNPVU3Qoat2
Вот нашел на форуме понравилось как сделали, можно также сделать? http://skrinshoter.r...201217/1I033v?a

Перенёс блоки по вашему скриншоту

2й скриншот не открылся, пришлите, пожалуйста повторно.

#18 carden25

carden25

    Пользователь

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

Отправлено 27 Декабрь 2017 - 23:05

Спасибо! Вот скриншот, вот так нужно сделать http://skrinshoter.r...271217/dXIzsJ?a
Телефон, режим работы, и далее почта.

#19 Vaccina

Vaccina

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

  • Модераторы
  • 23 788 сообщений

Отправлено 28 Декабрь 2017 - 06:49

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

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
<div class="header-right col-sm-8 col-xs-12">
<ul class="contact-us-now">
						  {% IF SETTINGS_STORE_EMAIL_MAIN %}<li class="c-email"><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></li>{% ENDIF %}
						  {% IF SETTINGS_STORE_PHONE_NUMBER1 %}<li class="c-phone"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a></li>{% ENDIF %}
						  {% IF SETTINGS_STORE_PHONE_NUMBER2 %}<li class="c-phone hide"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{SETTINGS_STORE_PHONE_CITY_CODE2}{SETTINGS_STORE_PHONE_NUMBER2}">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}({SETTINGS_STORE_PHONE_CITY_CODE2}){SETTINGS_STORE_PHONE_NUMBER2}</a></li>{% ENDIF %}
						  {% IF SETTINGS_STORE_PHONE_NUMBER3 %}<li class="c-phone hide"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{SETTINGS_STORE_PHONE_CITY_CODE3}{SETTINGS_STORE_PHONE_NUMBER3}">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}({SETTINGS_STORE_PHONE_CITY_CODE3}){SETTINGS_STORE_PHONE_NUMBER3}</a></li>{% ENDIF %}
						 </ul>

замените на:
<div class="header-right col-sm-8 col-xs-12">
		  <div class="header-right col-sm-8 col-xs-12">
						 <ul class="contact-us-now">
						  {% IF SETTINGS_STORE_PHONE_NUMBER1 %}<li class="c-phone"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a></li>{% ENDIF %}
						  {% IF SETTINGS_STORE_WORK_TIME %}<li class="c-address"><span class="c-worktime">Работаем для вас : {SETTINGS_STORE_WORK_TIME}</span></li>{% ENDIF %}
  {% IF SETTINGS_STORE_EMAIL_MAIN %}<li class="c-email"><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></li>{% ENDIF %}
						  {% IF SETTINGS_STORE_PHONE_NUMBER2 %}<li class="c-phone hide"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{SETTINGS_STORE_PHONE_CITY_CODE2}{SETTINGS_STORE_PHONE_NUMBER2}">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}({SETTINGS_STORE_PHONE_CITY_CODE2}){SETTINGS_STORE_PHONE_NUMBER2}</a></li>{% ENDIF %}
						  {% IF SETTINGS_STORE_PHONE_NUMBER3 %}<li class="c-phone hide"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{SETTINGS_STORE_PHONE_CITY_CODE3}{SETTINGS_STORE_PHONE_NUMBER3}">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}({SETTINGS_STORE_PHONE_CITY_CODE3}){SETTINGS_STORE_PHONE_NUMBER3}</a></li>{% ENDIF %}
						 </ul>


Далее зайдите в main.css - найдите:
.header-right ul.contact-us-now li {display: inline-block;float: left;line-height: 36px;margin-left: 15px;padding-left: 28px;background: url("//design.topshoper.ru/ico-contactusnow.png?design=azure") no-repeat left -1px;font-size: 110%;}
.header-right ul.contact-us-now li:first-child {margin-left: 0px;}
.header-right ul.contact-us-now li.c-phone {background-position: left -36px;padding-left: 26px;}

замените на:
.header-right ul.contact-us-now li {display: block;line-height: 36px;text-align:  left;margin-left: 15px;padding-left: 28px;background: url("//design.topshoper.ru/ico-contactusnow.png?design=azure") no-repeat left -1px;font-size: 110%;}
.header-right ul.contact-us-now li.c-phone {background-position: left -36px;padding-left: 26px;}
.header-right ul.contact-us-now li.c-address {padding-left: 26px;line-height: 0;font-size: 11px;padding-bottom: 10px;background:none;}

далее найдите:
#header .header-right .header-right-inner {float:right;}

замените на:
#header .header-right .header-right-inner {float:right;margin-top:20px;}


#20 carden25

carden25

    Пользователь

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

Отправлено 01 Январь 2018 - 14:19

Просмотр сообщенияVaccina (28 Декабрь 2017 - 06:49) писал:

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

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
<div class="header-right col-sm-8 col-xs-12">
<ul class="contact-us-now">
{% IF SETTINGS_STORE_EMAIL_MAIN %}<li class="c-email"><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></li>{% ENDIF %}
{% IF SETTINGS_STORE_PHONE_NUMBER1 %}<li class="c-phone"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a></li>{% ENDIF %}
{% IF SETTINGS_STORE_PHONE_NUMBER2 %}<li class="c-phone hide"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{SETTINGS_STORE_PHONE_CITY_CODE2}{SETTINGS_STORE_PHONE_NUMBER2}">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}({SETTINGS_STORE_PHONE_CITY_CODE2}){SETTINGS_STORE_PHONE_NUMBER2}</a></li>{% ENDIF %}
{% IF SETTINGS_STORE_PHONE_NUMBER3 %}<li class="c-phone hide"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{SETTINGS_STORE_PHONE_CITY_CODE3}{SETTINGS_STORE_PHONE_NUMBER3}">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}({SETTINGS_STORE_PHONE_CITY_CODE3}){SETTINGS_STORE_PHONE_NUMBER3}</a></li>{% ENDIF %}
</ul>

замените на:
<div class="header-right col-sm-8 col-xs-12">
<div class="header-right col-sm-8 col-xs-12">
<ul class="contact-us-now">
{% IF SETTINGS_STORE_PHONE_NUMBER1 %}<li class="c-phone"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a></li>{% ENDIF %}
{% IF SETTINGS_STORE_WORK_TIME %}<li class="c-address"><span class="c-worktime">Работаем для вас : {SETTINGS_STORE_WORK_TIME}</span></li>{% ENDIF %}
{% IF SETTINGS_STORE_EMAIL_MAIN %}<li class="c-email"><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></li>{% ENDIF %}
{% IF SETTINGS_STORE_PHONE_NUMBER2 %}<li class="c-phone hide"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{SETTINGS_STORE_PHONE_CITY_CODE2}{SETTINGS_STORE_PHONE_NUMBER2}">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}({SETTINGS_STORE_PHONE_CITY_CODE2}){SETTINGS_STORE_PHONE_NUMBER2}</a></li>{% ENDIF %}
{% IF SETTINGS_STORE_PHONE_NUMBER3 %}<li class="c-phone hide"><label></label>: <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{SETTINGS_STORE_PHONE_CITY_CODE3}{SETTINGS_STORE_PHONE_NUMBER3}">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}({SETTINGS_STORE_PHONE_CITY_CODE3}){SETTINGS_STORE_PHONE_NUMBER3}</a></li>{% ENDIF %}
</ul>


Далее зайдите в main.css - найдите:
.header-right ul.contact-us-now li {display: inline-block;float: left;line-height: 36px;margin-left: 15px;padding-left: 28px;background: url("//design.topshoper.ru/ico-contactusnow.png?design=azure") no-repeat left -1px;font-size: 110%;}
.header-right ul.contact-us-now li:first-child {margin-left: 0px;}
.header-right ul.contact-us-now li.c-phone {background-position: left -36px;padding-left: 26px;}

замените на:
.header-right ul.contact-us-now li {display: block;line-height: 36px;text-align: left;margin-left: 15px;padding-left: 28px;background: url("//design.topshoper.ru/ico-contactusnow.png?design=azure") no-repeat left -1px;font-size: 110%;}
.header-right ul.contact-us-now li.c-phone {background-position: left -36px;padding-left: 26px;}
.header-right ul.contact-us-now li.c-address {padding-left: 26px;line-height: 0;font-size: 11px;padding-bottom: 10px;background:none;}

далее найдите:
#header .header-right .header-right-inner {float:right;}

замените на:
#header .header-right .header-right-inner {float:right;margin-top:20px;}


Добрый день!. С новым годом!
Проделал выше указанные инструкции
Вышло не совсем  аккуратно. Строка поиска совсем неаккуратно. http://skrinshoter.r...010118/uoxVSg?a
Как исправить чтобы поиск нормально отображался, как в предыдущей версии. А телефон с имейлом хорошо встали, только как сделать шрифт побольше для телефона?




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

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