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


Доработки

Автор Stas_Y, 17 сент. 2015 02:39

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

#1 Stas_Y

Stas_Y

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

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

Отправлено 17 Сентябрь 2015 - 02:39

Подскажите как:
1) Изменять размер строки?
2) Изменять размер шрифта?
3) Изменять размер шрифта в футере?
4) Изенять цвет шрифта и футера?
5) Прикрутить выпадающее меню из http://forum.storela...енения-в-шапке/ сообщение №=#15 к данной строке
РИС В ПРИЛОЖЕНИИ

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

  • 11.jpg

#2 Vaccina

Vaccina

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

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

Отправлено 17 Сентябрь 2015 - 04:28

1. В main.css найдите:
#content {
	position: relative;
	top: 165px;
}
уменьшите значение стиля top
2. В main.css найдите:
.header-top .header-top-left .top-navbar-links li a {
	padding: 18px 18px 12px;
	display: block;
	font-size: 115%;
}
уменьшите значение стиля font-size

3. В main.css найдите:
h3 {
	font-size: 30px;
}

уменьшите значение стиля font-size

4.За цвет заголовков отвечает стиль color в блоке:
.spotlight-wrap .block-title {
	line-height: 100%;
	text-transform: capitalize;
	font-weight: 300;
	color: #FFF;
}
за цвет ссылок в подвале:
.footer-content a {
	color: #C8C8C8;
	font-size: 120%;
}

за цвет фона подвала  background-color в блоке:
.footer-content {
	padding-top: 20px;
	background-color: #444;
	color: #C8C8C8;
	position: fixed;
	bottom: 0px;
	width: 100%;
	z-index: 99;
	height: 70px;
	overflow: hidden;
	transition: all 1s linear 0s;
}

5. Вам необходимо  шаблоне HTML блок:
<ul class="top-navbar-links">
																				  {% 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>

привести к виду:
<ul class="top-navbar-links">
																				   <li><a href="#">Каталог</a>
																				  {%FOR catalog_full%}
																				{% IF catalog_full.FIRST %}<ul class="accordion">{% ENDIF %}
																				<li {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %} class="{% IF catalog_full.ISSET_SUB %}parent{% ENDIF %}{% IF catalog_full.CURRENT %} active{% ELSEIF catalog_full.CURRENT_PARENT %} active{% ENDIF %}">
																				  <a href="{catalog_full.URL}"{% IF catalog_full.CURRENT %}class="selected"{% ENDIF %}>{catalog_full.NAME}</a>
																				{% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %}
																				{% IF catalog_full.LAST %}{%FOR out%}</ul>{%IFNOT catalog_full.out.LAST%}</li>{%ENDIF%}{%ENDFOR%}{% ENDIF %}
																  {%ENDFOR%}
																  </li>
																				  {% 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>

в этом случае будет и каталог и старое меню, остальное дальше по инструкции =)

#3 Stas_Y

Stas_Y

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

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

Отправлено 17 Сентябрь 2015 - 07:39

Как убрать оранжевую анимация с корзины?

#4 Vaccina

Vaccina

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

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

Отправлено 17 Сентябрь 2015 - 07:46

В main.css найдите и удалите:
.header-top .mini-cartpro .block-title:hover {background-color: rgba(247,146,66,.7);}

#5 Stas_Y

Stas_Y

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

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

Отправлено 17 Сентябрь 2015 - 09:26

Спасибо!) И анимацию с поиска))

#6 Alekseys

Alekseys

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

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

Отправлено 17 Сентябрь 2015 - 12:57

Просмотр сообщенияStas_Y (17 Сентябрь 2015 - 09:26) писал:

Спасибо!) И анимацию с поиска))
Здравствуйте. В main.css замените
.header-top .header-top-right #search_mini_form .form-search {opacity: 0;filter: alpha(opacity = 0);visibility: hidden;position: absolute;top: 0;right: 0;height: 50px;z-index: 1;}
на
.header-top .header-top-right #search_mini_form .form-search {opacity: 1;filter: alpha(opacity = 0);visibility: visible;position: absolute;top: 0;right: -201px;height: 50px;z-index: 1;}
и
.header-top .header-top-right #search_mini_form .form-search #search {position: absolute;top: 0;right: 52px;float: right;height: 50px;border: 7px solid transparent;border-color: #f79242;width: 50px;font-size: 100%;}
замените на
.header-top .header-top-right #search_mini_form .form-search #search {position: absolute;top: 0;right: 52px;float: right;height: 50px;border: 7px solid transparent;border-color: #f79242;width: 200px;font-size: 100%;}

