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


Как Поменять Фон В Шаблоне Техника?


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

#21 support 2.0

support 2.0

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

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

Отправлено 22 Сентябрь 2013 - 17:56

Просмотр сообщенияAndrew S. (21 Сентябрь 2013 - 19:15) писал:

СПАСИБО!!!!!!!!!!!!!!!!!!!! :rolleyes: :rolleyes: :rolleyes: :rolleyes: :rolleyes: Подскажите еще как довести до ума:

1. Логотип почему-то сильно смещается вниз и отступ слева совсем маленький. Можно его увеличить? Или это из-за добавленной тени уменьшение произошло? Как лучше увеличить отступ? А то совсем маленький...
Прикрепленный файл Verh.png

2. Как внизу левого блока сделать такой же отступ как вверху. Чтобы все края во всех режимах были оторваны. И тут также виден очень уменьшенный после проведенной сайтогической операции отступ.
Прикрепленный файл Niz.png

3. Почему-то смещен вниз (не помню, был ли он вровень с левым) правый блок. Как его на один уровень поставить?
Прикрепленный файл Verh2.png

Смотрел сейчас старые фото. Да, очень сильно почему-то левый край ушел в никуда :(

4. Как ещё уменьшить отступ после "Магазин ..."? До горизонтальной линии. Чересчур большой..
1. в main.css измените строчку
#main > .span4 {margin: 21px -px 0 3px;}
на
#main > .span4 {margin: 21px -16px 0 3px;padding-left: 13px;}

далее в файле bootstrap.min.css измените блок
.thumbnail{
	display:block;margin:0px;line-height:20px;border:0px solid #ddd;/* -webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;
   -webkit-box-shadow:0 1px 3px rgba(0,0,0,0.055);-moz-box-shadow:0 1px 3px rgba(0,0,0,0.055);box-shadow:0 1px 3px rgba(0,0,0,0.055);
	-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out*/}
  a.thumbnail:hover{border-color:#08c;/*-webkit-box-shadow:0 1px 4px rgba(0,105,214,0.25);-moz-box-shadow:0 1px 4px rgba(0,105,214,0.25);box-shadow:0 1px 4px rgba(0,105,214,0.25)*/}

на
  .thumbnail{
	display:block;margin:0px;line-height:20px;border:0px solid #ddd;/* -webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;
   -webkit-box-shadow:0 1px 3px rgba(0,0,0,0.055);-moz-box-shadow:0 1px 3px rgba(0,0,0,0.055);box-shadow:0 1px 3px rgba(0,0,0,0.055);
	-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out*/
	margin-top: -20px;
}

в шаблоне HTML найдите
<div class="row std">
замените на
<div class="row std"  {% IF index_page_new_goods.MAX_REST_VALUE=0 ||   index_page_favorites_goods.MAX_REST_VALUE=0 ||  index_page_goods.MAX_REST_VALUE=0 %} style="display: none;" {% ENDIF %}>
если не сработает, замените на
<div class="row std"  {% IF index_page_new_goods.MAX_REST_VALUE>0 ||   index_page_favorites_goods.MAX_REST_VALUE>0 ||  index_page_goods.MAX_REST_VALUE>0 %} style="display: none;" {% ENDIF %}>

4. в шаблоне Страница найдите
<div class="page-title">
	  <h2>{PAGE_NAME}</h2>
	</div>
замените на
<div class="page-title"  {% IF index_page %} style="padding: 0 0 0px !important; margin-bottom: -10px;" {% ENDIF %}>
	  <h2>{PAGE_NAME}</h2>
	</div>


#22 Andrew S.

Andrew S.

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

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 22 Сентябрь 2013 - 19:04

Просмотр сообщенияsupport 2.0 (22 Сентябрь 2013 - 17:56) писал:

1. в main.css измените строчку
#main > .span4 {margin: 21px -px 0 3px;}
на
#main > .span4 {margin: 21px -16px 0 3px;padding-left: 13px;}

далее в файле bootstrap.min.css измените блок
.thumbnail{
display:block;margin:0px;line-height:20px;border:0px solid #ddd;/* -webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;
-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.055);-moz-box-shadow:0 1px 3px rgba(0,0,0,0.055);box-shadow:0 1px 3px rgba(0,0,0,0.055);
-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out*/}
a.thumbnail:hover{border-color:#08c;/*-webkit-box-shadow:0 1px 4px rgba(0,105,214,0.25);-moz-box-shadow:0 1px 4px rgba(0,105,214,0.25);box-shadow:0 1px 4px rgba(0,105,214,0.25)*/}

на
.thumbnail{
display:block;margin:0px;line-height:20px;border:0px solid #ddd;/* -webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;
-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.055);-moz-box-shadow:0 1px 3px rgba(0,0,0,0.055);box-shadow:0 1px 3px rgba(0,0,0,0.055);
-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out*/
margin-top: -20px;
}

в шаблоне HTML найдите
<div class="row std">
замените на
<div class="row std" {% IF index_page_new_goods.MAX_REST_VALUE=0 || index_page_favorites_goods.MAX_REST_VALUE=0 || index_page_goods.MAX_REST_VALUE=0 %} style="display: none;" {% ENDIF %}>
если не сработает, замените на
<div class="row std" {% IF index_page_new_goods.MAX_REST_VALUE>0 || index_page_favorites_goods.MAX_REST_VALUE>0 || index_page_goods.MAX_REST_VALUE>0 %} style="display: none;" {% ENDIF %}>

4. в шаблоне Страница найдите
<div class="page-title">
	 <h2>{PAGE_NAME}</h2>
</div>
замените на
<div class="page-title" {% IF index_page %} style="padding: 0 0 0px !important; margin-bottom: -10px;" {% ENDIF %}>
	 <h2>{PAGE_NAME}</h2>
</div>

Получается.

1. Увидел лаг при отображении в хроме на 110% и 175%, что это может быть такое? Этого быть ведь не должно:


2. Там же на изображении видно, что уменьшился отступ между левым и правыми блоками. Как вернуть прежнее расстояние?

3. Проблема по-хуже. До этого было всё по центру. А сейчас всё смещено:

Строчка (раздел) "Фонари в гнездо прикуривателя" стоит впритык к правой части. Надеюсь всё будет не в ущерб расстоянию, которого итак мало. Не уменьшайте место внутри.

4. Не появился отступ внизу:


5. Как добавить +2 пункта в верхнее меню с логотипами. Такими же, изменяющимися при наведении. В том же порядке, какое видно на добавленном изображении:

Страница "Услуги" у меня: ...uslugi
Страница "Оплата" есть в нижнем меню. Создаю для симметрии к создаваемой "Услуги". Без нее никак, т.к. буду выкладывать прайс-листы на услуги. В товарах такое не выложить.

6. Зарегистрировался в личном кабинете и увидел, что нет значков в спокойном состоянии и в активном для пункта "мой кабинет" в верхнем меню. Это как-то можно добавить? Скриншот:


7. Как блок "Вы смотрели" выставить по середине? Чтобы эти 9 фото были отцентрированы.

Сообщение отредактировал Andrew S.: 23 Сентябрь 2013 - 06:17


#23 Koderhan

Koderhan

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

  • Модератоpы
  • 6 227 сообщений

Отправлено 23 Сентябрь 2013 - 11:48

1. 2
Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Найти код:
.product-box{padding:14px 14px 14px 14px; background:#FFF;/*height:280px;*/}
Заменить:
.product-box{padding: 7% 6% 6% 6%; background:#FFF;/*height:280px;*/}
3

Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:
@media screen and (max-width: 760px) {
.span4.footer .span44 {
margin-left: -7px;
}
}
4 Можно добавить отступ следующим образом.

Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:
.span4.footer .span44 .copy {
padding-bottom: 1em;
}

5. Пункты меню вы можете перемещать в разделе Сайт -> Меню.
ScreenShot 796.png

И для добавления картинок.

Панель администратора, "Сайт"->"Редактор тем".
В файле "HTML".
Найти код:
class="{% IF menu.header.links.NAME=Каталог %}catalog{% ELSEIF menu.header.links.NAME=Каталог товаров %}catalog{% ELSEIF menu.header.links.NAME=Акции %}present{% ELSEIF menu.header.links.NAME=Акции магазина %}present{% ELSEIF menu.header.links.NAME=Доставка %}clock{% ELSEIF menu.header.links.NAME=Контакты %}address{% ELSEIF menu.header.links.NAME=Связь с администрацией %}address{% ELSEIF menu.header.links.NAME=Л.Кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Личный кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Выход %}key{% ELSEIF menu.header.links.NAME=Вход в бэк-офис %}key{% ELSEIF menu.header.links.NAME=Войти в ЛК %}key{% ELSEIF menu.header.links.NAME=Вход в личный кабинет %}key{% ELSEIF menu.header.links.NAME=Мои заказы %}tick{% ELSEIF menu.header.links.NAME=История заказов %}tick{% ELSEIF menu.header.links.NAME=Новинки %}label{% ELSEIF menu.header.links.NAME=Хиты %}heart{% ELSEIF menu.header.links.NAME=Хиты продаж %}heart{% ELSEIF menu.header.links.NAME=Статьи %}clipboard{% ELSEIF menu.header.links.NAME=Корзина %}cart{% ELSEIF menu.header.links.NAME=Главная %}home{% ELSEIF menu.header.links.NAME=Лента новостей %}document{% ELSEIF menu.header.links.NAME=Новости магазина %}document{% ELSEIF menu.header.links.NAME=Каталог статей %}document{% ELSEIF menu.header.links.NAME=Новости СМИ %}document{% ELSEIF menu.header.links.NAME=Регистрация %}user{% ELSEIF menu.header.links.NAME=Восстановление пароля %}user{% ENDIF %}{% IF menu.header.links.SELECTED %}-act selected{% ENDIF %}">{menu.header.links.NAME}</a>
Заменить:
class="{% IF menu.header.links.NAME=Каталог %}catalog{% ELSEIF menu.header.links.NAME=Каталог товаров %}catalog{% ELSEIF menu.header.links.NAME=Акции %}present{% ELSEIF menu.header.links.NAME=Акции магазина %}present{% ELSEIF menu.header.links.NAME=Доставка %}clock{% ELSEIF menu.header.links.NAME=Контакты %}address{% ELSEIF menu.header.links.NAME=Связь с администрацией %}address{% ELSEIF menu.header.links.NAME=Л.Кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Личный кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Выход %}key{% ELSEIF menu.header.links.NAME=Вход в бэк-офис %}key{% ELSEIF menu.header.links.NAME=Войти в ЛК %}key{% ELSEIF menu.header.links.NAME=Вход в личный кабинет %}key{% ELSEIF menu.header.links.NAME=Мои заказы %}tick{% ELSEIF menu.header.links.NAME=История заказов %}tick{% ELSEIF menu.header.links.NAME=Новинки %}label{% ELSEIF menu.header.links.NAME=Хиты %}heart{% ELSEIF menu.header.links.NAME=Хиты продаж %}heart{% ELSEIF menu.header.links.NAME=Статьи %}clipboard{% ELSEIF menu.header.links.NAME=Корзина %}cart{% ELSEIF menu.header.links.NAME=Главная %}home{% ELSEIF menu.header.links.NAME=Лента новостей %}document{% ELSEIF menu.header.links.NAME=Новости магазина %}document{% ELSEIF menu.header.links.NAME=Каталог статей %}document{% ELSEIF menu.header.links.NAME=Новости СМИ %}document{% ELSEIF menu.header.links.NAME=Регистрация %}user{% ELSEIF menu.header.links.NAME=Восстановление пароля %}user{% ELSEIF menu.header.links.NAME=Оплата %} oplata {% ELSEIF menu.header.links.NAME=Услуги %} uslugi {% ENDIF %}{% IF menu.header.links.SELECTED %}-act selected{% ENDIF %}">{menu.header.links.NAME}</a>
И добавить стили с сылками на иконки.
В файле "main.css".
Добавить в конец файла код:

.header .links li a.oplata {background:url("адрес иконки") left center no-repeat;}
.header .links li a.uslugi {background:url("адрес иконки") left center no-repeat;}


6. Для добавления значка на против "Мой кабинет" .

Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:
 
.header .links li a.-act.selected {background:url("адрес иконки") left center no-repeat;}
7.
В файле "HTML".
Найти код:
 <!-- Последние товары, просмотренные пользователем -->
			  {% IFNOT recently_viewed_goods_empty %}
				<div class="menu_main">
				  <a href="#" class="link_nav" title="Вы смотрели">Вы смотрели</a>
				  <a href="#" title="Вы смотрели" style="text-decoration: none"><h4 class="hidden-phone">Вы смотрели</h4></a>
				  <ul>
					<li>
					  {% FOR recently_viewed_goods %}
						<div class="goods-image-icon-square" style="padding: 0.8em 5px 0.8em 0;vertical-align:middle;text-align:center;display: inline-block;">
						  <a href="{recently_viewed_goods.URL}" title="Перейти на страницу &laquo;{recently_viewed_goods.NAME}&raquo;" style="text-align: center;"><img style="margin: auto;" src="{% IF recently_viewed_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-icon.png{% ELSE %}{recently_viewed_goods.IMAGE_ICON}{% ENDIF %}" alt="{recently_viewed_goods.NAME}" /></a>
						</div>
					  {% ENDFOR %}
					</li>
				  </ul>
				</div>
			  {% ENDIF %}
			  <!-- END Последние товары, просмотренные пользователем -->
Заменить:
 <!-- Последние товары, просмотренные пользователем -->
			  {% IFNOT recently_viewed_goods_empty %}
				<div class="menu_main">
				  <a href="#" class="link_nav" title="Вы смотрели">Вы смотрели</a>
				  <a href="#" title="Вы смотрели" style="text-decoration: none"><h4 class="hidden-phone">Вы смотрели</h4></a>
				  <ul class="sm">
					<li>
					  {% FOR recently_viewed_goods %}
						<div class="goods-image-icon-square" style="padding: 0.8em 5px 0.8em 0;vertical-align:middle;text-align:center;display: inline-block;">
						  <a href="{recently_viewed_goods.URL}" title="Перейти на страницу &laquo;{recently_viewed_goods.NAME}&raquo;" style="text-align: center;"><img style="margin: auto;" src="{% IF recently_viewed_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-icon.png{% ELSE %}{recently_viewed_goods.IMAGE_ICON}{% ENDIF %}" alt="{recently_viewed_goods.NAME}" /></a>
						</div>
					  {% ENDFOR %}
					</li>
				  </ul>
				</div>
			  {% ENDIF %}
			  <!-- END Последние товары, просмотренные пользователем -->
Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:

.sm {
	display: block;
	margin: 0 auto;
	text-align: center;
	width: 94%;
}
.sm .goods-image-icon-square {
	float: none;
	margin: 0 auto;
	width: 28%;
}



#24 Andrew S.

Andrew S.

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

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 24 Сентябрь 2013 - 11:47

Просмотр сообщенияKoderhan (23 Сентябрь 2013 - 11:48) писал:

1. 2
Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Найти код:
.product-box{padding:14px 14px 14px 14px; background:#FFF;/*height:280px;*/}
Заменить:
.product-box{padding: 7% 6% 6% 6%; background:#FFF;/*height:280px;*/}
3

Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:
@media screen and (max-width: 760px) {
.span4.footer .span44 {
margin-left: -7px;
}
}
4 Можно добавить отступ следующим образом.

Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:
.span4.footer .span44 .copy {
padding-bottom: 1em;
}

5. Пункты меню вы можете перемещать в разделе Сайт -> Меню.
Прикрепленный файл ScreenShot 796.png

И для добавления картинок.

Панель администратора, "Сайт"->"Редактор тем".
В файле "HTML".
Найти код:
class="{% IF menu.header.links.NAME=Каталог %}catalog{% ELSEIF menu.header.links.NAME=Каталог товаров %}catalog{% ELSEIF menu.header.links.NAME=Акции %}present{% ELSEIF menu.header.links.NAME=Акции магазина %}present{% ELSEIF menu.header.links.NAME=Доставка %}clock{% ELSEIF menu.header.links.NAME=Контакты %}address{% ELSEIF menu.header.links.NAME=Связь с администрацией %}address{% ELSEIF menu.header.links.NAME=Л.Кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Личный кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Выход %}key{% ELSEIF menu.header.links.NAME=Вход в бэк-офис %}key{% ELSEIF menu.header.links.NAME=Войти в ЛК %}key{% ELSEIF menu.header.links.NAME=Вход в личный кабинет %}key{% ELSEIF menu.header.links.NAME=Мои заказы %}tick{% ELSEIF menu.header.links.NAME=История заказов %}tick{% ELSEIF menu.header.links.NAME=Новинки %}label{% ELSEIF menu.header.links.NAME=Хиты %}heart{% ELSEIF menu.header.links.NAME=Хиты продаж %}heart{% ELSEIF menu.header.links.NAME=Статьи %}clipboard{% ELSEIF menu.header.links.NAME=Корзина %}cart{% ELSEIF menu.header.links.NAME=Главная %}home{% ELSEIF menu.header.links.NAME=Лента новостей %}document{% ELSEIF menu.header.links.NAME=Новости магазина %}document{% ELSEIF menu.header.links.NAME=Каталог статей %}document{% ELSEIF menu.header.links.NAME=Новости СМИ %}document{% ELSEIF menu.header.links.NAME=Регистрация %}user{% ELSEIF menu.header.links.NAME=Восстановление пароля %}user{% ENDIF %}{% IF menu.header.links.SELECTED %}-act selected{% ENDIF %}">{menu.header.links.NAME}</a>
Заменить:
class="{% IF menu.header.links.NAME=Каталог %}catalog{% ELSEIF menu.header.links.NAME=Каталог товаров %}catalog{% ELSEIF menu.header.links.NAME=Акции %}present{% ELSEIF menu.header.links.NAME=Акции магазина %}present{% ELSEIF menu.header.links.NAME=Доставка %}clock{% ELSEIF menu.header.links.NAME=Контакты %}address{% ELSEIF menu.header.links.NAME=Связь с администрацией %}address{% ELSEIF menu.header.links.NAME=Л.Кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Личный кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Выход %}key{% ELSEIF menu.header.links.NAME=Вход в бэк-офис %}key{% ELSEIF menu.header.links.NAME=Войти в ЛК %}key{% ELSEIF menu.header.links.NAME=Вход в личный кабинет %}key{% ELSEIF menu.header.links.NAME=Мои заказы %}tick{% ELSEIF menu.header.links.NAME=История заказов %}tick{% ELSEIF menu.header.links.NAME=Новинки %}label{% ELSEIF menu.header.links.NAME=Хиты %}heart{% ELSEIF menu.header.links.NAME=Хиты продаж %}heart{% ELSEIF menu.header.links.NAME=Статьи %}clipboard{% ELSEIF menu.header.links.NAME=Корзина %}cart{% ELSEIF menu.header.links.NAME=Главная %}home{% ELSEIF menu.header.links.NAME=Лента новостей %}document{% ELSEIF menu.header.links.NAME=Новости магазина %}document{% ELSEIF menu.header.links.NAME=Каталог статей %}document{% ELSEIF menu.header.links.NAME=Новости СМИ %}document{% ELSEIF menu.header.links.NAME=Регистрация %}user{% ELSEIF menu.header.links.NAME=Восстановление пароля %}user{% ELSEIF menu.header.links.NAME=Оплата %} oplata {% ELSEIF menu.header.links.NAME=Услуги %} uslugi {% ENDIF %}{% IF menu.header.links.SELECTED %}-act selected{% ENDIF %}">{menu.header.links.NAME}</a>
И добавить стили с сылками на иконки.
В файле "main.css".
Добавить в конец файла код:

.header .links li a.oplata {background:url("адрес иконки") left center no-repeat;}
.header .links li a.uslugi {background:url("адрес иконки") left center no-repeat;}


6. Для добавления значка на против "Мой кабинет" .

Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:

.header .links li a.-act.selected {background:url("адрес иконки") left center no-repeat;}
7.
В файле "HTML".
Найти код:
<!-- Последние товары, просмотренные пользователем -->
{% IFNOT recently_viewed_goods_empty %}
<div class="menu_main">
<a href="#" class="link_nav" title="Вы смотрели">Вы смотрели</a>
<a href="#" title="Вы смотрели" style="text-decoration: none"><h4 class="hidden-phone">Вы смотрели</h4></a>
<ul>
<li>
{% FOR recently_viewed_goods %}
<div class="goods-image-icon-square" style="padding: 0.8em 5px 0.8em 0;vertical-align:middle;text-align:center;display: inline-block;">
<a href="{recently_viewed_goods.URL}" title="Перейти на страницу &laquo;{recently_viewed_goods.NAME}&raquo;" style="text-align: center;"><img style="margin: auto;" src="{% IF recently_viewed_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-icon.png{% ELSE %}{recently_viewed_goods.IMAGE_ICON}{% ENDIF %}" alt="{recently_viewed_goods.NAME}" /></a>
</div>
{% ENDFOR %}
</li>
</ul>
</div>
{% ENDIF %}
<!-- END Последние товары, просмотренные пользователем -->
Заменить:
<!-- Последние товары, просмотренные пользователем -->
{% IFNOT recently_viewed_goods_empty %}
<div class="menu_main">
<a href="#" class="link_nav" title="Вы смотрели">Вы смотрели</a>
<a href="#" title="Вы смотрели" style="text-decoration: none"><h4 class="hidden-phone">Вы смотрели</h4></a>
<ul class="sm">
<li>
{% FOR recently_viewed_goods %}
<div class="goods-image-icon-square" style="padding: 0.8em 5px 0.8em 0;vertical-align:middle;text-align:center;display: inline-block;">
<a href="{recently_viewed_goods.URL}" title="Перейти на страницу &laquo;{recently_viewed_goods.NAME}&raquo;" style="text-align: center;"><img style="margin: auto;" src="{% IF recently_viewed_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-icon.png{% ELSE %}{recently_viewed_goods.IMAGE_ICON}{% ENDIF %}" alt="{recently_viewed_goods.NAME}" /></a>
</div>
{% ENDFOR %}
</li>
</ul>
</div>
{% ENDIF %}
<!-- END Последние товары, просмотренные пользователем -->
Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:

.sm {
display: block;
margin: 0 auto;
text-align: center;
width: 94%;
}
.sm .goods-image-icon-square {
float: none;
margin: 0 auto;
width: 28%;
}

1. Теперь на 100% все эти кнопки "добавить в корзину" съезжают.

2. Отступ между левым и правым блоками не увеличился (не стал прежним).

3. По центру все не встало (в левом блоке).

4. Внизу отступ не появился (внизу левого блока). Заметил только что он длинней стал и всё.

5. Почему только по одной ссылке на каждую иконку? Она ведь должна меняться при наведении.
/* Ссылки на изображения в главном меню */
.header .links li a.oplata {background:url("адрес иконки") left center no-repeat;}
.header .links li a.uslugi {background:url("адрес иконки") left center no-repeat;}
.header .links li a.-act.selected {background:url("адрес иконки") left center no-repeat;}

6. Также всего одна ссылка на одно изображение. А везде там по 2.
Код вставлен в 5 пункте.

7. Блок "вы смотрели" вроде как сдвинулся (и то точно не понять), но все равно не по центру.

Скриншоты:



Сообщение отредактировал Andrew S.: 24 Сентябрь 2013 - 12:41


#25 Koderhan

Koderhan

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

  • Модератоpы
  • 6 227 сообщений

Отправлено 24 Сентябрь 2013 - 14:28

1, 2.

Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:
.products-grid .actions button {
	float: none;
	display: block;
	margin: 0 auto;
}
3. Из файла "html" удалить код:
width="228"

4. Не совсем понятно про какой отступ вы говорите. Если отступ снизу от "Хабаровский край," то можно добавить стили в файл main.css,
Код:
.span4.footer .span44 .copy {
	margin-bottom: 10%;
}
5. Если вы хотите чтобы иконка при наведение менялась то достаточно добавить hover событие.
В файле "main.css" добавить код:
.header .links li a.oplata:hover {background:url("адрес иконки  при наведение на ссылку") left center no-repeat;}
.header .links li a.uslugi:hover {background:url("адрес иконки при наведение на ссылку") left center no-repeat;}

6. Тут тоже самое, добавить hover событие для элемента.
Добавить код:
.header .links li a.-act.selected:hover {background:url("адрес иконки при наведение") left center no-repeat;}


#26 Andrew S.

Andrew S.

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

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 24 Сентябрь 2013 - 15:13

Old:

3. В каком именно месте удалить код? Чтобы информация в левом блоке встала по центру. Он в двух местах..
(Из файла "html" удалить код :)
width="228"


4. Отступ - в смысле чтобы оторвать от нижней части левый блок. Т.к. везде он оторван:


В сафари отступ сам появляется. Для неродивых как я:


New:

1. Почему вы ни слова уже второй раз не говорите про отступ между левым и правыми блоками? Он был больше. Зачем его сократили????? Как его сделать ПРЕЖНИМ?
Вот как выглядит запланированный идеал:

Вот как выглядит шаблон:


Проблема была в том, что на шаблонном варианте все буквы стоят вплотную к левой части (на белом поле). И при добавлении серого фона по всей территории - буквы были впритык к границе. Что есть нехорошо.:

Это уменьшенный масштаб сайта. При уменьшении он залазит на правую часть и становится видно насколько короткая белая левая часть. Что буквы вплотную. Так и у меня было вначале. До того как начал всё изменять в этой теме.

Может, еще, когда убрали толстые границы вокруг правых блоков - правые блоки встали ближе к главному левому. Не знаю. Нужно их обратно поставить.

2. Почему в Эксплорере вот это так ужасно? Увеличенные фото в режимах и список и таблица. И строчка режима работы не понять где.


3. В сафари кнопки не посередине:

Сообщение отредактировал Andrew S.: 24 Сентябрь 2013 - 15:21


#27 miyako

miyako

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

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

Отправлено 24 Сентябрь 2013 - 15:56

Просмотр сообщенияAndrew S. (24 Сентябрь 2013 - 15:13) писал:

Old:

3. В каком именно месте удалить код? Чтобы информация в левом блоке встала по центру. Он в двух местах..
(Из файла "html" удалить код :)
width="228"


4. Отступ - в смысле чтобы оторвать от нижней части левый блок. Т.к. везде он оторван:
Прикрепленный файл Otstup vverhu.jpgПрикрепленный файл Otstup vnizu.jpg

В сафари отступ сам появляется. Для неродивых как я:
Прикрепленный файл Safarisdeg.png

New:

1. Почему вы ни слова уже второй раз не говорите про отступ между левым и правыми блоками? Он был больше. Зачем его сократили????? Как его сделать ПРЕЖНИМ?
Вот как выглядит запланированный идеал:
Прикрепленный файл Site_grey_color_scheme_jpg_obrez.jpg
Вот как выглядит шаблон:
Прикрепленный файл Otstup levo-pravo.jpg

Проблема была в том, что на шаблонном варианте все буквы стоят вплотную к левой части (на белом поле). И при добавлении серого фона по всей территории - буквы были впритык к границе. Что есть нехорошо.:
Прикрепленный файл serthsretsthsetrh.jpg
Это уменьшенный масштаб сайта. При уменьшении он залазит на правую часть и становится видно насколько короткая белая левая часть. Что буквы вплотную. Так и у меня было вначале. До того как начал всё изменять в этой теме.

Может, еще, когда убрали толстые границы вокруг правых блоков - правые блоки встали ближе к главному левому. Не знаю. Нужно их обратно поставить.

2. Почему в Эксплорере вот это так ужасно? Увеличенные фото в режимах и список и таблица. И строчка режима работы не понять где.
Прикрепленный файл exxfhdrthdtr.jpg

3. В сафари кнопки не посередине:
Прикрепленный файл sasasaarsg.jpg

4 - Найдите код -
#main > .span4 {
margin: 21px -16px 0 3px;
padding-left: 13px;
}
и замените на -
#main > .span4 {
margin: 21px -16px 21px 3px;
padding-left: 13px;
}


#28 miyako

miyako

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

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

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

3 new-
Найдите код в шаблоне Товары -
   <button type="button" title="Добавить товар в корзину" class="btn btn-success2" onclick="$('.product-form-{goods.MIN_PRICE_NOW_ID}').submit();return false;">Добавить в корзину</button>
и замените на -
  <center> <button type="button" title="Добавить товар в корзину" class="btn btn-success2" onclick="$('.product-form-{goods.MIN_PRICE_NOW_ID}').submit();return false;">Добавить в корзину</button>
</center>


#29 Andrew S.

Andrew S.

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

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 24 Сентябрь 2013 - 16:34

Просмотр сообщенияmiyako (24 Сентябрь 2013 - 16:04) писал:

3 new-
Найдите код в шаблоне Товары -
<button type="button" title="Добавить товар в корзину" class="btn btn-success2" onclick="$('.product-form-{goods.MIN_PRICE_NOW_ID}').submit();return false;">Добавить в корзину</button>
и замените на -
<center> <button type="button" title="Добавить товар в корзину" class="btn btn-success2" onclick="$('.product-form-{goods.MIN_PRICE_NOW_ID}').submit();return false;">Добавить в корзину</button>
</center>
FAIL! В Сафари все та же ерунда. Но и теперь в мозилле кнопка съехала!

#30 Сake

Сake

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

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

Отправлено 25 Сентябрь 2013 - 01:51

Попробуйте добавить в файл стилей main.css

.products-grid .actions {
	clear: both;
}


#31 Andrew S.

Andrew S.

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

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 25 Сентябрь 2013 - 10:49

Просмотр сообщенияСake (25 Сентябрь 2013 - 01:51) писал:

Попробуйте добавить в файл стилей main.css

.products-grid .actions {
clear: both;
}
В мозилле вроде все встало на свои места. В Сафари не по центру до сих пор. Что на счет других вопросов?

#32 miyako

miyako

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

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

Отправлено 25 Сентябрь 2013 - 12:12

Просмотр сообщенияAndrew S. (25 Сентябрь 2013 - 10:49) писал:

В мозилле вроде все встало на свои места. В Сафари не по центру до сих пор. Что на счет других вопросов?

3(new)
Найдите код -
.products-grid .actions {
clear: both;
}
и замените на -
.products-grid .actions {
clear: both;
width: 100%;
}

3 (old) Можете подробнее объяснить какой блок нужно отцентрировать?

4 Не актуален?

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

2 (new)
Код -
.work-time {
padding-left: 3px;
vertical-align: middle;
float: left;
}
замените на -
.work-time {
padding-left: 3px;
float: left;
}

Размеры изображений в категории одинаковые. Можете привести пример конкретной категории, где разные размеры?

#33 Andrew S.

Andrew S.

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

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 25 Сентябрь 2013 - 12:42

Просмотр сообщенияmiyako (25 Сентябрь 2013 - 12:12) писал:

3(new)
Найдите код -
.products-grid .actions {
clear: both;
}
и замените на -
.products-grid .actions {
clear: both;
width: 100%;
}

3 (old) Можете подробнее объяснить какой блок нужно отцентрировать?

4 Не актуален?

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

2 (new)
Код -
.work-time {
padding-left: 3px;
vertical-align: middle;
float: left;
}
замените на -
.work-time {
padding-left: 3px;
float: left;
}

Размеры изображений в категории одинаковые. Можете привести пример конкретной категории, где разные размеры?
Сейчас всё буду заново писать. И конкретно по пикселям. Но пока один вопрос так и не решён. В Сафари кнопка так и стоит слева, а не по середине. 5 действий еще не помогли.


И пока еще тут же помогите решить проблему с изображением товаров в каталоге в эксплорере. Почему они такие увеличенные? Как сделать как везде? Кривизна в режиме "таблица" по 3 товара в ряд.

Сообщение отредактировал Andrew S.: 25 Сентябрь 2013 - 12:47


#34 miyako

miyako

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

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

Отправлено 25 Сентябрь 2013 - 13:26

Просмотр сообщенияAndrew S. (25 Сентябрь 2013 - 12:42) писал:

Сейчас всё буду заново писать. И конкретно по пикселям. Но пока один вопрос так и не решён. В Сафари кнопка так и стоит слева, а не по середине. 5 действий еще не помогли. Прикрепленный файл Safari.jpg И пока еще тут же помогите решить проблему с изображением товаров в каталоге в эксплорере. Почему они такие увеличенные? Как сделать как везде? Кривизна в режиме "таблица" по 3 товара в ряд. Прикрепленный файл Explorer.jpg

По ie -
Попробуйте удалить строку -
<meta http-equiv="X-UA-Compatible" content="IE=7" />
в шаблоне HTML

В какой версии ie у Вас так отображается?

#35 Koderhan

Koderhan

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

  • Модератоpы
  • 6 227 сообщений

Отправлено 25 Сентябрь 2013 - 13:33

Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:
.products-grid .actions button {
	display: inline;
	text-align: center;
}


#36 Andrew S.

Andrew S.

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

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 25 Сентябрь 2013 - 13:49

Просмотр сообщенияmiyako (25 Сентябрь 2013 - 13:26) писал:

По ie -
Попробуйте удалить строку -
<meta http-equiv="X-UA-Compatible" content="IE=7" />
в шаблоне HTML

В какой версии ie у Вас так отображается?

Просмотр сообщенияKoderhan (25 Сентябрь 2013 - 13:33) писал:


Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:
.products-grid .actions button {
display: inline;
text-align: center;
}
Обе эти вещи помогли. Надеюсь. С первого взгляда пока вижу, что всё ок. Версия IE 10.0.9200.16686

Сейчас ещё раз опишу подробно старые проблемы.

Сообщение отредактировал Andrew S.: 25 Сентябрь 2013 - 13:49


#37 Andrew S.

Andrew S.

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

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 25 Сентябрь 2013 - 14:17

Скриншоты:
1) 2)

Вопросы:
1. Решение проблемы по части вывода на экран информации о часах и днях работы магазина вижу только в добавлении новой строчки в html. И менять все вручную в коде (если что). Это видно на 2ом скриншоте вверху. Подскажите, пожалуйста, как её добавить. Чтобы информация выводилась после всех асек, скайпов и телефонов. И до корзины.

2. Отступ между левым и правым блоком. На первом скриншоте видно, что отступ сейчас равен 5 пикселям. Нужно добавить еще 17 пикселей. Но учесть то, что еще нужно сделать нарост на левый блок, который описан в третьем пункте. На втором скриншоте на цифру вверху в самой правой части можете не обращать внимания. Я там просто вымерял расстояние, чтобы фон скопировать влево между левым и правым блоками. На втором скриншоте видны все расстояния. Которые хочется сделать равными.

3. Центрирование информации в левом блоке.
Мы с вами как-то добавили к левому блоку расстояние слева. Для того чтобы буквы были не впритык к левой части. И так он стал неровный. И точно по этой же причине уменьшилось расстояние между левым и правыми блоками. На первом скриншоте видно, что сейчас расстояние от начала букв до левой части - 20 пикселей. А справа от букв до правой границы - всего 6 пикселей. Это очень сильно бросается в глаза. На этом скриншоте я сделал все расстояния равными. И сами видите как все лучше когда все ровно.
Получается, что справа нужно добавить еще 14 пикселей белого поля. Так все встанет на свои места.

#38 miyako

miyako

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

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

Отправлено 25 Сентябрь 2013 - 14:51

Просмотр сообщенияAndrew S. (25 Сентябрь 2013 - 14:17) писал:

Скриншоты:
1) Прикрепленный файл 1. Отступ между левым и правым. (2).jpg 2) Прикрепленный файл 1. Отступ между левым и правым. 2. Часы работы магазина.jpg

