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


Мелкие Изменения Стиля

Автор Andrey44, 27 февр. 2016 12:52

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

#21 Vaccina

Vaccina

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

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

Отправлено 12 Март 2016 - 09:19

Уточните пожалуйста, проблема еще актуальна?

#22 Andrey44

Andrey44

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

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

Отправлено 21 Март 2016 - 15:40

 Vaccina (12 Март 2016 - 09:19) писал:

Уточните пожалуйста, проблема еще актуальна?
Разобрались вроде.

Просьба уважаемые модераторы. всю голову сломали мы со слайдером и блоками.
Не могли бы вы вместо 2 блоков на главной странице встроить слайдер из темы Лето который во всю ширину страницы идет. и 7 страничек чтобы в нем было банеры загрузили slide1-slide7 jpg

#23 Andrey44

Andrey44

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

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

Отправлено 25 Март 2016 - 11:46

У вас праздники ?

#24 Юля123

Юля123

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

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

Отправлено 25 Март 2016 - 12:47

 Andrey44 (21 Март 2016 - 15:40) писал:

Разобрались вроде.

Просьба уважаемые модераторы. всю голову сломали мы со слайдером и блоками.
Не могли бы вы вместо 2 блоков на главной странице встроить слайдер из темы Лето который во всю ширину страницы идет. и 7 страничек чтобы в нем было банеры загрузили slide1-slide7 jpg

Здравствуйте, извините за ожидание, в шаблоне HTMl найдите код:

<!-- Слайдер на главной -->
{% IF index_page %}
<div id="slideshow">
	 <div class="preloader"><span class="content-loading"></span></div>
	 <ul class="accor">
			 <li class="accor accor-open">
				 <img src="{ASSETS_IMAGES_PATH}slide1.jpg?design=urban" alt="iPhone SE предзаказ">
				 <div class="title_accor">
					 <a href="http://{NET_DOMAIN}/catalog/Новинки" title="iPhone SE предзаказ"><strong>iPhone SE предзаказ</strong></a>
					 <p><a href="http://{NET_DOMAIN}/catalog/Новинки" title="iPhone SE предзаказ"> В наличии в первый день продаж </a></p>
			 </li>
		 </ul>
</div>
{% ENDIF %}

и замените на код:
<script>
// Can also be used with $(document).ready()
$(window).load(function() {
$('.flexslider').flexslider({
animation: "slide"
});
});
</script>
<!-- Слайдер на главной -->
{% IF index_page %}
<div class="flexslider">
<ul class="slides">
<li>
<img src="{ASSETS_IMAGES_PATH}slide1.jpg?design=urban" alt="iPhone SE предзаказ"/>
</li>
<li>
<img src="slide2.jpg" />
</li>
<li>
<img src="slide3.jpg" />
</li>
<li>
<img src="slide4.jpg" />
</li>

<li>
<img src="slide5.jpg" />
</li>

<li>
<img src="slide6.jpg" />
</li>

<li>
<img src="slide7.jpg" />
</li>
</ul>
</div>
{% ENDIF %}
Ссылки изменяйте на нужные изображения .
Далее добавьте на сайт в редакторе шаблонов файлы из архива:
Прикрепленный файл  слайдер (2).zip   9,99К   145 Количество загрузок:


далее в шаблоне HTMl перед кодом:

</head>

добавьте код:

<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.flexslider-min.js"></script>
<link rel="stylesheet" href="{ASSETS_STYLES_PATH}flexslider.css" type="text/css" />

#25 Andrey44

Andrey44

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

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

Отправлено 26 Март 2016 - 16:19

 Юля123 (25 Март 2016 - 12:47) писал:

Здравствуйте, извините за ожидание, в шаблоне HTMl найдите код:

<!-- Слайдер на главной -->
{% IF index_page %}
<div id="slideshow">
	 <div class="preloader"><span class="content-loading"></span></div>
	 <ul class="accor">
			 <li class="accor accor-open">
				 <img src="{ASSETS_IMAGES_PATH}slide1.jpg?design=urban" alt="iPhone SE предзаказ">
				 <div class="title_accor">
					 <a href="http://{NET_DOMAIN}/catalog/Новинки" title="iPhone SE предзаказ"><strong>iPhone SE предзаказ</strong></a>
					 <p><a href="http://{NET_DOMAIN}/catalog/Новинки" title="iPhone SE предзаказ"> В наличии в первый день продаж </a></p>
			 </li>
		 </ul>
</div>
{% ENDIF %}

и замените на код:
<script>
// Can also be used with $(document).ready()
$(window).load(function() {
$('.flexslider').flexslider({
animation: "slide"
});
});
</script>
<!-- Слайдер на главной -->
{% IF index_page %}
<div class="flexslider">
<ul class="slides">
<li>
<img src="{ASSETS_IMAGES_PATH}slide1.jpg?design=urban" alt="iPhone SE предзаказ"/>
</li>
<li>
<img src="slide2.jpg" />
</li>
<li>
<img src="slide3.jpg" />
</li>
<li>
<img src="slide4.jpg" />
</li>