#7 Stas_Y

Stas_Y

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

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

Отправлено 18 Сентябрь 2015 - 04:14

Здравствуйте! Требуется сделать верхнее меню аналогичным выпадающим http://www.pullandbear.com/ru/ru/

#8 Stas_Y

Stas_Y

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

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

Отправлено 18 Сентябрь 2015 - 04:24

Уменьшить высоту строки футера

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

  • p1_40924180545140.JPG

#9 Vaccina

Vaccina

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

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

Отправлено 18 Сентябрь 2015 - 04:26

Ранее не раз подымался вопрос о выпадающем меню и имеется несколько инструкций по его реализации, ознакомиться с ними вы можете по следующим ссылкам:
http://forum.storela..._20#entry209081
http://forum.storela..._40#entry209647
http://forum.storela...ке/#entry210148

Просмотр сообщенияStas_Y (18 Сентябрь 2015 - 04:24) писал:

Уменьшить высоту строки футера

В main.css найдите:
.footer-content {
	padding-top: 5px;
	background-color: #444;
	color: #C8C8C8;
	position: fixed;
	bottom: 0px;
	width: 100%;
	z-index: 99;
	height: 65px;
	overflow: hidden;
	transition: all 0.5s linear 0s;
}

уменьшите значение стиля height

#10 Stas_Y

Stas_Y

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

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

Отправлено 18 Сентябрь 2015 - 04:42

Требуется:
1) Корзину в правый угол
2) Посредине "Вход" с иконкой "LK" (иконка загружена)
3) Замыкает тройку поиск

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

  • p1_40924180545140.JPG

#11 Vaccina

Vaccina

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

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

Отправлено 18 Сентябрь 2015 - 05:16

В шаблоне HTML  найдите:
<form id="search_mini_form" action="http://{NET_DOMAIN}/search" method="get">
				  <div class="form-search">
					<input id="search" type="text" name="q" value="" class="search-string" placeholder="Поиск по магазину...">
					<button type="submit" title="Искать" class="button search-submit"></button>
				  </div>
				</form>
перед ним вставьте:
<!-- ЛК -->
				<div class="block lk">
				  <div class="block-title">
					  <a href="{USER_LOGIN_URL}">Вход</a>
				  </div></div>

далее в main.css найдите:
.header-top .header-top-right .links, .header-top .header-top-right #search_mini_form, .header-top .header-top-right .mini-cartpro.sm-cartpro {float: left;list-style: none;}

после него пропишите:
.header-top .header-top-right #search_mini_form, .header-top .header-top-right .mini-cartpro.sm-cartpro, .header-top .header-top-right .lk {float: right;}
.header-top .header-top-right .lk {background-image: url('{ASSETS_IMAGES_PATH}icon.png') no-repeat 15px 12px #f79242;padding: 18px 18px 12px 50px;color: #fff;height: 50px;margin-left: 1px;}

в добавленном коде icon.png замените на имя файла вашей иконки, сама иконка должна быть загружена  в раздел Редактор шаблонов.

#12 Stas_Y

Stas_Y

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

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

Отправлено 18 Сентябрь 2015 - 05:24

Что-то пошло не так)

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

  • p1_40924180545140.JPG

#13 Vaccina

Vaccina

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

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

Отправлено 18 Сентябрь 2015 - 05:29