Вопросы:
1. Решение проблемы по части вывода на экран информации о часах и днях работы магазина вижу только в добавлении новой строчки в html. И менять все вручную в коде (если что). Это видно на 2ом скриншоте вверху. Подскажите, пожалуйста, как её добавить. Чтобы информация выводилась после всех асек, скайпов и телефонов. И до корзины.

2. Отступ между левым и правым блоком. На первом скриншоте видно, что отступ сейчас равен 5 пикселям. Нужно добавить еще 17 пикселей. Но учесть то, что еще нужно сделать нарост на левый блок, который описан в третьем пункте. На втором скриншоте на цифру вверху в самой правой части можете не обращать внимания. Я там просто вымерял расстояние, чтобы фон скопировать влево между левым и правым блоками. На втором скриншоте видны все расстояния. Которые хочется сделать равными.

3. Центрирование информации в левом блоке.
Мы с вами как-то добавили к левому блоку расстояние слева. Для того чтобы буквы были не впритык к левой части. И так он стал неровный. И точно по этой же причине уменьшилось расстояние между левым и правыми блоками. На первом скриншоте видно, что сейчас расстояние от начала букв до левой части - 20 пикселей. А справа от букв до правой границы - всего 6 пикселей. Это очень сильно бросается в глаза. На этом скриншоте я сделал все расстояния равными. И сами видите как все лучше когда все ровно.
Получается, что справа нужно добавить еще 14 пикселей белого поля. Так все встанет на свои места.

