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


Изменение Цвета Сайта

Автор MikhailC, 05 июня 2015 18:50
цвет лазурь

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

#1 MikhailC

MikhailC

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

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

Отправлено 05 Июнь 2015 - 18:50

Здравствуйте, подскажите пожалуйста, как изменить стандартное синее оформление сайта на красное?
И как поменять значок и название в шапке сайта?

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

  • Capture_2015_06_05_18_46_35_741.png

#2 Firefly

Firefly

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

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

Отправлено 05 Июнь 2015 - 18:53

Просмотр сообщенияMikhailC (05 Июнь 2015 - 18:50) писал:

Здравствуйте, подскажите пожалуйста, как изменить стандартное синее оформление сайта на красное?
И как поменять значок и название в шапке сайта?

Здравствуйте. Пожалуйста, уточните Ваш номер аккаунта.

#3 MikhailC

MikhailC

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

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

Отправлено 05 Июнь 2015 - 19:01

Просмотр сообщенияFirefly (05 Июнь 2015 - 18:53) писал:

Здравствуйте. Пожалуйста, уточните Ваш номер аккаунта.
номер аккаунта SL-347091

#4 Firefly

Firefly

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

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

Отправлено 05 Июнь 2015 - 19:33

Просмотр сообщенияMikhailC (05 Июнь 2015 - 19:01) писал:

номер аккаунта monsterrus.storeland.ru
мой айди: 11667

То, что указано красной стрелкой у Вас на скриншотах является логотипом. Чтобы его изменить зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Кнопка "Добавить файлы" и загрузите новое изображение с именем logo.png
Размер логотипа по умолчанию составляет 230 x 63px.

Чтобы изменить цвет верхней полосы в шапке сайта зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css, найдите код:
#header-top {height: 41px;line-height: 36px;border-top: 5px solid #3cabda;position: relative;}

Здесь Вам необходимо изменить код цвета #3cabda;

Чтобы изменить цвет панели меню найдите код:
#menu .inner {width: 100%;background: #3cabda url("{ASSETS_IMAGES_PATH}breadcrumbs-bg.jpg") no-repeat center top;}

Здесь цвет задан двумя параметрами: с помощью изображения (бэкграунда) breadcrumbs-bg.jpg, которое Вы можете заменить, загрузив подобное изображение с тем же названием и размерами (1920x231px) через кнопку "Добавить файлы", а так же с помощью цвета, заданного кодом #3cabda, который Вы так же можете изменить.

За цвет, расположенный под слайдером отвечают 2 строки кода.
Найдите код:
#breadcrumbs:before, #slideshow:before {background-image: url("{ASSETS_IMAGES_PATH}sl-bg.jpg");background-color: #3cabda;background-position: top center;background-repeat: no-repeat;bottom: 0;content: "";display: block;left: 0;position: absolute;right: 0;top: -80px;}

И код:
#breadcrumbs:before, #slideshow:before {background-image: url("{ASSETS_IMAGES_PATH}sl-bg.jpg");background-color: #3cabda;background-position: top center;background-repeat: no-repeat;bottom: 0;content: "";display: block;left: 0;position: absolute;right: 0;top: -80px;z-index: -1;}

В этих строках Вам необходимо изменять значения кода цвета #3cabda и так же подложку в виде изображения (бэкграунда) с названием sl-bg.jpg . Изображение с таким же названием и разрешением (1920x651px) Вам необходимо загрузить через кнопку "Добавить файлы"

Так же Вы можете быстро изменить один цвет, если он часто встречается в шаблоне с помощью автозамены. Для этого при редактировании кода стилей в шаблоне main.css выполните двойное нажатие комбинации Ctrl+F, чтобы появилось второе поле. В первое введите первое значение кода цвета, которое необходимо заменить, а во второе введите тот код цвета, на который Вы желаете изменить. Далее нажмите All.
Не забудьте после этого сохранить изменения с помощью кнопки Сохранить.
Так же не забывайте делать бэкап шаблона, для того, чтобы можно было восстановить предыдущее состояние магазина в случае ошибочного изменения.