Сейчас будет все так =)
В шаблоне main.css найдите:
.header-top .header-top-right .lk {background-image: url('{ASSETS_IMAGES_PATH}LK.png') no-repeat 15px 12px #f79242;padding: 18px 18px 12px 50px;color: #fff;height: 50px;margin-left: 1px;}
замените на:
.header-top .header-top-right .lk {background: url('{ASSETS_IMAGES_PATH}LK.png') no-repeat 15px 12px #f79242;padding: 18px 18px 12px 50px;color: #fff;height: 50px;margin-left: 1px;}

В шаблоне HTML найдите:
<!-- Основное меню -->
						 <div class="header-top-left col-lg-9 col-md-9 col-sm-6 col-xs-12">
						 <!-- Логотип -->
						 <div class="logo col-lg-3 col-md-2 col-xs-12">
							 <a title="{SETTINGS_STORE_NAME}" href="http://{NET_DOMAIN}/">					
								 <img alt="{SETTINGS_STORE_NAME}" src="{ASSETS_IMAGES_PATH}logo.png?design=orange">															
							 </a>
						 </div>
			 <div class="top-navbar">
				 <button type="button" class="button-navbar two btn-top-navbar" data-toggle="collapse" data-target=".top-navbar .navbar-collapse">
				 <span class="text">Меню</span>
				 </button>
				 <div class="navbar-collapse collapse">
				 <ul class="top-navbar-links">
																																								 {% 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>
				 </div>
			 </div>
			 </div>
			 <!-- Корзина и Поиск -->
			 <div class="header-top-right col-lg-3 col-md-3 col-sm-6 col-xs-12">

замените на:
<!-- Основное меню -->
						 <div class="header-top-left col-lg-8 col-md-9 col-sm-6 col-xs-12">
						 <!-- Логотип -->
						 <div class="logo col-lg-3 col-md-2 col-xs-12">
							 <a title="{SETTINGS_STORE_NAME}" href="http://{NET_DOMAIN}/">					
								 <img alt="{SETTINGS_STORE_NAME}" src="{ASSETS_IMAGES_PATH}logo.png?design=orange">															
							 </a>
						 </div>
			 <div class="top-navbar">
				 <button type="button" class="button-navbar two btn-top-navbar" data-toggle="collapse" data-target=".top-navbar .navbar-collapse">
				 <span class="text">Меню</span>
				 </button>
				 <div class="navbar-collapse collapse">
				 <ul class="top-navbar-links">
																																								 {% 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>
				 </div>
			 </div>
			 </div>
			 <!-- Корзина и Поиск -->
			 <div class="header-top-right col-lg-4 col-md-3 col-sm-6 col-xs-12">

А иконку для входа используйте маленькую, так как она у вас не поместится.

#14 Stas_Y

Stas_Y

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

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

Отправлено 18 Сентябрь 2015 - 05:37

А какой размер нужен?)

Сдвинуть: корзину, поиск и вход в правый угол

#15 Vaccina

Vaccina

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

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

Отправлено 18 Сентябрь 2015 - 05:42

У корзины иконка 30 х 25px.
В main.css найдите:
.container {
	width: 1170px;
}
после него пропишите:
#header .container {
	width: 100%;
}

#16 Stas_Y

Stas_Y

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

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

Отправлено 18 Сентябрь 2015 - 05:44

Просмотр сообщенияVaccina (18 Сентябрь 2015 - 05:42) писал:

У корзины иконка 30 х 25px.
В main.css найдите:
.container {
width: 1170px;
}
после него пропишите:
#header .container {
width: 100%;
}
Не могу такую строку найти((

#17 Stas_Y

Stas_Y

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

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

Отправлено 18 Сентябрь 2015 - 05:54

Почему не входят все названия категорий в верхнем меню??((( Помогите исправить

#18 Vaccina

Vaccina

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

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

Отправлено 18 Сентябрь 2015 - 06:02

Просмотр сообщенияStas_Y (18 Сентябрь 2015 - 05:44) писал:

Не могу такую строку найти((

952 строка:
.container{width:1170px}

Просмотр сообщенияStas_Y (18 Сентябрь 2015 - 05:54) писал:

Почему не входят все названия категорий в верхнем меню??((( Помогите исправить

В main.css найдите:
.header-top .header-top-left .top-navbar-links {
	float: left;
	list-style: outside none none;
	overflow: hidden;
	height: 50px;
	padding-left: 115px;
}
замените на:
.header-top .header-top-left .top-navbar-links {
	float: left;
	list-style: outside none none;
	overflow: hidden;
	height: 50px;
	padding-left: 0;
}

далее найдите:
.header-top .header-top-left .top-navbar-links li a {
	position: relative;
	text-transform: uppercase;
	padding: 18px 15px 12px;
	font-weight: 700;
	display: block;
	font-size: 100%;
	transition: all 1s linear 0s;
}

замените на:
.header-top .header-top-left .top-navbar-links li a {
	position: relative;
	text-transform: uppercase;
	padding: 18px 10px 12px;
	font-weight: 700;
	display: block;
	font-size: 100%;
	transition: all 1s linear 0s;
}

#19 Stas_Y

Stas_Y

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

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

Отправлено 18 Сентябрь 2015 - 06:10

Спасибо)

#20 Stas_Y

Stas_Y

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

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

Отправлено 18 Сентябрь 2015 - 07:27

Рядом с иконкой "поиск", написать слово поиск
Обратно в Изменение общей стилистики


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

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

  1. Форум владельцев интернет-магазинов
  2. → Вопросы работы сервиса StoreLand
  3. → Дизайн
  4. → Шаблон Цитрус
  5. → Изменение общей стилистики
  6. Privacy Policy