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


Изменить Немного Шапку


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

#1 GSkom

GSkom

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

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

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

Доброе утро!
Подскажите как подправить главную страницу:
1. Убрать сверху черную полосу
2. Вверху поле Поиска, корзины, каталога и  нижние кнопки меню округлить, чтобы были не прямоугольные. А вверху поле Поиск и корзину симметрично сдвинуть немного вниз, чтобы они не под потолком были, а посредине между потолком и верхними кнопками.
3. Между логотипом и поиском вставить номера телефонов, e-mail, время работы.
Заранее спасибо.

Мой аккаунт SL-429160

В догонку:
Как поставить слайдер типа Nyvo (как у вас в Faq-e) и расположить его также

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

  • 1.jpg
  • 2.jpg


#2 RayLi

RayLi

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

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

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

Просмотр сообщенияGSkom (08 Декабрь 2017 - 09:35) писал:

Доброе утро!
Подскажите как подправить главную страницу:
1. Убрать сверху черную полосу
2. Вверху поле Поиска, корзины, каталога и  нижние кнопки меню округлить, чтобы были не прямоугольные. А вверху поле Поиск и корзину симметрично сдвинуть немного вниз, чтобы они не под потолком были, а посредине между потолком и верхними кнопками.
3. Между логотипом и поиском вставить номера телефонов, e-mail, время работы.
Заранее спасибо.

Мой аккаунт SL-429160

В догонку:
Как поставить слайдер типа Nyvo (как у вас в Faq-e) и расположить его также

Здравствуйте.
2) В шаблоне style.css найдите, пожалуйста, следующий код:

#search_block_top #search_query_top {
width: 350px;
vertical-align: middle !important;
border: 1px solid #cecece!important;
padding-right: 30px;
}

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

#search_block_top #search_query_top {
width: 350px;
vertical-align: middle !important;
border: 1px solid #cecece!important;
padding-right: 30px;
border-radius: 10px !important;
}


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

#header_shopping_cart {
position: static;
width: 170px;
float: right;
clear: both;
margin-top: 26px;
list-style: none;
background-clip: padding-box;
-moz-background-clip: padding-box;
-webkit-background-clip: padding-box;
background: #f7f7f7 url('{ASSETS_IMAGES_PATH}cart_red.png?design=autumn') no-repeat 12px;
border: 1px solid #cecece;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
}

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

#header_shopping_cart {
position: static;
width: 170px;
float: right;
clear: both;
margin-top: 26px;
list-style: none;
background-clip: padding-box;
-moz-background-clip: padding-box;
-webkit-background-clip: padding-box;
background: #f7f7f7 url('{ASSETS_IMAGES_PATH}cart_red.png?design=autumn') no-repeat 12px;
border: 1px solid #cecece;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 10px;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
}


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

#header-fluid {
position: relative;
background: #e0af87 url('{ASSETS_IMAGES_PATH}header-top-bg.png?design=autumn') repeat-x 0 0;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.25);
-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.25);
-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.25);
z-index: 10;
}

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

#header-fluid {
position: relative;
background: #e0af87;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.25);
-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.25);
-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.25);
z-index: 10;
}


#3 GSkom

GSkom

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

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

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

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

Здравствуйте.
2) В шаблоне style.css найдите, пожалуйста, следующий код:

#search_block_top #search_query_top {
width: 350px;
vertical-align: middle !important;
border: 1px solid #cecece!important;
padding-right: 30px;
}

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

#search_block_top #search_query_top {
width: 350px;
vertical-align: middle !important;
border: 1px solid #cecece!important;
padding-right: 30px;
border-radius: 10px !important;
}


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

#header_shopping_cart {
position: static;
width: 170px;
float: right;
clear: both;
margin-top: 26px;
list-style: none;
background-clip: padding-box;
-moz-background-clip: padding-box;
-webkit-background-clip: padding-box;
background: #f7f7f7 url('{ASSETS_IMAGES_PATH}cart_red.png?design=autumn') no-repeat 12px;
border: 1px solid #cecece;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
}

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

#header_shopping_cart {
position: static;
width: 170px;
float: right;
clear: both;
margin-top: 26px;
list-style: none;
background-clip: padding-box;
-moz-background-clip: padding-box;
-webkit-background-clip: padding-box;
background: #f7f7f7 url('{ASSETS_IMAGES_PATH}cart_red.png?design=autumn') no-repeat 12px;
border: 1px solid #cecece;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 10px;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
}


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