#5 MikhailC

MikhailC

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

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

Отправлено 05 Июнь 2015 - 19:47

Огромное спасибо, высший балл!

#6 MikhailC

MikhailC

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

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

Отправлено 05 Июнь 2015 - 22:27

Спасибо всё исправилось

#7 MikhailC

MikhailC

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

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

Отправлено 06 Июнь 2015 - 12:03

Просмотр сообщенияFirefly (05 Июнь 2015 - 18:53) писал:

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

А так же цвет иконок на главной в самом низу

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

  • Capture_2015_06_06_12_00_19_433.png
  • Capture_2015_06_06_12_05_44_5.png

#8 RayLi

RayLi

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

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

Отправлено 06 Июнь 2015 - 12:25

Просмотр сообщенияMikhailC (06 Июнь 2015 - 12:03) писал:

Здравствуйте, подскажите как изменить цвет всплывающего окна при наведении на товар?

А так же цвет иконок на главной в самом низу

Здравствуйте.
На данный момент цвет всплывающего меню на вашем сайте уже изменён.
Уточните, пожалуйста - данный вопрос больше не актуален?

Что касается цвета иконок, то вам нужно в бэк-офисе вашего интернет-магазина, в разделе Сайт -> Редактор шаблонов найти данный файл: ico-contactus.png и изменить его цвет в любом удобном для вас фоторедакторе, затем там же замените его на уже отредактированный файл.

#9 MikhailC

MikhailC

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

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

Отправлено 06 Июнь 2015 - 13:24

Просмотр сообщенияRayLi (06 Июнь 2015 - 12:25) писал:

Здравствуйте.
На данный момент цвет всплывающего меню на вашем сайте уже изменён.
Уточните, пожалуйста - данный вопрос больше не актуален?

Что касается цвета иконок, то вам нужно в бэк-офисе вашего интернет-магазина, в разделе Сайт -> Редактор шаблонов найти данный файл: ico-contactus.png и изменить его цвет в любом удобном для вас фоторедакторе, затем там же замените его на уже отредактированный файл.

Cпасибо, первый вопрос больше не актуален, а как сделать чтобы в слайде было 4 картинки, вместо стандартных пяти?

#10 Danil

Danil

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

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

Отправлено 06 Июнь 2015 - 13:33

Просмотр сообщенияMikhailC (06 Июнь 2015 - 13:24) писал:

Cпасибо, первый вопрос больше не актуален, а как сделать чтобы в слайде было 4 картинки, вместо стандартных пяти?
Здравствуйте.
В шаблоне html найдите код 
<!-- Jssor Slider Слайдер Начало -->
	  {% IF index_page %}
	  <div id="slideshow" class="wrap">
		<div id="slider">
		  <!-- Slides Container -->
		  <div u="slides" class="slides_container">
			<div>
			  <img u="image" src="{ASSETS_IMAGES_PATH}slide1.png?design=azure" />
			</div>
			<div>
			  <img u="image" src="{ASSETS_IMAGES_PATH}slide2.png?design=azure" />
			</div>
			<div>
			  <img u="image" src="{ASSETS_IMAGES_PATH}slide3.png?design=azure" />
			</div>
			<div>
			  <img u="image" src="{ASSETS_IMAGES_PATH}slide4.png?design=azure" />
			</div>
			 <div>
			  <img u="image" src="{ASSETS_IMAGES_PATH}slide5.png?design=azure" />
			</div>
		  </div>
		</div>
	  </div>
	  {% ENDIF %}
	  <!-- Jssor Slider Слайдер Конец -->