По времени -
Найдите код в шаблоне HTML -
  <!-- Время работы магазина -->
				{% IF SETTINGS_STORE_WORK_TIME %}
				  <div class="work-time" title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">
					{SETTINGS_STORE_WORK_TIME}
				  </div>
				{% ENDIF %}
и удалите

Далее найдите код -
  <div class="span44">
			<!-- Корзина -->
			<div class="cartInfo">

и до этого кода добавьте -
  <!-- Время работы магазина -->
				{% IF SETTINGS_STORE_WORK_TIME %}
				  <div class="work-time" title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}" style="padding-top:5px;">
					Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME} пн-пт
				  </div>
				{% ENDIF %}

Добавьте в конец main.css -
.row-fluid{margin-left:22px !important;}


#39 Andrew S.

Andrew S.

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

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 25 Сентябрь 2013 - 15:44

Просмотр сообщенияmiyako (25 Сентябрь 2013 - 14:51) писал:

По времени -
Найдите код в шаблоне HTML -
<!-- Время работы магазина -->
			 {% IF SETTINGS_STORE_WORK_TIME %}
				 <div class="work-time" title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">
				 {SETTINGS_STORE_WORK_TIME}
				 </div>
			 {% ENDIF %}
и удалите

Далее найдите код -
<div class="span44">
		 <!-- Корзина -->
		 <div class="cartInfo">