<li>
<img src="slide5.jpg" />
</li>

<li>
<img src="slide6.jpg" />
</li>

<li>
<img src="slide7.jpg" />
</li>
</ul>
</div>
{% ENDIF %}
Ссылки изменяйте на нужные изображения .
Далее добавьте на сайт в редакторе шаблонов файлы из архива:
слайдер (2).zip


далее в шаблоне HTMl перед кодом:

</head>

добавьте код:

<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.flexslider-min.js"></script>
<link rel="stylesheet" href="{ASSETS_STYLES_PATH}flexslider.css" type="text/css" />
внесли изменения и на сайте ошибка пожалуйста перепроверьте нас

#26 RedHead

RedHead

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

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

Отправлено 26 Март 2016 - 16:25

 Andrey44 (26 Март 2016 - 16:19) писал:

внесли изменения и на сайте ошибка пожалуйста перепроверьте нас

Здравствуйте. В шаблоне html найдите строки:

<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.flexslider-min.js"></script>
<link rel="stylesheet" href="{ASSETS_STYLES_PATH}flexslider.css" type="text/css" />

переместите их, вставив перед строкой:

</head>

#27 Andrey44

Andrey44

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

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

Отправлено 26 Март 2016 - 16:58

 RedHead (26 Март 2016 - 16:25) писал:

Здравствуйте. В шаблоне html найдите строки:

<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.flexslider-min.js"></script>
<link rel="stylesheet" href="{ASSETS_STYLES_PATH}flexslider.css" type="text/css" />

переместите их, вставив перед строкой:

</head>
все загрузил слайдер отображается жутко не правильно проверьте пожалуйста

#28 RedHead

RedHead

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

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

Отправлено 26 Март 2016 - 17:22

 Andrey44 (26 Март 2016 - 16:58) писал:

все загрузил слайдер отображается жутко не правильно проверьте пожалуйста

Сам слайдер работает корректно, нужно только правильно прописать  путь к изображениям. В шаблоне html замените блок кода:

<ul class="slides">
<li>
<img src="{ASSETS_IMAGES_PATH}slide1.jpg?design=urban" alt="iPhone SE предзаказ"/>
</li>
<li>
<img src="slide1.jpg" />
</li>
<li>
<img src="slide2.jpg" />
</li>
<li>
<img src="slide3.jpg" />
</li>
<li>
<img src="slide4.jpg" />
</li>
<li>
<img src="slide5.jpg" />
</li>
<li>
<img src="slide6.jpg" />
</li>
<li>
<img src="slide7.jpg" />
</li>
</ul>

на:

<ul class="slides">
<li>
<img src="{ASSETS_IMAGES_PATH}slide1.jpg" alt="iPhone SE предзаказ"/>
</li>
<li>
<img src="{ASSETS_IMAGES_PATH}slide2.jpg" />
</li>
<li>
<img src="{ASSETS_IMAGES_PATH}slide3.jpg" />
</li>
<li>
<img src="{ASSETS_IMAGES_PATH}slide4.jpg" />
</li>
<li>
<img src="{ASSETS_IMAGES_PATH}slide5.jpg" />
</li>
<li>
<img src="{ASSETS_IMAGES_PATH}slide6.jpg" />
</li>
<li>
<img src="{ASSETS_IMAGES_PATH}slide7.jpg" />
</li>
</ul>

#29 GudBay

GudBay

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

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

Отправлено 07 Апрель 2016 - 19:56

Добрый день! Шаблон Спорт. В Opera в меню вместо букв квадраты. Только у меня так?

#30 RedHead

RedHead

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

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

Отправлено 07 Апрель 2016 - 20:12

 GudBay (07 Апрель 2016 - 19:56) писал:

Добрый день! Шаблон Спорт. В Opera в меню вместо букв квадраты. Только у меня так?

Здравствуйте. Сайт открывается корректно. Данная ошибка возникает , скорее всего, по той причине, что версия Вашего браузера устарела и не поддерживает данный шрифт. Советуем обновить версию браузера.

1.jpg

#31 GudBay

GudBay

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

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

Отправлено 10 Апрель 2016 - 22:22

RedHead, спасибо за ответ!

Шрифт верхнего меню на вашем скрине отличается от шрифта в других браузерах. Это можно исправить?

#32 Юля123

Юля123

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

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

Отправлено 11 Апрель 2016 - 10:46

 GudBay (10 Апрель 2016 - 22:22) писал:

RedHead, спасибо за ответ!

Шрифт верхнего меню на вашем скрине отличается от шрифта в других браузерах. Это можно исправить?

Здравствуйте, отображение шрифтов Вам поправили.

#33 GudBay

GudBay

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

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

Отправлено 11 Апрель 2016 - 23:03

Спасибо! А где я могу самостоятельно поменять шрифт верхнего меню, бокового и шрифт описания категории и товаров (кроме кода в самом описании)?

#34 Vaccina

Vaccina

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

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

Отправлено 12 Апрель 2016 - 01:15

Боковое меню, в main.css найдите:
.block-menu-content ul > li {
	border-bottom: 1px solid #e5e5e5;
	background: #f8f8f8;
}