и замените на 
<!-- Jssor Slider Слайдер Начало -->
	  {% IF index_page %}
	  <div id="slideshow" class="wrap">
		<div id="slider">
		  <!-- Slides Container -->
		  <div u="slides" class="slides_container">
			<div>
			  <img u="image" src="{ASSETS_IMAGES_PATH}slide1.png?design=azure" />
			</div>
			<div>
			  <img u="image" src="{ASSETS_IMAGES_PATH}slide2.png?design=azure" />
			</div>
			<div>
			  <img u="image" src="{ASSETS_IMAGES_PATH}slide3.png?design=azure" />
			</div>
			<div>
			  <img u="image" src="{ASSETS_IMAGES_PATH}slide4.png?design=azure" />
			</div>
		  </div>
		</div>
	  </div>
	  {% ENDIF %}
	  <!-- Jssor Slider Слайдер Конец -->

#11 MikhailC

MikhailC

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

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

Отправлено 06 Июнь 2015 - 13:36

Просмотр сообщенияDanil (06 Июнь 2015 - 13:33) писал:

Здравствуйте.
В шаблоне html найдите код
<!-- Jssor Slider Слайдер Начало -->
{% IF index_page %}
<div id="slideshow" class="wrap">
<div id="slider">
<!-- Slides Container -->
<div u="slides" class="slides_container">
<div>
<img u="image" src="{ASSETS_IMAGES_PATH}slide1.png?design=azure" />
</div>
<div>
<img u="image" src="{ASSETS_IMAGES_PATH}slide2.png?design=azure" />
</div>
<div>
<img u="image" src="{ASSETS_IMAGES_PATH}slide3.png?design=azure" />
</div>
<div>
<img u="image" src="{ASSETS_IMAGES_PATH}slide4.png?design=azure" />
</div>
<div>
<img u="image" src="{ASSETS_IMAGES_PATH}slide5.png?design=azure" />
</div>
</div>
</div>
</div>
{% ENDIF %}
<!-- Jssor Slider Слайдер Конец -->
и замените на
<!-- Jssor Slider Слайдер Начало -->
	 {% IF index_page %}
	 <div id="slideshow" class="wrap">
	 <div id="slider">
		 <!-- Slides Container -->
		 <div u="slides" class="slides_container">
		 <div>
			 <img u="image" src="{ASSETS_IMAGES_PATH}slide1.png?design=azure" />
		 </div>
		 <div>
			 <img u="image" src="{ASSETS_IMAGES_PATH}slide2.png?design=azure" />
		 </div>
		 <div>
			 <img u="image" src="{ASSETS_IMAGES_PATH}slide3.png?design=azure" />
		 </div>
		 <div>
			 <img u="image" src="{ASSETS_IMAGES_PATH}slide4.png?design=azure" />
		 </div>
		 </div>
	 </div>
	 </div>
	 {% ENDIF %}
	 <!-- Jssor Slider Слайдер Конец -->
Спасибо, да прибудет с вами сила!

#12 MikhailC

MikhailC

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

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

Отправлено 06 Июнь 2015 - 17:54

Просмотр сообщенияRayLi (06 Июнь 2015 - 12:25) писал:

Здравствуйте.
На данный момент цвет всплывающего меню на вашем сайте уже изменён.
Уточните, пожалуйста - данный вопрос больше не актуален?

Что касается цвета иконок, то вам нужно в бэк-офисе вашего интернет-магазина, в разделе Сайт -> Редактор шаблонов найти данный файл: ico-contactus.png и изменить его цвет в любом удобном для вас фоторедакторе, затем там же замените его на уже отредактированный файл.
Здравствйутеэ,подскажите пожалуйста,
1)как удалить 3 кнопки: фейсбук, ютуб, твиттер. И добавить инстаграм?
И как приложить ссылку к этим картинкам, чтобы когда на них нажимаешь и переходило в нужную соц. сеть с нужным аккаунтом в ней (открытие ссылки нужно в новой вкладке)?

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

  • Capture_2015_06_06_17_50_24_732.png

