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


Редактирование Главной Страницы

цвет шрифт расположение

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

#1 Любава

Любава

    Новичок

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

Отправлено 22 Август 2018 - 10:35

Здравствуйте, помогите, пожалуйста, в корректировке шаблона сайта(шоколад):
1. Где поиск изменить цвет фона на цвет - голубой
2. Там же увеличить размер шрифта, примерно в 2 раза.
3. поле где логотип, изменить цвет фона на цвет как на моем логотипе фон  детки конфетки
4. в этом же поле где логотип, удалить справа корзину.
5. Меню съехало вниз, нужно сделать его правее от логотипа
6. В меню изменить кнопку "Доставка" на " Доставка и оплата"
7. Удалить кнопки в меню "Корзина", "Войти в ЛК"
8. увеличить шрифт меню в 2 раза и стиль шрифта такой же как в самом вверху сайта, где поиск.
9. при наведении на все кнопки на странице, цвет меняется на голубой как из п.1
10. фон где каталог товаров, сделать цветом из п.1
11. фон где детская одежда оптом изменить на цвет из п.1 и полоски к ним прилигающие

В файле указала изменения...

СПАСИБО ОГРОМНОЕ!!! :)

Просмотр сообщенияЛюбава (22 Август 2018 - 10:34) писал:

Здравствуйте, помогите, пожалуйста, в корректировке шаблона сайта(шоколад):
1. Где поиск изменить цвет фона на цвет - голубой
2. Там же увеличить размер шрифта, примерно в 2 раза.
3. поле где логотип, изменить цвет фона на цвет как на моем логотипе фон  детки конфетки
4. в этом же поле где логотип, удалить справа корзину.
5. Меню съехало вниз, нужно сделать его правее от логотипа
6. В меню изменить кнопку "Доставка" на " Доставка и оплата"
7. Удалить кнопки в меню "Корзина", "Войти в ЛК"
8. увеличить шрифт меню в 2 раза и стиль шрифта такой же как в самом вверху сайта, где поиск.
9. при наведении на все кнопки на странице, цвет меняется на голубой как из п.1
10. фон где каталог товаров, сделать цветом из п.1
11. фон где детская одежда оптом изменить на цвет из п.1 и полоски к ним прилигающие

В файле указала изменения...

СПАСИБО ОГРОМНОЕ!!! :)


Аккаунт SL-456972

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

  • шоколад.jpg


#2 Vaccina

Vaccina

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

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

Отправлено 23 Август 2018 - 08:30

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.header{
background:#866E5F;color:white;
min-height:45px;
width: 100%;
position: fixed;
z-index: 100;
}

замените на:
.header{
background:#d7ebff;color:white;
min-height:45px;
width: 100%;
position: fixed;
z-index: 100;
}

далее найдите:
.hmenu{
list-style:none;
font-size:12px;
}

замените на:
.hmenu{
list-style:none;
font-size:14px;
}

далее найдите:
#cart{
text-align: center;
font-size: 16px;
text-transform: uppercase;
border: 1px solid #ddd;
width: 240px;
float: right;
transition: all 0.35s ease;
-webkit-transition: all 0.35s ease;
-moz-transition: all 0.35s ease;
-o-transition: all 0.35s ease;
-ms-transition: all 0.35s ease;
box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-user-select: none;
}

замените на:
#cart{
text-align: center;
font-size: 16px;
text-transform: uppercase;
border: 1px solid #ddd;
width: 240px;
float: right;
transition: all 0.35s ease;
-webkit-transition: all 0.35s ease;
-moz-transition: all 0.35s ease;
-o-transition: all 0.35s ease;
-ms-transition: all 0.35s ease;
box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-user-select: none;
display: none;
}

далее найдите:
.logo{float:left;height:80px;width:800px;}
.logo img{height: 150%; width: auto;}
}

замените на:
.logo{float:left;height:120px;width:415px;}
.logo img{height: 100%; width: auto;}

далее найдите:
.mainmenu .menu{display:block;width: 700px;overflow:hidden;padding:20px 5px 0 5px;float:left;}

замените на:
.mainmenu .menu{display:block;width: calc(100% - 425px);overflow:hidden;padding:20px 5px 0 5px;float:right;}