в нем пропишите необходимый шрифт, например:
.block-menu-content ul > li {
	border-bottom: 1px solid #e5e5e5;
	background: #f8f8f8;
	font-family: Arial;
}

Верхнее меню, в main.css найдите следующий блок и добавьте в него необходимый шрифт:
#custommenu ul.menunav li {
	display: inline-block;
	float: left;
	border: none;
}

Описание категорий и товаров, в main.css найдите:
.htmlDataBlock {
	margin: 10px 0 20px;
}

после него вставьте:
.htmlDataBlock, .htmlDataBlock p, .htmlDataBlock span {
	font-family: Arial;
}

и измените значение стиля font-family на необходимый

#35 GudBay

GudBay

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

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

Отправлено 15 Апрель 2016 - 20:28

Спасибо за ответ!
1) Не подcкажете почему не видно разницы между text-rendering: optimizelegibility и auto? Можно ли применить это только к шрифтам больше 20px?
2) Где можно добавить обводку пунктов (кнопок) верхнего меню и поиграться с типом и толщиной.
3) Где живет толщина линий левого меню.
4) Где изменить отображение маркированного списка меню в футере. Хочу посмотреть как будет смотреться с точками и без.


#36 Vaccina

Vaccina

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

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

Отправлено 16 Апрель 2016 - 03:33

1. Возможно, вас заинтересует следующая статья по данному вопросу:
http://y3x.ru/2011/0...text-rendering/
Указывать его необходимо в main.css.
2. В main.css найдите:
#custommenu ul.menunav li > a {
	display: block;
	padding: 10px 15px;
	color: #1b1b1b;
	line-height: 30px;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 700;
	position: relative;
	border-bottom: 2px solid transparent;
}
3. В main.css найдите:
.block-menu-content > ul {
	border: 1px solid #333744;
	border-bottom: 7px solid #333744;
	border-top: 0;
}
4. В main.css найдите:
#footer-middle .footer-content ul li {
	list-style: initial;
	color: #09afe7;
}

замените на:
#footer-middle .footer-content ul li {
	list-style: none;
	color: #09afe7;
}

#37 GudBay

GudBay

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

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

Отправлено 18 Апрель 2016 - 14:08

Благодарю!

Как сделать чтобы картинки товаров в каталоге при отображении таблицей вписывались в границы блока без отступов?
При масштабировании экрана то вверху/внизу появляются пробелы (отступы) то по бокам. Нашел что если
В коде:
.products-grid .item .item-inner .item-img > a {z-index: 1;display: table-cell;vertical-align: middle;height: 260px;width: 268px;}

убрать значение vertical-align то картинки товаров вписываются в рамку без отступов. Также изменение значений height и width тоже что-то дают. Как лучше поступить?

Тоже самое и для отображения списком.

#38 Юля123

Юля123

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

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

Отправлено 18 Апрель 2016 - 14:29

 GudBay (18 Апрель 2016 - 14:08) писал:

Благодарю!

Как сделать чтобы картинки товаров в каталоге при отображении таблицей вписывались в границы блока без отступов?
При масштабировании экрана то вверху/внизу появляются пробелы (отступы) то по бокам. Нашел что если
В коде:
.products-grid .item .item-inner .item-img > a {z-index: 1;display: table-cell;vertical-align: middle;height: 260px;width: 268px;}

убрать значение vertical-align то картинки товаров вписываются в рамку без отступов. Также изменение значений height и width тоже что-то дают. Как лучше поступить?

Тоже самое и для отображения списком.


Здравствуйте, попробуйте в main.css найти код:

.products-grid .item .item-inner .item-img > a {z-index: 1;display: table-cell;vertical-align: middle;height: 260px;width: 268px;}
.products-grid .item .item-inner .item-img > a.product-image img {max-width: 100%;height: auto !impotant;padding: none;}

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

.products-grid .item .item-inner .item-img > a {z-index: 1;display: table-cell;vertical-align: middle;height: 100%;width: 100%;}
.products-grid .item .item-inner .item-img > a.product-image img {max-width: 100%;height: auto;padding: 0;}

далее код:

#39 GudBay

GudBay

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

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

Отправлено 19 Апрель 2016 - 00:28

Спасибо за ответ!

Результат получился хороший, но окошки товаров в которых изображения по высоте меньше остальных, становятся также меньше. Можно ли сделать так чтобы изображение автоматически растянулось по высоте и ширине, сохранив пропорции, и обрезалось по бокам?

Или лучше уж все картинки привести к единому формату.

#40 Vaccina

Vaccina

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

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

Отправлено 19 Апрель 2016 - 05:43

Попробуйте следующий вариант, в main.css найдите:
.products-grid .item .item-inner .item-img > a.product-image img {
	max-width: 100%;
	height: auto;
	padding: 0;
}

замените на:
.products-grid .item .item-inner .item-img > a.product-image img {
	max-height: 100%;
	width: auto;
	padding: 0;
	height: 250px;
}

Обратно в Изменение общей стилистики


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

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

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