Сообщений в теме: 12

[Снежколеп]

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

1. Помогите пожалуйста с блоками товаров, как блок с товарами установить посередине сайта? (см на фото)


2. Как покрасить каждый блок по отдельности? (см на фото)



3. Как увеличить кнопку КУПИТЬ (см на фото выше)


4. Как убрать блок ЗАКАЗ ОБРАТНОГО ЗВОНКА?


Буду Вам очень признателен за помощь, Спасибо.

[Danil]

Снежколеп (26 Март 2015 - 14:57) писал:

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

1. Помогите пожалуйста с блоками товаров, как блок с товарами установить посередине сайта? (см на фото)


2. Как покрасить каждый блок по отдельности? (см на фото)



3. Как увеличить кнопку КУПИТЬ (см на фото выше)


4. Как убрать блок ЗАКАЗ ОБРАТНОГО ЗВОНКА?


Буду Вам очень признателен за помощь, Спасибо.

Здравствуйте.
2) В main.css найдите

.proditem {
  height: auto;
  border: 12px solid #ddd;
}

изменяйте цвет #ddd
3) В main.css найдите код

.addToCart {
  padding: 6px 25px 6px 25px;
  color: #666;
  cursor: pointer;
  border: 1px solid #ddd;
  border-radius: 20px;
  transition: background-color 0.35s ease;
  margin: 0 5px 0 0;
  transition: border-radius 0.35s ease-in-out;
}

и замените на

.addToCart {
  padding: 6px 25px 6px 25px;
  color: #666;
  cursor: pointer;
  border: 1px solid #ddd;
  border-radius: 20px;
  transition: background-color 0.35s ease;
  margin: 0 5px 0 0;
  transition: border-radius 0.35s ease-in-out;
 font-size:20px;
}

изменяйте font-size
4) В шаблоне html найдите код

  <div class="cols col-4 pad10 must100">
		  <h3 class="footheader ftheme-color">Заказ обратного звонка</h3> 

и замените на

  <div class="cols col-4 pad10 must100" style="display:none;">
		  <h3 class="footheader ftheme-color">Заказ обратного звонка</h3> 

[Снежколеп]

Danil (26 Март 2015 - 15:38) писал:

Здравствуйте.
2) В main.css найдите

.proditem {
height: auto;
border: 12px solid #ddd;
}

изменяйте цвет #ddd
3) В main.css найдите код

.addToCart {
padding: 6px 25px 6px 25px;
color: #666;
cursor: pointer;
border: 1px solid #ddd;
border-radius: 20px;
transition: background-color 0.35s ease;
margin: 0 5px 0 0;
transition: border-radius 0.35s ease-in-out;
}

и замените на

.addToCart {
padding: 6px 25px 6px 25px;
color: #666;
cursor: pointer;
border: 1px solid #ddd;
border-radius: 20px;
transition: background-color 0.35s ease;
margin: 0 5px 0 0;
transition: border-radius 0.35s ease-in-out;
font-size:20px;
}

изменяйте font-size
4) В шаблоне html найдите код

<div class="cols col-4 pad10 must100">
		 <h3 class="footheader ftheme-color">Заказ обратного звонка</h3>

и замените на

<div class="cols col-4 pad10 must100" style="display:none;">
		 <h3 class="footheader ftheme-color">Заказ обратного звонка</h3>

Здравствуйте!
Всё супер спасибо, но как быть с первым вопросом? (1. Помогите пожалуйста с блоками товаров, как блок с товарами установить посередине сайта? (см на фото))
Спасибо.

[Снежколеп]

так же хотелось бы узнать ответ на этот вопрос (. Как покрасить каждый блок по отдельности? (см на фото)) Вы мне показали пример как покрасить всё сразу, а мне необходимо что бы каждый блок был покрашен отдельно
Спасибо.

[Снежколеп]

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

Ответьте пожалуйста на вопросы...
1. Помогите пожалуйста с блоками товаров, как блок с товарами установить посередине сайта? (см на фото)
Всё дело в том что мне необходимо 3 товара разместить посередине.

[Danil]

Снежколеп (27 Март 2015 - 10:12) писал:

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

Ответьте пожалуйста на вопросы...
1. Помогите пожалуйста с блоками товаров, как блок с товарами установить посередине сайта? (см на фото)
Всё дело в том что мне необходимо 3 товара разместить посередине.

Здравствуйте.
Попробуйте так:
в конец main.css добавьте

div#owl-demo .owl-wrapper, div#owl-demo2 .owl-wrapper, div#owl-demo3 .owl-wrapper {max-width:1332px}
.owl-item {
  display: inline-block;
  float: none !important;
}
@media only screen and (max-width:1668px) {
.owl-item{float:left !important;display:block;}
}

[Снежколеп]

Danil (27 Март 2015 - 10:48) писал:

Здравствуйте.
Попробуйте так:
в конец main.css добавьте

div#owl-demo .owl-wrapper, div#owl-demo2 .owl-wrapper, div#owl-demo3 .owl-wrapper {max-width:1332px}
.owl-item {
display: inline-block;
float: none !important;
}
@media only screen and (max-width:1668px) {
.owl-item{float:left !important;display:block;}
}

Вы мой спаситель, спасибо огромное.

[Снежколеп]

Здравствуйте!
Помогите ещё по одному вопросу, с товарами на главной странице, дело в том что на экранах с маленьким разрешением товары на главной расширяют свой блок в котором они находятся, это не очень красиво смотрится, как это исправить? Фото прикрепляю.

Фото № 1 (нормальное отображение)


Фото № 2 (ужасно смотрится)

[Снежколеп]

Помогите пожалуйста, жду от вас ответа, спасибо.

[Снежколеп]

Людиииии, помогите пожалуйста =((

[Vaccina]

Попробуйте следующее, в main.css найдите:

@media only screen and (max-width:480px){

после него пропишите:

.owl-item {
  width: 20% !important;
}

[Снежколеп]

Спасибо за ответ, но к сожалению блоки не остаются такими же, они всё время становятся больше, то-есть расширяются под экран, ужасно смотрится.
Почему демо моего сайта работает просто отлично? http://chameleon-demo.storeland.ru/
А мой сайт смотрится ужасно? Можно ли сделать что бы мой сайт был таким же как демо?

[Vaccina]

В main.js найдите следующий код(их несколько найдется)

owl.owlCarousel({
	  items : 4, //10 items above 1000px browser width
	  itemsDesktop : [1650,3], //4 items between 1650px and 901px
	  itemsDesktopSmall : [800,2], // betweem 1250px and 601px
	  itemsTablet: [450,1], //1 items between 600 and 0
	  itemsMobile : false // itemsMobile disabled - inherit from itemsTablet option
  });

Цифра в квадратных скобках после запятой обозначает количество товарных позиций в карусели при конкретном диапазоне разрешения экрана окна браузера, попробуйте сменить ее, например вместо 3 пропишите 4