далее найдите:
.catButton{
text-align: center;
padding: 12px;
background: #DF747A;
font-size: 30px;
color: white;
font-weight: bold;
cursor:pointer;
box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

замените на:
.catButton{
text-align: center;
padding: 12px;
background: #d7ebff;
font-size: 30px;
color: white;
font-weight: bold;
cursor:pointer;
box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

далее найдите:
.indexPageHeader span:after,.page_title span:after{
content: '';
position: absolute;
left:-10px;
width: auto;
transform: skew(-20deg);
background: #DF747A;
z-index: -1;
height: 100%;
width:100%;
padding: 5px 18px 5px 5px;
top: -5px;
box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
transform: skew(-20deg);
-moz-transform: skew(-20deg);
-webkit-transform: skew(-20deg);
}

замените на:
.indexPageHeader span:after,.page_title span:after{
content: '';
position: absolute;
left:-10px;
width: auto;
transform: skew(-20deg);
background: #d7ebff;
z-index: -1;
height: 100%;
width:100%;
padding: 5px 18px 5px 5px;
top: -5px;
box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
transform: skew(-20deg);
-moz-transform: skew(-20deg);
-webkit-transform: skew(-20deg);
}

далее найдите:
.menuwrp{background:#685A4B;
min-height: 100px;
padding:60px 0 10px 0;
}

замените на:
.menuwrp{background:#d7ebff;
min-height: 100px;
padding:60px 0 10px 0;
}

зайдите в раздел Сайт - Меню - Верхнее меню - удалите\добавьте необходимые пункты меню.

#3 Любава

Любава

    Новичок

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

Отправлено 23 Август 2018 - 09:30

СПАСИБО! Но, к сожалению по цвету не то получилось исправить, а по шрифту нет изменений, я еще раз на файле указала, где и какой цвет, напишите, пжл, если я пишу не понятно.....Спасибо.

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

  • сайт.jpg


#4 metry

metry

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

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

Отправлено 23 Август 2018 - 10:04

Добрый день. Для внесения изменений зайдите в Редактор шаблонов-->main.css и найдите:
.header{
background:#d7ebff;color:white;
min-height:45px;
width: 100%;
position: fixed;
z-index: 100;
}
- в найденном коде для background  задайте свой код цвета. Код цвета можно подобрать здесь.

далее найдите:
.menuwrp{background:#d7ebff;
min-height: 100px;
padding:60px 0 10px 0;
}
- в найденном коде для background  задайте свой код цвета.

далее найдите:
.catButton{
text-align: center;
padding: 12px;
background: #d7ebff;
font-size: 30px;
color: white;
font-weight: bold;
cursor:pointer;
box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
-в найденном коде для background  задайте свой код цвета.

далее найдите:
.indexPageHeader span:after,.page_title span:after{
content: '';
position: absolute;
left:-10px;
width: auto;
transform: skew(-20deg);
background: #d7ebff;
z-index: -1;
height: 100%;
width:100%;
padding: 5px 18px 5px 5px;
top: -5px;
box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
transform: skew(-20deg);
-moz-transform: skew(-20deg);
-webkit-transform: skew(-20deg);
}

-в найденном коде для background  задайте свой код цвета.

далее найдите:
.mainmenu ul li a.selected{color:#DF747A;}
-в найденном коде для color задайте свой код цвета.

далее найдите:
.mainmenu ul li a{padding:10px;z-index: 500;font-weight:bold;color:white;position:relative;}

замените на:
.mainmenu ul li a{padding:10px;z-index: 500;font-weight:bold;color:white;position:relative;font-size:22px}


#5 Любава

Любава

    Новичок

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

Отправлено 23 Август 2018 - 11:18

Все круто получается, осталось совсем чуть-чуть)))

в файле еще не большие изменения внести....

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

  • сайт футер.jpg


#6 stasia

stasia

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

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

Отправлено 23 Август 2018 - 11:49

Просмотр сообщенияЛюбава (23 Август 2018 - 11:18) писал:

Все круто получается, осталось совсем чуть-чуть)))

в файле еще не большие изменения внести....



Зайдите в шаблон main.css и найдите код:


.hmenu li a:hover {
color: #DF747A;
}

И удалите его.


Найдите код:


.footerHeader:after{content: '';
position: absolute;
left: -10px;
width: auto;
transform: skew(-20deg);
background: #DF747A;
z-index: -1;
height: 100%;
width: 100%;
padding: 5px 18px 5px 5px;
top: -5px;
box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
-webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
transform: skew(-20deg);
-moz-transform: skew(-20deg);
-webkit-transform: skew(-20deg);
transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-webkit-transition: 0.3s ease-in-out;
}

