Отключен JavaScript

У вас отключен JavaScript. Некоторые возможности системы не будут работать. Пожалуйста, включите JavaScript для получения доступа ко всем функциям.

Как В Шапке Фон Поменять На Картинку

Автор John, 10 апр. 2016 18:15

шапка фон картинка

Вперед

Авторизуйтесь для ответа в теме

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

#1 John

Продвинутый пользователь

Пользователи
61 сообщений

Отправлено 10 Апрель 2016 - 18:15

Добрый день, как в шапке серый фон (подложку) поменять на картинку?

Наверх

#2 RayLi

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

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

Отправлено 10 Апрель 2016 - 18:29

John (10 Апрель 2016 - 18:15) писал:

Добрый день, как в шапке серый фон (подложку) поменять на картинку?

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

Наверх

#3 John

Продвинутый пользователь

Пользователи
61 сообщений

Отправлено 11 Апрель 2016 - 05:12

SL-383041

Наверх

#4 RedHead

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

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

Отправлено 11 Апрель 2016 - 09:37

John (11 Апрель 2016 - 05:12) писал:

SL-383041

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

#header {position: relative;background-color: #2e2f33;}

замените ее например на:

#header {position: relative;background:url('{ASSETS_IMAGES_PATH}order-step-a.png?design=urban')}

где order-step-a.png замените на название предварительно загруженного, нужного изображения.

Так же фон встречается в строке:

#footer .footer-top {padding: 38px 0 25px;color: #fff;background-color: #494949;}

замените, например на:

#footer .footer-top {padding: 38px 0 25px;color: #fff;background:url('{ASSETS_IMAGES_PATH}order-step-current.png?design=urban')}

в строке:

#footer {background-color: #2e2f33;margin-top: 50px;}

замените, например на:

#footer {background:url('{ASSETS_IMAGES_PATH}order-step-a.png?design=urban');margin-top: 50px;}

Везде, аналогично первому пункту, замените название изображения.

Наверх

#5 John

Продвинутый пользователь

Пользователи
61 сообщений

Отправлено 11 Апрель 2016 - 12:35

спасибо.
как задать прозрачность серому фону в строке с горизонтальным меню (Главная - доставка... поиск). Потому что картинка закрывается этой серой строкой

Наверх

#6 Юля123

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

Пользователи
2 567 сообщений

Отправлено 11 Апрель 2016 - 12:43

John (11 Апрель 2016 - 12:35) писал:

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

.header-top {position: relative;background: #494949;color: #929596;height: 40px;}

и замените на код:

.header-top {position: relative;background: rgba(73, 73, 73, 0.67);color: #929596;height: 40px;

где значение 0.67 можете заменить на любое дробное промежуточное от 0 (полностью прозрачный) до 1(полностью непрозрачный)

Наверх

#7 John

Продвинутый пользователь

Пользователи
61 сообщений

Отправлено 11 Апрель 2016 - 14:14

Спасибо, за быстрый ответ. Все получается.
Напишите, пожалуйста, как заменить в шапке ваши пиктограммы на наши: грузовик, прием заказов, 100% гарантия возврата.

Наверх

#9 John

Продвинутый пользователь

Пользователи
61 сообщений

Отправлено 20 Апрель 2016 - 13:26

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

Наверх

#10 RedHead

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

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

Отправлено 20 Апрель 2016 - 14:09

John (20 Апрель 2016 - 13:26) писал:

Здравствуйте. Загрузите три изображения, которые будут показываться при наведении в раздел САЙТ - РЕДАКТОР ШАБЛОНОВ с помощью зеленой кнопки "добавить файлы". Напишите нам названия этих изображений и мы вышлем инструкцию, как реализовать их появление при наведении.

Наверх

#11 John

Продвинутый пользователь

Пользователи
61 сообщений

Отправлено 20 Апрель 2016 - 14:32

Спасибо, добавил.
Для показа картинок при наведении:
1) kosh_on.gif
2) maneken_on.gif
3) cotton_on.gif

Наверх

#12 Firefly

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

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

Отправлено 20 Апрель 2016 - 15:36

John (20 Апрель 2016 - 14:32) писал:

Спасибо, добавил.
Для показа картинок при наведении:
1) kosh_on.gif
2) maneken_on.gif
3) cotton_on.gif

Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Шаблоны -> HTML, найдите код:

		   <ul class="info-list">
		   <li class="info-item">
			<a href="http://{NET_DOMAIN}/page/Доставка">
			 <div class="info-icon">
			   <img src="{ASSETS_IMAGES_PATH}cotton.gif" alt="" title="" />
			 </div>
			 <div class="info-content">
			  <h6>Натуральные материалы</h6>
			  <p class="text-italic">Высокое качество</p>
			 </div>
			</a>
		   </li>
		   <li class="info-item">
			<a href="http://{NET_DOMAIN}/page/Доставка">
			 <div class="info-icon">
			   <img src="{ASSETS_IMAGES_PATH}maneken.gif" alt="" title="" />
			 </div>
			 <div class="info-content">
			   <h6>Индивидуальный пошив</h6>
			   <p class="text-italic">Мы можем отшить под ваш рост!</p>
			 </div>
			</a>
		  </li>
			<li class="info-item">
			  <a href="http://{NET_DOMAIN}/page/Доставка">
			   <div class="info-icon">
				 <img src="{ASSETS_IMAGES_PATH}kosh.gif" alt="" title="" />
			   </div>
			   <div class="info-content">
				<h6>Наложенный платеж</h6>
				<p class="text-italic">Оплата при получении!</p>
			   </div>
			  </a>
			</li>
		   </ul>

Замените на:

		   <ul class="info-list">
		   <li class="info-item">
			<a href="http://{NET_DOMAIN}/page/Доставка">
			 <div class="info-icon">
			  <div class="cotton"></div>
			 </div>
			 <div class="info-content">
			  <h6>Натуральные материалы</h6>
			  <p class="text-italic">Высокое качество</p>
			 </div>
			</a>
		   </li>
		   <li class="info-item">
			<a href="http://{NET_DOMAIN}/page/Доставка">
			 <div class="info-icon">
			  <div class="maneken"></div>
			 </div>
			 <div class="info-content">
			   <h6>Индивидуальный пошив</h6>
			   <p class="text-italic">Мы можем отшить под ваш рост!</p>
			 </div>
			</a>
		  </li>
			<li class="info-item">
			  <a href="http://{NET_DOMAIN}/page/Доставка">
			   <div class="info-icon">
				<div class="kosh"></div>
			   </div>
			   <div class="info-content">
				<h6>Наложенный платеж</h6>
				<p class="text-italic">Оплата при получении!</p>
			   </div>
			  </a>
			</li>
		   </ul>

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

.cotton {background:url({ASSETS_IMAGES_PATH}cotton.gif) no-repeat; width:66px; height:67px;}
.maneken {background:url({ASSETS_IMAGES_PATH}maneken.gif) no-repeat;width:31px; height:82px;}
.kosh {background:url({ASSETS_IMAGES_PATH}kosh.gif) no-repeat;width:54px; height:43px; margin: 20px 0;}
.cotton:hover {background:url({ASSETS_IMAGES_PATH}cotton_on.gif) no-repeat;}
.maneken:hover {background:url({ASSETS_IMAGES_PATH}maneken_on.gif) no-repeat;}
.kosh:hover {background:url({ASSETS_IMAGES_PATH}kosh_on.gif) no-repeat;}

Наверх

#13 John

Продвинутый пользователь

Пользователи
61 сообщений

Отправлено 21 Апрель 2016 - 09:55

Все получилось, очень довольны результатом. Спасибо за помощь

Наверх

#14 lelenushka

Продвинутый пользователь

Пользователи
93 сообщений

Отправлено 29 Сентябрь 2016 - 17:46

Юля123 (11 Апрель 2016 - 12:43) писал:

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