#13 Danil

Danil

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

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

Отправлено 06 Июнь 2015 - 18:10

Просмотр сообщенияMikhailC (06 Июнь 2015 - 17:54) писал:

Здравствйутеэ,подскажите пожалуйста, как удалить 3 кнопки: фейсбук, ютуб, твиттер. И добавить инстаграм?
И как приложить ссылку к этим картинкам, чтобы когда на них нажимаешь и переходило в нужную соц. сеть с нужным аккаунтом в ней (открытие ссылки нужно в новой вкладке)?
В шаблоне html найдите код 
<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>
и замените на 
<ul class="connect-us">
				  <li><a href="Ссылка на инстаграм" class="fa fa-instagram"></a></li>
				  <li><a href="Ссылка на группу в контакте" class="fa fa-vk"></a></li>
				</ul>
В main.css найдите код 
.fa-vk:before {content: "\f189";}
и замените на 
.fa-vk:before {content: "\f189";}
.fa-instagram:before {content: "\f16d";}

#14 MikhailC

MikhailC

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

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

Отправлено 06 Июнь 2015 - 18:24

Просмотр сообщенияDanil (06 Июнь 2015 - 18:10) писал:

В шаблоне html найдите код
<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>
и замените на
<ul class="connect-us">
<li><a href="Ссылка на инстаграм" class="fa fa-instagram"></a></li>
				 <li><a href="Ссылка на группу в контакте" class="fa fa-vk"></a></li>
			 </ul>
В main.css найдите код
.fa-vk:before {content: "\f189";}
и замените на
.fa-vk:before {content: "\f189";}
.fa-instagram:before {content: "\f16d";}

Спасибо огромное, подскажите, а как вставить онлайн консультант на сайт? ( он должен отображаться сбоку) То есть куда вставлять код

#15 Danil

Danil

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

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

Отправлено 06 Июнь 2015 - 18:32

Просмотр сообщенияMikhailC (06 Июнь 2015 - 18:24) писал:

Спасибо огромное, подскажите, а как вставить онлайн консультант на сайт? ( он должен отображаться сбоку) То есть куда вставлять код
Добавляйте код в раздел Настройки - Основные - "Код для вывода на всех страницах".

#16 MikhailC

MikhailC

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

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

Отправлено 06 Июнь 2015 - 18:53

спасибо большое

#17 Danil

Danil

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

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

Отправлено 06 Июнь 2015 - 18:56

Просмотр сообщенияMikhailC (06 Июнь 2015 - 18:53) писал:

К6Е8
Нажмите правой кнопкой мыши по категории и выберите "удалить категорию"

#18 MikhailC

MikhailC

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

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

Отправлено 06 Июнь 2015 - 23:50

Просмотр сообщенияDanil (06 Июнь 2015 - 18:56) писал:

Нажмите правой кнопкой мыши по категории и выберите "удалить категорию"
Спасибо, подскажите пожалуйста, как отредактировать условия доставки товара, нигде не могу найти

#19 Danil

Danil

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

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

Отправлено 07 Июнь 2015 - 09:19

Просмотр сообщенияMikhailC (06 Июнь 2015 - 23:50) писал:

Спасибо, подскажите пожалуйста, как отредактировать условия доставки товара, нигде не могу найти
Условия доставки редактируются в разделе Настройки - Доставка.

#20 MikhailC

MikhailC

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

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

Отправлено 07 Июнь 2015 - 19:14

Просмотр сообщенияDanil (07 Июнь 2015 - 09:19) писал:

Условия доставки редактируются в разделе Настройки - Доставка.
Спасибо, разобрался
Обратно в Шаблон Лазурь


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

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

  1. Форум владельцев интернет-магазинов
  2. → Вопросы работы сервиса StoreLand
  3. → Дизайн
  4. → Шаблон Лазурь
  5. Privacy Policy