Задайте в свойстве background нужный Вам цвет.

Найдите код:


.footer.first {
background: #C9C4B4;
border-bottom: 4px solid #BBB89A;
}

В свойстве background укажите нужный Вам цвет.

И в этом коде:


.footer.second {
background: #685A4B;
}

Замените по аналогии в свойстве background на нужный Вам.

#7 Любава

Любава

    Новичок

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

Отправлено 23 Август 2018 - 12:37

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

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

  • сайт  корзина.jpg
  • сайт доставка.jpg
  • сайт каталог.jpg
  • сайт регтистрация.jpg
  • сайт связь.jpg


#8 stasia

stasia

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

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

Отправлено 23 Август 2018 - 13:29

Просмотр сообщенияЛюбава (23 Август 2018 - 12:37) писал:

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


1.В шаблоне main.css найдите код:

.Error a {
	color: #DF747A;
}

И в color замените Ваш цвет.



2.Найдите данный код:


.leftH, .recentH {
	position: relative;
	cursor: pointer;
	color: white;
	background: #685A4B;
	padding: 12px;
	font-size: 24px;
	text-transform: uppercase;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}


Задайте в background нужный Вам цвет.



3.Найдите:



.toggleArrow {
	width: 20px;
	height: 20px;
	background: #DF747A;
	transform: rotateZ(45deg);
	transition: all 0.35s ease;
	-webkit-transition: all 0.35s ease;
	-moz-transition: all 0.35s ease;
	-o-transition: all 0.35s ease;
}[font=Consolas, "Lucida Console", "Courier New", monospace][size=3]

[/size][/font]



В background измените цвет.



4.Найдите этот код:



li.active > a {
	color: #DF747A;
}


Замените в color цвет на Ваш.



5.Далее найдите:



.lCont a {
	color: #685A4B;
	transition: all 0.35s ease;
	-webkit-transition: all 0.35s ease;
	-moz-transition: all 0.35s ease;
	-o-transition: all 0.35s ease;
	-ms-transition: all 0.35s ease;
}


В найденном коде color задайте Ваш цвет.



6.Найдите в этом шаблоне код:


.breadcrumb a {
	color: #685A4B;
	transition: color 0.35s ease;
	-moz-transition: color 0.35s ease;
	-o-transition: color 0.35s ease;
	-webkit-transition: color 0.35s ease;
	-ms-transition: color 0.35s ease;
}


И замените в color цвет на Ваш.



7.Найдите:



.breadcrumb {
	overflow: hidden;
	background: white;
	padding: 17px;
	margin: 0 0 20px 0;
	text-transform: uppercase;
	color: #DF747A;
	font-weight: bold;
	box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
	-moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
	-webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2);
}


Замените в color цвет на Ваш.


8.Найдите код:


.nameWrp {
	cursor: pointer;
	padding: 10px 25px;
	height: 52px;
	background: #866E5F;
	transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	overflow: hidden;
}


Поменяйте в background на Ваш цвет.



9.Найдите данный код:



.cat_prod_hold:hover .name a {
color:#DF747A;
}



В color замените цвет.


10.Найдите:



.right button, .right .button {
	background: #DF747A;
	color: white;
	border: none;
	width: 240px;
	height: 45px;
	cursor: pointer;
	transform: skew(-20deg);
	-moz-transform: skew(-20deg);
	-webkit-transform: skew(-20deg);
	transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-webkit-transition: 0.3s ease-in-out;
	display: block;
	margin: 10px 10px;
	text-align: center;
	padding-top: 10px;
	font-weight: normal;
}


И в background замените цвет на Ваш.



11.Найдите код:



.right button:hover, .right .button:hover {
	/* background: #866E5F; */
} 


И удалите его.



12.Найдите:


.right button:hover, .right .button:hover {
	background: #866E5F;
}

И удалите.



13.И найдите данный код:



.right button, .right .button {
	background: #da444c;
	color: white;
	border: none;
	width: 240px;
	height: 45px;
	cursor: pointer;
	transform: skew(-20deg);
	-moz-transform: skew(-20deg);
	-webkit-transform: skew(-20deg);
	transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-webkit-transition: 0.3s ease-in-out;
	display: block;
	margin: 10px 10px;
	text-align: center;
	padding-top: 10px;
	font-weight: normal;
}


И в background замените цвет на Ваш.





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

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

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