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


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


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

#21 carden25

carden25

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

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

Отправлено 09 Январь 2018 - 21:51

Добрый день! Вы поможете мне  моими вопросами?

#22 Vaccina

Vaccina

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

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

Отправлено 10 Январь 2018 - 08:33

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

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
<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>

замените на:
<div class="header-right col-sm-7 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>
					 </div>
Интернет магазин трендовых товаров для всей семьи   ТопШопер.ру.png

На счет шрифта, зайдите в main.css - найдите:
.header-right ul.contact-us-now li.c-phone {background-position: left -36px;padding-left: 26px;}

замените на:
.header-right ul.contact-us-now li.c-phone {background-position: left -36px;padding-left: 26px;font-size: 20px;}


#23 carden25

carden25

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

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

Отправлено 10 Январь 2018 - 22:43

Отлично! Супер, а как их теперь местами поменять, чтобы поиск по центру а контакты в правом углу?

#24 metry

metry

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

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

Отправлено 11 Январь 2018 - 11:06

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

		  <div class="header-right col-sm-8 col-xs-12">
				  <div class="header-right col-sm-7 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>
				  </div>
						 <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 col-sm-6 col-xs-12">
						 <!--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 class="header-right col-sm-6 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>
				  </div>
									   
			</div>

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

#header .header-right .header-right-inner {float:right;margin-top:20px;}

замените на:

#header .header-right .header-right-inner {float:left;margin-top:20px;}


#25 carden25

carden25

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

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

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

Спасибо, заработало.
Следующее.
Мне нужно чтобы все кнопки были в одном стиле как на товарах на главной странице. http://skrinshoter.r...0118/MMh2Nlne?a Т.е. желтая кнопка и оранжевая при наведении.
1.как сделать в корзине: http://skrinshoter.r...0118/TOLrqPSF?a
2.как сделать в быстром заказе? http://skrinshoter.r...0118/Il3m5S0j?a
3. как поменять цвета здесь(и при наведении тоже): http://skrinshoter.r...7ArJ?refresh=10
4. при оформлении заказа: http://skrinshoter.r...0118/d0NryC3q?a
5. как уменьшить высоту этого блока: http://skrinshoter.r...EKPD?refresh=10
6. поменять цвета кнопок на странице товара: http://skrinshoter.r...0118/Cbkyg13l?a

#26 metry

metry

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

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

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

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