и до этого кода добавьте -
<!-- Время работы магазина -->
			 {% IF SETTINGS_STORE_WORK_TIME %}
				 <div class="work-time" title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}" style="padding-top:5px;">
				 Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME} пн-пт
				 </div>
			 {% ENDIF %}

Добавьте в конец main.css -
.row-fluid{margin-left:22px !important;}
Greatable!!! Теперь осталось:

1. Немного нарастить правую часть левого блока. Как именно описывал в предыдущем(их) сообщении(ях).

2. Сдвинуть в начало эту надпись о графике работы, т.к. в опере она вылазит на след. строчку:

На уровень с телефонами и скайпом.

Я только единственное не пойму. Если мы сдвинули левый блок на такое-то количество пикселей и вот что получилось:

На дополнительный приросто к левому блоку осталось всего 5 пикселей. Но нужно было 14 пикселей. Не хватает 9. Я могу написать в том коде, если что, не 22px, а больше, к примеру? Или меньше. Подскажите.
И белый надо увеличить на 14 пикселей, не забывайте.

3. Мы с вами добавляли логотипы к верхнему меню. Вот что вышло:
- без наведения
- при наведении на 1 пункт
-  при наведении на 2 пункт
-  при наведении на 3 пункт
Как сделать так, чтобы показывались все изображения? В одном вообще ничего не показывается. Вот код:
/* Дополнительные ссылки на изображения в главном меню */
.header .links li a.oplata {background:url({ASSETS_IMAGES_PATH}menu_icon_oplata_pass.png) left center no-repeat;}
.header .links li a.oplata:hover {background:url({ASSETS_IMAGES_PATH}menu_icon_oplata_act.png) left center no-repeat;}
.header .links li a.uslugi {background:url({ASSETS_IMAGES_PATH}menu_icon_uslugi_pass.png) left center no-repeat;}
.header .links li a.uslugi:hover {background:url({ASSETS_IMAGES_PATH}menu_icon_uslugi_act.png) left center no-repeat;}
.header .links li a.-act.selected {background:url({ASSETS_IMAGES_PATH}menu_icon_key_16.png) left center no-repeat;}
.header .links li a.-act.selected:hover {background:url({ASSETS_IMAGES_PATH}menu_icon_key_16_act.png) left center no-repeat;}

И еще скриншоты. Непонять что происходит с этими изображениями...

Сообщение отредактировал Andrew S.: 25 Сентябрь 2013 - 19:40


#40 Andrew S.

Andrew S.

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

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 25 Сентябрь 2013 - 18:23

Поставьте кнопку "работаем над вашим вопросом"... А то ощущения как у парашютиста 19 века.. А мы бы ставили "вопрос решен". И все бы друг друга прекрасно понимали.. И вы бы потом также ставили по окончанию.
Вы даже не представляете как бы нам это понравилось. Да и вам бы легче стало.
Картинка:


Добавил 3 пункт в предыдущее сообщение.

Сообщение отредактировал Andrew S.: 25 Сентябрь 2013 - 19:27





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

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