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


Изменения Главной Страницы


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

#1 VID61

VID61

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

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

Отправлено 10 Декабрь 2014 - 14:49

Добрый день.
Есть несколько вопросов по изменению главной страницы.
1. Как поменять цвет поиска?
2. Как поменять цвет категорий товаров и выровнять эти категории по центру.
3. Выровнять по центру Верхнее меню
4. Максимально сузить

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

  • Безымянный.png


#2 RayLi

RayLi

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

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

Отправлено 10 Декабрь 2014 - 15:14

Просмотр сообщенияVID61 (10 Декабрь 2014 - 14:49) писал:

Добрый день.
Есть несколько вопросов по изменению главной страницы.
1. Как поменять цвет поиска?
2. Как поменять цвет категорий товаров и выровнять эти категории по центру.
3. Выровнять по центру Верхнее меню
4. Максимально сузить
Здравствуйте.
Все изменения производим в шаблоне main.css :
1. Найдите код:
input[type='search'] {
position: relative;
right: -36px;
border: 1px solid #ebebeb;
box-shadow: 0 2px 1px #f0f0f0;
line-height: 16px;
}
И замените его этим кодом:
input[type='search'] {
position: relative;
right: -36px;
border: 1px solid #ebebeb;
box-shadow: 0 2px 1px #f0f0f0;
line-height: 16px;
background: #008FCD;
}
Ищем следующий код:
.searchBtn.btn {
position: relative;
z-index: 10;
left: -2px;
width: 32px;
height: 26px;
cursor: pointer;
background: url('http://design.5pokupok.ru/sprites2.png?design=snow') no-repeat 4px -94px;
background-color: white;
border: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
И заменяем его:
.searchBtn.btn {
position: relative;
z-index: 10;
left: -2px;
width: 32px;
height: 26px;
cursor: pointer;
background: url('http://design.5pokupok.ru/sprites2.png?design=snow') no-repeat 4px -94px;
/* background-color: white; */
border: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
2. Ищем код:
.navSelect.nav {
width: 100%;
}
И заменяем его вот этим:
.navSelect.nav {
width: 100%;
margin-left: 400px;
}
Находим такой код:
.menuResp a {
color: #666;
display: inline-block;
font-size: 14px;
line-height: 1.1em;
padding: 10px 10px;
text-align: left;
text-decoration: none;
white-space: nowrap;
}
И заменяем его:
.menuResp a {
color: #0E509B;
display: inline-block;
font-size: 14px;
line-height: 1.1em;
padding: 10px 10px;
text-align: left;
text-decoration: none;
white-space: nowrap;
}
3. Находим следующий код:
ul.head, nav.footer-menu ul {
display: inline-block;
float: left;
margin: 0;
padding: 0;
list-style: none outside none;
}
И заменяем его этим кодом:
ul.head, nav.footer-menu ul {
display: inline-block;
float: left;
margin: 0;
padding: 0;
list-style: none outside none;
margin-left: 150px;
}
4. Ищем ещё код:
.body-content-top {
left: 0;
width: 100%;
height: 98px;
margin-top: -1px;
border: 0;
border-bottom: 1px solid #dbdbdb;
background: #f7f7f7;
margin-bottom: 15px;
}
И заменяем его:
.body-content-top {
left: 0;
width: 100%;
height: 62px;
margin-top: -1px;
border: 0;
border-bottom: 1px solid #dbdbdb;
background: #f7f7f7;
margin-bottom: 15px;
}
Найдите вот такой код:
.body-content-top-center {
padding: 1.5em .6em 0 .6em;
padding-top: 1.5em;
}
И замените его:
.body-content-top-center {
padding: 1.5em .6em 0 .6em;
padding-top: 0.5em;
}


#3 VID61

VID61

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

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

Отправлено 10 Декабрь 2014 - 15:54

Просмотр сообщенияRayLi (10 Декабрь 2014 - 15:14) писал:

Здравствуйте.
Все изменения производим в шаблоне main.css :
1. Найдите код:
input[type='search'] {
position: relative;
right: -36px;
border: 1px solid #ebebeb;
box-shadow: 0 2px 1px #f0f0f0;
line-height: 16px;
}
И замените его этим кодом:
input[type='search'] {
position: relative;
right: -36px;
border: 1px solid #ebebeb;
box-shadow: 0 2px 1px #f0f0f0;
line-height: 16px;
background: #008FCD;
}
Ищем следующий код:
.searchBtn.btn {
position: relative;
z-index: 10;
left: -2px;
width: 32px;
height: 26px;
cursor: pointer;
background: url('http://design.5pokupok.ru/sprites2.png?design=snow') no-repeat 4px -94px;
background-color: white;
border: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
И заменяем его:
.searchBtn.btn {
position: relative;
z-index: 10;
left: -2px;
width: 32px;
height: 26px;
cursor: pointer;
background: url('http://design.5pokupok.ru/sprites2.png?design=snow') no-repeat 4px -94px;
/* background-color: white; */
border: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
2. Ищем код:
.navSelect.nav {
width: 100%;
}
И заменяем его вот этим:
.navSelect.nav {
width: 100%;
margin-left: 400px;
}
Находим такой код:
.menuResp a {
color: #666;
display: inline-block;
font-size: 14px;
line-height: 1.1em;
padding: 10px 10px;
text-align: left;
text-decoration: none;
white-space: nowrap;
}
И заменяем его:
.menuResp a {
color: #0E509B;
display: inline-block;
font-size: 14px;
line-height: 1.1em;
padding: 10px 10px;
text-align: left;
text-decoration: none;
white-space: nowrap;
}
3. Находим следующий код:
ul.head, nav.footer-menu ul {
display: inline-block;
float: left;
margin: 0;
padding: 0;
list-style: none outside none;
}
И заменяем его этим кодом:
ul.head, nav.footer-menu ul {
display: inline-block;
float: left;
margin: 0;
padding: 0;
list-style: none outside none;
margin-left: 150px;
}
4. Ищем ещё код:
.body-content-top {
left: 0;
width: 100%;
height: 98px;
margin-top: -1px;
border: 0;
border-bottom: 1px solid #dbdbdb;
background: #f7f7f7;
margin-bottom: 15px;
}
И заменяем его:
.body-content-top {
left: 0;
width: 100%;
height: 62px;
margin-top: -1px;
border: 0;
border-bottom: 1px solid #dbdbdb;
background: #f7f7f7;
margin-bottom: 15px;
}
Найдите вот такой код:
.body-content-top-center {
padding: 1.5em .6em 0 .6em;
padding-top: 1.5em;
}
И замените его:
.body-content-top-center {
padding: 1.5em .6em 0 .6em;
padding-top: 0.5em;
}


По второму и третьему вопросу, не правильное решение.
т.к. при добавлении категорий товара и пунктов в главное меню, все съезжает в право, а не выравнивается по центру.

#4 RayLi

RayLi

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

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

Отправлено 10 Декабрь 2014 - 16:18

Просмотр сообщенияVID61 (10 Декабрь 2014 - 15:54) писал:

По второму и третьему вопросу, не правильное решение.
т.к. при добавлении категорий товара и пунктов в главное меню, все съезжает в право, а не выравнивается по центру.
Пришлите, пожалуйста, скриншоты того, о чём вы говорите.

#5 VID61

VID61

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

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

Отправлено 10 Декабрь 2014 - 16:25

Добавил в каталог 2 категории тест, все съехало в право, а не отцентровалось.
В главном меню не стал производить изменения т,к. то что вы предложили не то что нужно.
Необходимо, чтоб при добавлении категорий в каталог и разделов меню, все центровалось.

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

  • Безымянный.png


#6 RayLi

RayLi

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

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

Отправлено 10 Декабрь 2014 - 16:33

Просмотр сообщенияVID61 (10 Декабрь 2014 - 16:25) писал:

Добавил в каталог 2 категории тест, все съехало в право, а не отцентровалось.
В главном меню не стал производить изменения т,к. то что вы предложили не то что нужно.
Необходимо, чтоб при добавлении категорий в каталог и разделов меню, все центровалось.
Попробуйте сделать следующее:
Найдите в том же шаблоне, main.css , код:
ul.head, nav.footer-menu ul {
display: inline-block;
float: left;
margin: 0;
padding: 0;
list-style: none outside none;
}
И замените его вот этим кодом:
ul.head, nav.footer-menu ul {
display: inline-block;
float: left;
margin: 0;
padding: 0;
list-style: none outside none;
margin-left: 14%;
}
Теперь найдите этот код:
.navSelect.nav {
width: 100%;
margin-left: 400px;
}
И замените его:
.navSelect.nav {
width: 100%;
margin-left: 34%;
}


#7 VID61

VID61

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

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

Отправлено 11 Декабрь 2014 - 10:06

Нет, не помогло.
Нужна срочно помощь специалиста, который точно знает как это сделать.

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

  • Безымянный.png


#8 Alekseys

Alekseys

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

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

Отправлено 11 Декабрь 2014 - 10:40

Просмотр сообщенияVID61 (11 Декабрь 2014 - 10:06) писал:

Нет, не помогло.
Нужна срочно помощь специалиста, который точно знает как это сделать.
Здравствуйте. Точно по центру поставить меню не выйдет, поскольку этому препятствует корзина. Максимум, что можно сделать, добавить в main.css
ul.navSelect.menuResp.nav {
width: 590px;
margin: auto;
}


#9 VID61

VID61

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

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

Отправлено 11 Декабрь 2014 - 10:54

Просмотр сообщенияAlekseys (11 Декабрь 2014 - 10:40) писал:

Здравствуйте. Точно по центру поставить меню не выйдет, поскольку этому препятствует корзина. Максимум, что можно сделать, добавить в main.css
ul.navSelect.menuResp.nav {
width: 590px;
margin: auto;
}

А можно реализовать такое
1 Уменьшить шрифт названия страниц
2 Перенести адресную строку влево
3 Поднять корзину в главное меню
4 И теперь чтоб каталог ровнялся по центру

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

  • Безымянный.png


#10 Alekseys

Alekseys

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

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

Отправлено 11 Декабрь 2014 - 11:19

Просмотр сообщенияVID61 (11 Декабрь 2014 - 10:54) писал:

А можно реализовать такое
1 Уменьшить шрифт названия страниц
2 Перенести адресную строку влево
3 Поднять корзину в главное меню
4 И теперь чтоб каталог ровнялся по центру
Уточните пожалуйста номер аккаунта.

#11 VID61

VID61

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

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

Отправлено 11 Декабрь 2014 - 12:34

Просмотр сообщенияAlekseys (11 Декабрь 2014 - 11:19) писал:

Уточните пожалуйста номер аккаунта.
Аккаунт SL-309038

#12 Alekseys

Alekseys

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

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

Отправлено 11 Декабрь 2014 - 13:01

Просмотр сообщенияVID61 (11 Декабрь 2014 - 12:34) писал:

Аккаунт SL-309038
1. В main.css замените
.body-content-top-center h1 {
font-size: 2em;
font-weight: normal;
margin-top: 0;
color: #444;
}
на
.body-content-top-center h1 {
font-size: 26px;
font-weight: normal;
margin-top: 0;
color: #444;
}
2. В main.css замените
.body-top-right {
line-height: 3.5;
float: right;
}
на
.body-top-right {
line-height: 3.5;
float: left;
margin-left: 20px;
}
3. В шаблоне HTML перенесите
Скрытый текст
поставив этот блок после
<div class="header-container">
				<div class="header-inner">
					<!-- Блок навигации -->
					{% IFNOT menu_empty %}
						<nav class="head">
							<ul class="head">
								{% FOR menu %}
									{% FOR header %}
										{% FOR links %}
											<li>
												<a href="{menu.header.links.URL}"  {% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a>
											</li>
										{% ENDFOR %}
									{% ENDFOR %}
								{% ENDFOR %}
							</ul>
							<a href="#" class="pull">Меню</a><!-- Появляется только при маленьких разрешениях экрана -->
4. В main.css замените
.sectionblock-container {
display: inline-block;
float: left;
width: 88%;
}
на
.sectionblock-container {
display: inline-block;
float: left;
width: 100%;
}
и добавьте
.navSelect.menuResp.nav {
width: 420px;
margin: auto;
}
параметром width: 420px; отредактируйте ширину меню так, чтоб все пункты располагались в одну строку, не больше.

#13 VID61

VID61

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

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

Отправлено 11 Декабрь 2014 - 14:37

Спасибо, но это не помогло.
Перешел на другой шаблон.




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

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