.header-top {position: relative;background: #494949;color: #929596;height: 40px;}

и замените на код:

.header-top {position: relative;background: rgba(73, 73, 73, 0.67);color: #929596;height: 40px;

Подскажите пожалуйста, пробую уже второй раз так делать, а в итоге на странице сайта все сбивается (((( SL-392237

Наверх

#15 Vaccina

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

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

Отправлено 30 Сентябрь 2016 - 02:04

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

.header-top {position: relative;background: rgba(73, 73, 73, 0.67);color: #fff;height: 40px;

замените на:

.header-top {position: relative;background: rgba(73, 73, 73, 0.67);color: #fff;height: 40px;}

Наверх

#16 lelenushka

Продвинутый пользователь

Пользователи
93 сообщений

Отправлено 30 Сентябрь 2016 - 09:41

Vaccina (30 Сентябрь 2016 - 02:04) писал:

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

.header-top {position: relative;background: rgba(73, 73, 73, 0.67);color: #fff;height: 40px;

замените на:

.header-top {position: relative;background: rgba(73, 73, 73, 0.67);color: #fff;height: 40px;}

ооооо, красота :rolleyes:

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

Наверх

#17 H8uAll

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

Пользователи
12 сообщений

Отправлено 16 Октябрь 2016 - 18:56

John (11 Апрель 2016 - 12:35) писал:

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

Наверх

#18 Firefly

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

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

Отправлено 16 Октябрь 2016 - 19:13

H8uAll (16 Октябрь 2016 - 18:56) писал:

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

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

.footer-fixed {position: fixed;background-color: #1e1e21;bottom: 0;width: 100%;z-index: 1001;color: #fff;}

Замените на:

.footer-fixed {position: fixed;background-color: rgba(30,30,33,0.8);bottom: 0;width: 100%;z-index: 1001;color: #fff;}

Наверх

#19 H8uAll

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

Пользователи
12 сообщений

Отправлено 16 Октябрь 2016 - 20:23

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

Наверх

#20 Mr.Nito

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

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

Отправлено 17 Октябрь 2016 - 09:47

H8uAll (16 Октябрь 2016 - 20:23) писал:

Здравствуйте.
Чтобы изменить прозрачность всего футера в файле найдите

/*** Подвал ***/
#footer {background-color: #2f3132;margin-top: 50px;}

замените на

/*** Подвал ***/
#footer {background-color: rgba(47,49,50,0.5);margin-top: 50px;}

где последнее значение 0.5 может быть от 0 до 1 (уровень прозрачности)

также можно изменить цвет новостей в футере

/* Новости в подвале */
#footer .footer-top {padding: 38px 0 25px;color: #fff;background-color: #494949;}

Наверх

Вперед

Обратно в Изменение общей стилистики

Темы с аналогичным тегами шапка, фон, картинка

Вопросы работы сервиса StoreLand → Дизайн → Шаблон Маркетплейс → Главная → Добавление В Шапку Сайта Почты И Сделать Крупно Номер Телефона Автор Гость_Art_* , 05 марта 2021 банер, телефон, почта, бренд и 2 еще...	Популярная тема 9 Ответов 992 Просмотров	Vaccina 18 марта 2021
Вопросы работы сервиса StoreLand → Дизайн → Шаблон Хобби → Каталог товаров → Картинка В Описании Категорий Для Мобильных Устройств Автор Гость_dwell_* , 19 янв. 2020 дизайн, картинка	Популярная тема 9 Ответов 1 597 Просмотров	RayLi 27 янв. 2020
Вопросы работы сервиса StoreLand → Дизайн → Шаблон Рассвет → Изменение общей стилистики → Фон Автор Гость_bok_* , 13 окт. 2019 фон	4 Ответов 1 425 Просмотров	stasia 27 янв. 2020
Вопросы работы сервиса StoreLand → Дизайн → Шаблон Техно → Изменение общей стилистики → Добавил Элементы В Шапке Автор Гость_like.hornet.6_* , 22 авг. 2019 шапка, добавить, элементы	0 Ответов 1 603 Просмотров	like.hornet.6 22 авг. 2019
Вопросы работы сервиса StoreLand → Дизайн → Шаблон Техно → Изменение общей стилистики → Ссылки На Странице В Шапке Автор Гость_vproekt_* , 10 апр. 2019 шапка	0 Ответов 1 674 Просмотров	vproekt 10 апр. 2019

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

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

Как В Шапке Фон Поменять На Картинку

#1 John

#2 RayLi

#3 John

#4 RedHead

#5 John

#6 Юля123

#7 John

#8 Юля123

#9 John

#10 RedHead

#11 John

#12 Firefly

#13 John

#14 lelenushka

#15 Vaccina

#16 lelenushka

#17 H8uAll

#18 Firefly

#19 H8uAll

#20 Mr.Nito

Темы с аналогичным тегами шапка, фон, картинка

Добавление В Шапку Сайта Почты И Сделать Крупно Номер Телефона

Картинка В Описании Категорий Для Мобильных Устройств

Фон

Добавил Элементы В Шапке

Ссылки На Странице В Шапке

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

Google поиск

Как В Шапке Фон Поменять На Картинку

Темы с аналогичным тегами шапка, фон, картинка

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

Войти

Google поиск