#header-fluid {
position: relative;
background: #e0af87 url('{ASSETS_IMAGES_PATH}header-top-bg.png?design=autumn') repeat-x 0 0;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.25);
-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.25);
-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.25);
z-index: 10;
}

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

#header-fluid {
position: relative;
background: #e0af87;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.25);
-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.25);
-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.25);
z-index: 10;
}

По первому блоку (строка поиска) в style.css нашел только #search_block_top #search_query_top  внутри было другое, но заменив весь блок вроде как сработало все, кроме как у каталога слева. По нему измененный код вы не прислали. Остался вопрос по установке в шапке номеров телефонов, емейла и времени работы. Также по слайдам в догонку писал.
Спасибо.

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

  • 3.jpg


#4 RayLi

RayLi

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

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

Отправлено 08 Декабрь 2017 - 12:48

Просмотр сообщенияGSkom (08 Декабрь 2017 - 12:24) писал:

По первому блоку (строка поиска) в style.css нашел только #search_block_top #search_query_top  внутри было другое, но заменив весь блок вроде как сработало все, кроме как у каталога слева. По нему измененный код вы не прислали. Остался вопрос по установке в шапке номеров телефонов, емейла и времени работы. Также по слайдам в догонку писал.
Спасибо.

В шаблоне html найдите, пожалуйста, данный код:

<div id="header-logo">
<a href="{INDEX_PAGE_URL}" title="{SETTINGS_STORE_NAME}">
<img class="logo" src="{ASSETS_IMAGES_PATH}logo.png?design=autumn" alt="{SETTINGS_STORE_NAME}. Перейти на главную" />
</a>
</div>
<div id="header-right">

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

<div id="header-logo">
<a href="{INDEX_PAGE_URL}" title="{SETTINGS_STORE_NAME}">
<img class="logo" src="{ASSETS_IMAGES_PATH}logo.png?design=autumn" alt="{SETTINGS_STORE_NAME}. Перейти на главную" />
</a>
</div>
<div class="contacts">
<div class="block-title"><h5>Наши контакты</h5></div>
<div class="block-contact">
{% IF SETTINGS_STORE_REGION %}<p><em class="fa fa-map-marker">&nbsp;</em>{SETTINGS_STORE_REGION}</p>{% ENDIF %}
{% IF SETTINGS_STORE_WORK_TIME %}<p><em class="fa fa-clock-o">&nbsp;</em>Режим работы: {SETTINGS_STORE_WORK_TIME}</p>{% ENDIF %}
{% IF SETTINGS_STORE_PHONE_NUMBER1 %}<p><em class="fa fa-phone">&nbsp;</em>Телефон: <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></p>{% ENDIF %}
{% IF SETTINGS_STORE_PHONE_NUMBER2 %}<p><em class="fa fa-phone">&nbsp;</em>Телефон: <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></p>{% ENDIF %}
{% IF SETTINGS_STORE_PHONE_NUMBER3 %}<p><em class="fa fa-fax">&nbsp;</em>Телефон: <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></p>{% ENDIF %}
{% IF SETTINGS_STORE_EMAIL_MAIN %}<p><em class="fa fa-envelope">&nbsp;</em>Email: <a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></p>{% ENDIF %}
{% IF SETTINGS_STORE_SKYPE %}<p><em class="fa fa-skype">&nbsp;</em>Skype: <a href="skype:{SETTINGS_STORE_SKYPE}?call">{SETTINGS_STORE_SKYPE}</a></p>{% ENDIF %}
</div>
</div>
<div id="header-right">


Далее в шаблоне style.css найдите, пожалуйста, данный код:


.block2 .block-title {
padding: 6px 18px;
color: #40383b;
text-transform: uppercase;
background: #fff;
border: 1px solid #5c2f02;
position: relative;
display: block;
}

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

.block2 .block-title {
padding: 6px 18px;
color: #40383b;
text-transform: uppercase;
background: #fff;
border: 1px solid #5c2f02;
position: relative;
display: block;
border-radius: 10px 10px 0px 0px;
}


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

