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


Правки В Шапке


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

#141 Юля123

Юля123

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

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

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

Просмотр сообщенияgalya.bu7 (11 Февраль 2016 - 09:03) писал:

Я попробовала заменить, тогда второй телефон сползает вниз, не влезает в одну полосу два телефона :(

Здравствуйте, в дополнение к инструкциям из поста №139. В шаблоне HTMl найдите код:

			<div class="topheader-left col-md-5 col-sms-9 col-smb-6">

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

			<div class="topheader-left col-md-6 col-sms-9 col-smb-6">

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

			<div class="topheader-right col-md-7 col-sms-3 col-smb-6">

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

			<div class="topheader-right col-md-6 col-sms-3 col-smb-6">

дальше примените инструкции по добавлению телефона в шапке.

#142 galya.bu7

galya.bu7

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

  • Пользователи
  • PipPipPipPip
  • 323 сообщений
  • ГородСмоленск

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

Здравствуйте! аккаунт Аккаунт SL-375480  Как уменьшить ширину шапки?


Изображение

#143 Юля123

Юля123

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

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

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

Просмотр сообщенияgalya.bu7 (12 Февраль 2016 - 12:43) писал:

Здравствуйте! аккаунт Аккаунт SL-375480  Как уменьшить ширину шапки?




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

#header {position: relative;padding: 32px 0 30px;background: url('http://st.storeland.net/9/1819/966/bg-top.jpg') repeat center center;height: 99px;}

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

#header {position: relative;background: url('http://st.storeland.net/9/1819/966/bg-top.jpg') repeat center center;}


#144 galya.bu7

galya.bu7

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

  • Пользователи
  • PipPipPipPip
  • 323 сообщений
  • ГородСмоленск

Отправлено 12 Февраль 2016 - 13:12

Просмотр сообщенияЮля123 (12 Февраль 2016 - 13:05) писал:

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

#header {position: relative;padding: 32px 0 30px;background: url('http://st.storeland.net/9/1819/966/bg-top.jpg') repeat center center;height: 99px;}

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

#header {position: relative;background: url('http://st.storeland.net/9/1819/966/bg-top.jpg') repeat center center;}
CПасибо! как теперь основные категории каталога поднять чуть повыше к логотипу и изменить цвет кнопок (чтобы они меняли цвет независимый от фона)

#145 Firefly

Firefly

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

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

Отправлено 12 Февраль 2016 - 13:33

Просмотр сообщенияgalya.bu7 (12 Февраль 2016 - 13:12) писал:

CПасибо! как теперь основные категории каталога поднять чуть повыше к логотипу и изменить цвет кнопок (чтобы они меняли цвет независимый от фона)

Здравствуйте.
Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css, найдите код:
#custommenu ul.mainnav li.level0 {display:block;float:left;border: none;position: static;text-align: left;padding: 21px 5px 21px 0px;}

Замените на:
#custommenu ul.mainnav li.level0 {display:block;float:left;border: none;position: static;text-align: left;padding: 10px 5px 21px 0px;}

Найдите код:
#custommenu ul.mainnav li.level0 > a {display: block;padding: 8px 10px;font-size: 150%;font-weight: normal;-webkit-border-radius: 22px;-moz-border-radius: 22px;border-radius: 22px;position: relative;color: #FFF;border: 1px solid transparent;}

Замените на:
#custommenu ul.mainnav li.level0 > a {display: block;padding: 8px 10px;font-size: 150%;font-weight: normal;-webkit-border-radius: 22px;-moz-border-radius: 22px;border-radius: 22px;position: relative;color: #FFF;border: 1px solid transparent;background: #0687F8;}

Измените код цвета #0687F8 на необходимый.

Так же чтобы изменить цвет активного/при наведении пункта меню, найдите код:
#custommenu ul.mainnav li.level0.active > a, #custommenu ul.mainnav li.level0:hover > a {color: #FFF;position: relative;background-color: rgba(255, 255, 255, 0.1);border-color: rgba(255, 255, 255, 0.3);}

Измените код цвета rgba(255, 255, 255, 0.1)

#146 galya.bu7

galya.bu7

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

  • Пользователи
  • PipPipPipPip
  • 323 сообщений
  • ГородСмоленск

Отправлено 12 Февраль 2016 - 13:50

Просмотр сообщенияFirefly (12 Февраль 2016 - 13:33) писал:

Здравствуйте.
Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css, найдите код:
#custommenu ul.mainnav li.level0 {display:block;float:left;border: none;position: static;text-align: left;padding: 21px 5px 21px 0px;}

Замените на:
#custommenu ul.mainnav li.level0 {display:block;float:left;border: none;position: static;text-align: left;padding: 10px 5px 21px 0px;}

Найдите код:
#custommenu ul.mainnav li.level0 > a {display: block;padding: 8px 10px;font-size: 150%;font-weight: normal;-webkit-border-radius: 22px;-moz-border-radius: 22px;border-radius: 22px;position: relative;color: #FFF;border: 1px solid transparent;}

Замените на:
#custommenu ul.mainnav li.level0 > a {display: block;padding: 8px 10px;font-size: 150%;font-weight: normal;-webkit-border-radius: 22px;-moz-border-radius: 22px;border-radius: 22px;position: relative;color: #FFF;border: 1px solid transparent;background: #0687F8;}

Измените код цвета #0687F8 на необходимый.

Так же чтобы изменить цвет активного/при наведении пункта меню, найдите код:
#custommenu ul.mainnav li.level0.active > a, #custommenu ul.mainnav li.level0:hover > a {color: #FFF;position: relative;background-color: rgba(255, 255, 255, 0.1);border-color: rgba(255, 255, 255, 0.3);}

Измените код цвета rgba(255, 255, 255, 0.1)
Спасибо большое!     как сделать блоки для добавления текстовой информации слева и справа от логотипа?

#147 RedHead

RedHead

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

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

Отправлено 12 Февраль 2016 - 14:13

Просмотр сообщенияgalya.bu7 (12 Февраль 2016 - 13:50) писал:

Спасибо большое! как сделать блоки для добавления текстовой информации слева и справа от логотипа?

Здравствуйте. В шаблоне html замените блок кода:
<!-- Logo -->
			<div id="logo" class="col-sm-4 col-xs-12">
			  <a title="{SETTINGS_STORE_NAME}" href="http://{NET_DOMAIN}/">
				<img src="{ASSETS_IMAGES_PATH}logo.png" alt="{SETTINGS_STORE_NAME}">
			  </a>
			</div>
			<!-- END: Logo -->
			<div class="header-right col-sm-8 col-xs-12">
			  <div class="header-right-inner">
			  </div>
			</div>
на:
<div class="header-left-text col-sm-5 col-xs-12">
			  <div class="header-left-inner">
			   <p> Текст Текст Текст <br>
				Текст Текст Текст</p>
			  </div>
			</div>
			<!-- Logo -->
			<div id="logo" class="col-sm-2 col-xs-12">
			  <a title="{SETTINGS_STORE_NAME}" href="http://{NET_DOMAIN}/">
				<img src="{ASSETS_IMAGES_PATH}logo.png" alt="{SETTINGS_STORE_NAME}">
			  </a>
			</div>
			<!-- END: Logo -->
			<div class="header-right-text col-sm-5 col-xs-12">
			  <div class="header-right-inner">
			   <p> Текст Текст Текст Текст Текст Текст</p>
			  </div>
			</div>

Затем в шаблоне main.css замените строку:
#header #logo {display: block;float: left;margin-left: 480px; margin-top: -25px;}
на:
#header #logo {display: block;float: left;margin-top: -25px;}
.header-left-text {
  text-align: right;
	color: #fff;
	font-size: 90%;
	vertical-align: middle;}
.header-right-text {
  text-align: left;
	color: #fff;
	font-size: 90%;
	vertical-align: middle;}

Замените текст на нужный. Останется добавить нужные стили к нему, выровнять так, как требуется. Укажите на скриншоте, как именно, если не получится сделать самостоятельно. А так же, надо подумать, как этот текст будет располагаться на разных разрешениях экрана.

#148 galya.bu7

galya.bu7

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

  • Пользователи
  • PipPipPipPip
  • 323 сообщений
  • ГородСмоленск

Отправлено 12 Февраль 2016 - 14:34

Просмотр сообщенияRedHead (12 Февраль 2016 - 14:13) писал:

Здравствуйте. В шаблоне html замените блок кода:
<!-- Logo -->
		 <div id="logo" class="col-sm-4 col-xs-12">
			 <a title="{SETTINGS_STORE_NAME}" href="http://{NET_DOMAIN}/">
			 <img src="{ASSETS_IMAGES_PATH}logo.png" alt="{SETTINGS_STORE_NAME}">
			 </a>
		 </div>
		 <!-- END: Logo -->
		 <div class="header-right col-sm-8 col-xs-12">
			 <div class="header-right-inner">
			 </div>
		 </div>
на:
<div class="header-left-text col-sm-5 col-xs-12">
			 <div class="header-left-inner">
			 <p> Текст Текст Текст <br>
			 Текст Текст Текст</p>
			 </div>
		 </div>
		 <!-- Logo -->
		 <div id="logo" class="col-sm-2 col-xs-12">
			 <a title="{SETTINGS_STORE_NAME}" href="http://{NET_DOMAIN}/">
			 <img src="{ASSETS_IMAGES_PATH}logo.png" alt="{SETTINGS_STORE_NAME}">
			 </a>
		 </div>
		 <!-- END: Logo -->
		 <div class="header-right-text col-sm-5 col-xs-12">
			 <div class="header-right-inner">
			 <p> Текст Текст Текст Текст Текст Текст</p>
			 </div>
		 </div>

Затем в шаблоне main.css замените строку:
#header #logo {display: block;float: left;margin-left: 480px; margin-top: -25px;}
на:
#header #logo {display: block;float: left;margin-top: -25px;}
.header-left-text {
text-align: right;
color: #fff;
font-size: 90%;
vertical-align: middle;}
.header-right-text {
text-align: left;
color: #fff;
font-size: 90%;
vertical-align: middle;}

Замените текст на нужный. Останется добавить нужные стили к нему, выровнять так, как требуется. Укажите на скриншоте, как именно, если не получится сделать самостоятельно. А так же, надо подумать, как этот текст будет располагаться на разных разрешениях экрана.
Спасибо! как сделать так, чтобы текст был читаем и одновременно с этим влезал в шапку? (сейчас не влезает)

#149 RedHead

RedHead

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

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

Отправлено 12 Февраль 2016 - 14:47

Просмотр сообщенияgalya.bu7 (12 Февраль 2016 - 14:34) писал:

Спасибо! как сделать так, чтобы текст был читаем и одновременно с этим влезал в шапку? (сейчас не влезает)

Попробуйте в main.css немного изменить строки:

.header-left-text {
  text-align: center;
		color: #fff;
		font-size: 14px;
	  
		vertical-align: middle;}
	   
.header-right-text {
  text-align: center;
		color: #fff;
		font-size: 14px;
		vertical-align: middle;}

заменить их на:

.header-left-text {
  text-align: center;
		color: #fff;
		font-size: 14px;
		margin-top: -10px;
		vertical-align: middle;}
	   
.header-right-text {
  text-align: center;
		color: #fff;
		font-size: 14px;
		margin-top: -10px;
		vertical-align: middle;}


#150 galya.bu7

galya.bu7

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

  • Пользователи
  • PipPipPipPip
  • 323 сообщений
  • ГородСмоленск

Отправлено 12 Февраль 2016 - 15:39

Просмотр сообщенияRedHead (12 Февраль 2016 - 14:47) писал:

Попробуйте в main.css немного изменить строки:

.header-left-text {
text-align: center;
	 color: #fff;
	 font-size: 14px;
	
	 vertical-align: middle;}
	
.header-right-text {
text-align: center;
	 color: #fff;
	 font-size: 14px;
	 vertical-align: middle;}

заменить их на:

.header-left-text {
text-align: center;
	 color: #fff;
	 font-size: 14px;
	 margin-top: -10px;
	 vertical-align: middle;}
	
.header-right-text {
text-align: center;
	 color: #fff;
	 font-size: 14px;
	 margin-top: -10px;
	 vertical-align: middle;}
Спасибо!!!

#151 galya.bu7

galya.bu7

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

  • Пользователи
  • PipPipPipPip
  • 323 сообщений
  • ГородСмоленск

Отправлено 12 Февраль 2016 - 18:49

Просмотр сообщенияRedHead (12 Февраль 2016 - 14:47) писал:

Попробуйте в main.css немного изменить строки:

.header-left-text {
text-align: center;
	 color: #fff;
	 font-size: 14px;
	
	 vertical-align: middle;}
	
.header-right-text {
text-align: center;
	 color: #fff;
	 font-size: 14px;
	 vertical-align: middle;}

заменить их на:

.header-left-text {
text-align: center;
	 color: #fff;
	 font-size: 14px;
	 margin-top: -10px;
	 vertical-align: middle;}
	
.header-right-text {
text-align: center;
	 color: #fff;
	 font-size: 14px;
	 margin-top: -10px;
	 vertical-align: middle;}
Подскажите,  как прописать стиль для ссылки в шапке "прайс-лист для оптовиков"

#152 RedHead

RedHead

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

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

Отправлено 12 Февраль 2016 - 19:04

Просмотр сообщенияgalya.bu7 (12 Февраль 2016 - 18:49) писал:

Подскажите,  как прописать стиль для ссылки в шапке "прайс-лист для оптовиков"

В шаблоне main.css замените строки:
.header-right-text {
  text-align: center;
		color: #fff;
		font-size: 16px;
		margin-top: -12px;
		vertical-align: middle;
	}

на:
.header-right-text a{
  text-align: center;
		color: #fff;
		font-size: 16px;
		margin-top: -12px;
		vertical-align: middle;
	}
.header-right-text a:hover{
		color:#f74444;
	}


#153 galya.bu7

galya.bu7

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

  • Пользователи
  • PipPipPipPip
  • 323 сообщений
  • ГородСмоленск

Отправлено 12 Февраль 2016 - 19:30

Просмотр сообщенияRedHead (12 Февраль 2016 - 19:04) писал:

В шаблоне main.css замените строки:
.header-right-text {
text-align: center;
	 color: #fff;
	 font-size: 16px;
	 margin-top: -12px;
	 vertical-align: middle;
}
на:
.header-right-text a{
text-align: center;
	 color: #fff;
	 font-size: 16px;
	 margin-top: -12px;
	 vertical-align: middle;
}
.header-right-text a:hover{
	 color:#f74444;
}
Спасибо!




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

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