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


Изменение Стилистики

Автор Viatalliyy, 04 дек. 2014 13:26

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

#1 Viatalliyy

Viatalliyy

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

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

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

Здравствуйте!
У меня сразу несколько вопросов
1. Как поставить картинку на фон сайта шаблон "Весна"
2. Изменить цвет иконок и шапки и всего остального

#2 Alekseys

Alekseys

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

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

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

Просмотр сообщенияViatalliyy (04 Декабрь 2014 - 13:26) писал:

Здравствуйте!
У меня сразу несколько вопросов
1. Как поставить картинку на фон сайта шаблон "Весна"
2. Изменить цвет иконок и шапки и всего остального
Здравствуйте.
1. Пожалуйста, уточните пожалуйста, Вы хотите сделать картинкой общий фон сайта?
2. Пожалуйста перечислите более подробно, цвет чего Вы желаете изменить.

#3 Viatalliyy

Viatalliyy

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

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

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

1. Хочу вот сделать такой фон как на этом сайте http://www.iswagshop.com/
2. Изображение Изображение

#4 Ирина345

Ирина345

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

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

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

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

1. Хочу вот сделать такой фон как на этом сайте http://www.iswagshop.com/
2. Изображение Изображение
Здравствуйте, найдите в main.css код
поменять цвет фона
body{line-height:1;color:black;background:white}
замените на
body{line-height:1;color:black;background:url('ссылка на картинку');}
поменять цвет шапки
найдите
#header_colapse {position:relative;background-color:#ff0551;color:#ffffff;z-index: 1000;}
замените на
#header_colapse {position:relative;background-color:#123456;color:#ffffff;z-index: 1000;}
меняете значение background-color:#123456


поменять цвет надписи
добавьте в конец файла main.css
.prod_hold .prod-info-fly .name a:hover {
color: #1B5612;
}
можно изменить цвет изменив значение color: #1B5612;

#5 Viatalliyy

Viatalliyy

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

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

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

Спасибо большое. Но вот только не везде цвет поменялся. Как вот тут ещё изменить цвета? ИзображениеИзображениеИзображение
Изображение

#6 Ирина345

Ирина345

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

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

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

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

Спасибо большое. Но вот только не везде цвет поменялся. Как вот тут ещё изменить цвета?

Найдите в main.css
a:hover {
text-decoration: underline;
color: #ff0551;
}
заменяете значение color: #ff0551

#7 Alekseys

Alekseys

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

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

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

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

Спасибо большое. Но вот только не везде цвет поменялся. Как вот тут ещё изменить цвета? ИзображениеИзображениеИзображение
Изображение
Здравствуйте. Цвет можно изменить в разделе main.css
a:hover {
text-decoration: underline;
color: #ff0551;
}

#8 Viatalliyy

Viatalliyy

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

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

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

не находит....

#9 Alekseys

Alekseys

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

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

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

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

не находит....
Редактор шаблонов -> main.css 7-я строка.

#10 Viatalliyy

Viatalliyy

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

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

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

Спасибо большое. Как можно уменьшить размер слайда и сделать его размерами 965х400

#11 Alekseys

Alekseys

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

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

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

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

Спасибо большое. Как можно уменьшить размер слайда и сделать его размерами 965х400
В main.css в блоке
@media only screen and (min-width: 990px)
удалите
#header  .flexslider li img.slide_img{display:none !important;}
затем в конец main.css добавьте
#header .flexslider li .bigPic {
display: none !important;
}
и замените
.flexslider .slides img {
width: 100%;
display: block;
}
на
.flexslider .slides img {
width: 965px;
height:400px;
display: block;
}

#12 Viatalliyy

Viatalliyy

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

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

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

Где это нужно менять?

вот это
.flexslider .slides img {
width: 100%;
display: block;
}
на это
.flexslider .slides img {
width: 965px;
height:400px;
display: block;
}

#13 Alekseys

Alekseys

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

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

Отправлено 04 Декабрь 2014 - 17:24

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

Где это нужно менять?

вот это
.flexslider .slides img {
width: 100%;
display: block;
}
на это
.flexslider .slides img {
width: 965px;
height:400px;
display: block;
}
В main.css.

#14 Viatalliyy

Viatalliyy

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

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

Отправлено 04 Декабрь 2014 - 17:30

вот что получилось Изображение

#15 Ирина345

Ирина345

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

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

Отправлено 04 Декабрь 2014 - 17:41

Просмотр сообщенияViatalliyy (04 Декабрь 2014 - 17:30) писал:

вот что получилось
отмените инструкцию из сообщения #12
найдите в main.css
#module_area {
width: 100%;
text-align: center;
padding: 5px 0;
}
замените на

#module_area {
width: 72%;
text-align: center;
padding: 5px 0;
margin:0 auto;
}


чем меньше процент тем уже слайдер

#16 Viatalliyy

Viatalliyy

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

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

Отправлено 04 Декабрь 2014 - 17:55

Извините что надоедаю
1.Нужно немного расширить слайд
2.поднять каталог
Изображение

#17 Viatalliyy

Viatalliyy

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

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

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

Просмотр сообщенияИрина345 (04 Декабрь 2014 - 17:41) писал:

отмените инструкцию из сообщения #12
найдите в main.css
#module_area {
width: 100%;
text-align: center;
padding: 5px 0;
}
замените на

#module_area {
width: 72%;
text-align: center;
padding: 5px 0;
margin:0 auto;
}


чем меньше процент тем уже слайдер
???

#18 Ирина345

Ирина345

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

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

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

Просмотр сообщенияViatalliyy (04 Декабрь 2014 - 18:33) писал:

???
найдите в html код
 <!-- Главная страница -->
		{% IF index_page %}
		  <div id="module_area"> 
			<div id="flexslideshow" class="flexslider">
			  <ul class="slides">
				<li>
				  <div class="bigPic" style="width: 1920px; height: 550px; background:url({ASSETS_IMAGES_PATH}slide1.png) no-repeat;"></div>
				  <img src="{ASSETS_IMAGES_PATH}slide1.png" alt="Slide 1" class="slide_img">
				</li>
				<li>
				  <div class="bigPic" style="width: 1920px; height: 550px; background:url({ASSETS_IMAGES_PATH}slide2.png) no-repeat;"></div>
				  <img src="{ASSETS_IMAGES_PATH}slide2.png" alt="Slide 2" class="slide_img">
				</li>
				<li>
				  <div class="bigPic" style="width: 1920px; height: 550px; background:url({ASSETS_IMAGES_PATH}slide3.png) no-repeat;"></div>
				  <img src="{ASSETS_IMAGES_PATH}slide3.png" alt="Slide 3" class="slide_img">
				</li> 
				<li>
				  <div class="bigPic" style="width: 1920px; height: 550px; background:url({ASSETS_IMAGES_PATH}slide4.jpg) no-repeat"></div>
				  <img src="{ASSETS_IMAGES_PATH}slide4.jpg" alt="Slide 4" class="slide_img">
				</li>
				</ul>
			</div>
		  </div>
		{% ENDIF %}
		<!-- /Главная страница -->
переместите код после строки
 <div id="content">


далее найдите в main.css

#header  .flexslider li .bigPic {display:none !important;position:relative;top:0;margin: 0 auto;top: 0;left: 50%;margin-left: -960px;}
замените на 

.flexslider li .bigPic {display:none !important;position:relative;top:0;margin: 0 auto;top: 0;left: 50%;margin-left: -960px;}

предварительно создайте бекап.

#19 Viatalliyy

Viatalliyy

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

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

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

[Имя цитатой = метка "Ирина345 '=' 1417708170 'после =' 176917 ']
найдите в HTML код
[CODE]
<! - Главная страница ->
{%, если index_page%}
<DIV ID = "module_area">
<DIV ID = класс "flexslideshow" = "FlexSlider">
<UL класс = "слайды">
<LI>
<DIV класс = стиль "bigPic" = "ширина: 1920px; высота: 550px; фон: URL ({ASSETS_IMAGES_PATH} slide1.png) не повторять; "> </ DIV>
<IMG SRC = "{ASSETS_IMAGES_PATH} slide1.png" Alt = "Slide 1" класс = "slide_img">
</ LI>
<LI>
<DIV класс = "стиль bigPic" = "ширина: 1920px ; высота: 550px; фон: URL ({ASSETS_IMAGES_PATH} slide2.png) не повторять; "> </ DIV>
<IMG SRC = "{ASSETS_IMAGES_PATH} slide2.png" Alt = класс "Слайд 2" = "slide_img">
</ LI>
<LI >
<DIV класс = стиль "bigPic" = "ширина: 1920px; высота: 550px; фон: URL ({ASSETS_IMAGES_PATH} slide3.png) не повторять; "> </ DIV>
<IMG SRC = "{ASSETS_IMAGES_PATH} slide3.png" Alt = "Слайд 3" класс = "slide_img">
</ LI>
<LI >
<DIV класс = стиль "bigPic" = "ширина: 1920px; высота: 550px; фон: URL ({ASSETS_IMAGES_PATH} slide4.jpg) не повторять "> </ DIV>
<IMG SRC = "{ASSETS_IMAGES_PATH} slide4.jpg" Alt = "Слайд 4" CLASS = "slide_img">
</ LI>
</ UL >
</ DIV>
</ DIV>
{% ENDIF%}
<! - / Главная страница -> [/ CODE]
переместите код после строки
[CODE] <DIV ID = "содержание"> [/ CODE] далее найдите в главном. CSS [CODE] #header .flexslider Ли .bigPic {дисплей: нет Важная; положение: относительная; сверху: 0; маржа: 0 авто; сверху: 0; слева: 50%; Левое поле: -960px;} [/ CODE] замените на [CODE] .flexslider Ли .bigPic {дисплей: нет Важная; положение: относительная; сверху: 0; маржа: 0 авто; сверху: 0; слева: 50%; Левое поле: -960px;} [/ CODE]. предварительно создайте бекап [/ цитата]

Так вроде ничего и не изменилось














Изображение

#20 Viatalliyy

Viatalliyy

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

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

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

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


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

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

  1. Форум владельцев интернет-магазинов
  2. → Повышение продаж, продвижение
  3. → Общие вопросы
  4. Privacy Policy