.block2 {
margin-bottom: 20px;
background: #fff;
border-left: 1px solid #5c2f02;
border-right: 1px solid #5c2f02;
float: left;
position: relative;
width: 210px;
}

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

.block2 {
margin-bottom: 20px;
background: #fff;
float: left;
position: relative;
width: 210px;
}


И далее там же найдите, пожалуйста, данный код:

.block2 .block-content {
padding: 14px 18px;
color: #727272;
border-top: 0px;
border-bottom: 1px solid #E9E9E9;
background: #fff;
border: 1px solid #5c2f02;
position: relative;
display: block;
}

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

.block2 .block-content {
padding: 14px 18px;
color: #727272;
border-top: 0px;
border-bottom: 1px solid #E9E9E9;
background: #fff;
border: 1px solid #5c2f02;
position: relative;
border-radius: 0 0 10px 10px;
display: block;
}


#5 GSkom

GSkom

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

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

Отправлено 08 Декабрь 2017 - 13:43

Съехала поисковая строка и корзина и и теперь сливается с меню. Поднимите поиск и корзину как было перед последним изменением.
И посмотрите что получилось с углами в каталоге.

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

  • 3.jpg
  • 4.jpg


#6 RayLi

RayLi

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

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

Отправлено 08 Декабрь 2017 - 13:51

Просмотр сообщенияGSkom (08 Декабрь 2017 - 13:43) писал:

Съехала поисковая строка и корзина и и теперь сливается с меню. Поднимите поиск и корзину как было перед последним изменением.
И посмотрите что получилось с углами в каталоге.

В шаблоне html найдите, пожалуйста, данный код:

	<!-- END Сообщение для инвалидов -->

	<div class="container">   
	  <div class="column full" id="header">
   <div class="container">   
		  <div class="column full" id="header">
   <div id="header-logo">
<a href="{INDEX_PAGE_URL}" title="{SETTINGS_STORE_NAME}">
<img class="logo" src="{ASSETS_IMAGES_PATH}logo.png?design=autumn" alt="{SETTINGS_STORE_NAME}. Перейти на главную" /> 
						</a>
</div>
<div class="contacts">

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


	<!-- END Сообщение для инвалидов -->

	<div class="container">   
	  <div class="column full" id="header">
   <div id="header-logo">
<a href="{INDEX_PAGE_URL}" title="{SETTINGS_STORE_NAME}">
<img class="logo" src="{ASSETS_IMAGES_PATH}logo.png?design=autumn" alt="{SETTINGS_STORE_NAME}. Перейти на главную" /> 
						</a>
</div>
<div class="contacts">


#7 GSkom

GSkom

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

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

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

С каталогом получилось, осталось поднять поисковую строку и корзину.

#8 RayLi

RayLi

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

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

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

Просмотр сообщенияGSkom (08 Декабрь 2017 - 14:26) писал:

С каталогом получилось, осталось поднять поисковую строку и корзину.

В шаблоне style.css найдите, пожалуйста, следующий код:

#search_block_top {
	position: static;
	float: right;
	margin: 26px 10px 0 0;
}

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

#search_block_top {
	position: static;
	float: right;
	margin: 5px 10px 0 0;
}


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

#header_shopping_cart {
	position: static;
	width: 170px;
	float: right;
	clear: both;
	margin-top: 26px;
	list-style: none;
	background-clip: padding-box;
	-moz-background-clip: padding-box;
	-webkit-background-clip: padding-box;
	background: #f7f7f7 url('{ASSETS_IMAGES_PATH}cart_red.png?design=autumn') no-repeat 12px;
	border: 1px solid #cecece;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 10px;
	box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
	-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
	-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
}

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

#header_shopping_cart {
	position: static;
	width: 170px;
	float: right;
	clear: both;
	margin-top: 5px;
	list-style: none;
	background-clip: padding-box;
	-moz-background-clip: padding-box;
	-webkit-background-clip: padding-box;
	background: #f7f7f7 url('{ASSETS_IMAGES_PATH}cart_red.png?design=autumn') no-repeat 12px;
	border: 1px solid #cecece;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 10px;
	box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
	-moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
	-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.05);
}


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


.contacts {float: left;}


#9 GSkom

GSkom

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

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

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

Проблему решила одна строчка   .contacts {float: left;}
Спасибо!




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

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