input[type="button"], .button, button, .paymentFormTbodySubmitButton, .paymentFormSubmitLink {font-size: 16px;text-transform: none;padding: 6px 20px;-webkit-border-radius: 18px;-moz-border-radius: 18px;border-radius: 18px;color: #666666;border: 1px solid #e9e9e9;background: #FFF;cursor:pointer;}
input[type="button"]:hover, .button:hover, button:hover, .paymentFormTbodySubmitButton:hover, .paymentFormSubmitLink:hover {background-color: #3cabda;color: #FFF;border-color: #3cabda;}

замените на:

input[type="button"], .button, button, .paymentFormTbodySubmitButton, .paymentFormSubmitLink {font-size: 16px;text-transform: none;padding: 6px 20px;-webkit-border-radius: 18px;-moz-border-radius: 18px;border-radius: 18px;color: #666666;border: 1px solid #e9e9e9;background: #ffdc4d;cursor:pointer;}
input[type="button"]:hover, .button:hover, button:hover, .paymentFormTbodySubmitButton:hover, .paymentFormSubmitLink:hover {background-color: #ff5f1f;color: #000;border-color: #bf3a05;}


2. Далее найдите:
.product-shop .add-to-cart .btn-cart:hover {background-color: #3cabda;border-color: #3cabda;}

замените на:

.product-shop .add-to-cart .btn-cart:hover {background-color: #ff5f1f;border-color: #bf3a05; color: #000;}

3. Далее найдите:

.mini-cart .block-content .block-inner .actions .button {font-size: 14px;padding: 5px 12px;margin: 15px 5px 15px 0;float: left;background: #FFF;}
.mini-cart .block-content .block-inner .actions .button:last-child {float:right;}
.mini-cart .block-content .block-inner .actions .button:hover {background-color: #3cabda;cursor:pointer;}

замените на:

.mini-cart .block-content .block-inner .actions .button {font-size: 14px;padding: 5px 12px;margin: 15px 5px 15px 0;float: left;background: #ffdc4d;border: 1px solid #e9e9e9;color:#000;}
.mini-cart .block-content .block-inner .actions .button:last-child {float:right;}
.mini-cart .block-content .block-inner .actions .button:hover {background-color: #ff5f1f;color: #000;border-color: #bf3a05;cursor:pointer;}

5. Найдите:
#breadcrumbs {position: relative;padding: 30px 0 20px;}

замените на:
#breadcrumbs {position: relative;padding: 5px 0 5px;}

6. найдите:

.product-shop .add-to-cart .btn-cart:hover {background-color: #3cabda;border-color: #3cabda;}

замените на:

.product-shop .add-to-cart .btn-cart:hover {background-color: #ff5f1f;border-color: #bf3a05;}


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

.product-shop .add-to-cart .btn-cart {position: relative;padding: 12px 24px 12px 53px;margin: 0 0;font-size: 14px;background: #c0c0c0;color: #FFF;border-color: #c0c0c0;-webkit-border-radius: 24px;-moz-border-radius: 24px;border-radius: 24px;background-image: url("{ASSETS_IMAGES_PATH}action-llist.png?design=azure");background-repeat: no-repeat;background-position: 9px -346px;}

замените на:

.product-shop .add-to-cart .btn-cart {position: relative;padding: 12px 24px 12px 53px;margin: 0 0;font-size: 14px;color: #666666;border: 1px solid #e9e9e9;background: #ffdc4d;-webkit-border-radius: 24px;-moz-border-radius: 24px;border-radius: 24px;background-image: url("{ASSETS_IMAGES_PATH}action-llist.png?design=azure");background-repeat: no-repeat;background-position: 9px -346px;}


#27 carden25

carden25

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

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

Отправлено 17 Январь 2018 - 00:15

Отлично, спасибо.
1.Как сделать чтобы отображались картинки Корзинки, они почему то не показываются здесь: http://skrinshoter.r...0118/SC9UcUf0?a
и в быстром просмотре здесь: http://skrinshoter.r...0118/ZtbadxOC?a
2. Как поменять цвета этого значка "+" на черный цвет здесь: http://skrinshoter.r...0118/5qkBmhM0?a
и здесь: http://skrinshoter.r...0118/dXgyhOc3?a

#28 Vaccina

Vaccina

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

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

Отправлено 17 Январь 2018 - 02:47

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

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.add-cart.btn-cart.button {background: #ffdc4d;font-weight: 600;border-radius: 20px;border: 1px solid #000;color: #000;}

замените на:
.add-cart.btn-cart.button {background-color: #ffdc4d;font-weight: 600;border-radius: 20px;border: 1px solid #000;color: #000;}

далее найдите:
.btn-loadmore:after {content: " ";padding: 0 0;height: 100%;padding-right: 22px;background: url("{ASSETS_IMAGES_PATH}nav-cir.png?design=azure") no-repeat left 7px;display: block;position: absolute;right: 15px;top: 0;}
.btn-loadmore.active:after {content: " ";background: url("{ASSETS_IMAGES_PATH}nav-cir.png?design=azure") no-repeat left -45px;}
.btn-loadmore:hover:after {content: " ";color: #FFF;}

замените на:
.btn-loadmore:after {content: "+";font-size: 24px;padding: 0 0;height: 100%;padding-right: 22px;display: block;position: absolute;right: 10px;top: 0;}
.btn-loadmore.active:after {content: "-";}
.btn-loadmore:hover:after {color: #FFF;}


#29 carden25

carden25

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

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

Отправлено 14 Март 2018 - 22:51

Здравствуйте!
Как поменять цвет теста полного описания товара с серого на черный как в кратком описании товара?
скриншот: http://skrinshoter.r...0318/C5s4TfW6?a

#30 Vaccina

Vaccina

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

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

Отправлено 15 Март 2018 - 00:49

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

Вы можете заменить общий серый шрифт на сайте в разделе Сайт - Редактор шаблонов - main.css - в строке:
body {margin: 0;font-family: Arial, sans-serif;font-size: 12px;line-height: 20px;background-color: #ffffff;color: #909090;overflow-x: hidden;position: relative;}

для этого измените значение color

#31 carden25

carden25

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

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

Отправлено 17 Март 2018 - 20:30

1. Спасибо, подскажите покажите как убрать блок в меню как указано на скриншоте? http://skrinshoter.r...0318/kGTGZ7wi?aТам где написано "предыдущий", "следующий"

2.как изменить цвет текста названий товаров на главной когда он на белом фоне (на него еще не наведена мышь)
скриншот: http://skrinshoter.r...0318/cAAHYBOK?a

#32 carden25

carden25

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

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

Отправлено 20 Март 2018 - 23:23

Добрый день! Вы поможете мне  моими вопросами?

#33 Mr.Nito

Mr.Nito

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

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

Отправлено 21 Март 2018 - 14:22

Просмотр сообщенияcarden25 (17 Март 2018 - 20:30) писал:

1. Спасибо, подскажите покажите как убрать блок в меню как указано на скриншоте? http://skrinshoter.r...0318/kGTGZ7wi?aТам где написано "предыдущий", "следующий"

2.как изменить цвет текста названий товаров на главной когда он на белом фоне (на него еще не наведена мышь)
скриншот: http://skrinshoter.r...0318/cAAHYBOK?a

1. В main.css меняем
/* Следующий Предыдущий товар */
#product-next-pre {padding-top: 30px;}

на

/* Следующий Предыдущий товар */
#product-next-pre {padding-top: 30px;display: none;}

2. Main.css

после
.products-grid .item:hover .item-inner .item-info .info-inner .item-title a {color: #3cabda;}
добавьте
.products-grid .item .item-inner .item-info .info-inner .item-title a {color: #000;}
где #000 Ваш код цвета

#34 gribkov.axel

gribkov.axel

    Новичок

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

Отправлено 22 Март 2018 - 07:27

Добрый день!

Как изменить размер кнопок категорий товаров в шапке либо разместить их в несколько рядов? Не помещаются все категории

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

  • Screenshot_1.jpg


#35 status321

status321

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

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

Отправлено 24 Июль 2019 - 12:53

1

#36 metry

metry

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

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

Отправлено 25 Июль 2019 - 14:55

Добрый день. Пожалуйста, уточните Ваш вопрос.




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

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