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


Как Адаптировать Слайдер


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

#1 stariy-centr@mail.ru

stariy-centr@mail.ru

    Новичок

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

Отправлено 03 Сентябрь 2020 - 20:13

Добрый вечер. Помогите адаптировать размер слайдера в мобильной версии. Урезает фото товара, остаётся только текст крупными буквами. Хотелось бы чтобы слайдер отображался в полном объеме как на втором фото. Аккаунт SL-425725

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

  • Screenshot_2020-09-03-23-52-52-904_com.yandex.browser.jpg
  • Screenshot_2020-09-04-00-14-37-654_com.yandex.browser.jpg


#2 M1STERE0

M1STERE0

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

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

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

 stariy-centr@mail.ru (03 Сентябрь 2020 - 20:13) писал:

Добрый вечер. Помогите адаптировать размер слайдера в мобильной версии. Урезает фото товара, остаётся только текст крупными буквами. Хотелось бы чтобы слайдер отображался в полном объеме как на втором фото. Аккаунт SL-425725

Здравствуйте! В шаблоне main.css найдите и удалите этот код
#slideshow .item .image {display: none;}


#3 stariy-centr@mail.ru

stariy-centr@mail.ru

    Новичок

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

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

Спасибо!
Как изменить, чтобы в мобильной версии товары отображались в два столбца?. При адоптации в один столбик сайт очень растянутый получается

#4 M1STERE0

M1STERE0

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

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

Отправлено 14 Сентябрь 2020 - 10:55

 stariy-centr@mail.ru (14 Сентябрь 2020 - 05:28) писал:

Спасибо!
Как изменить, чтобы в мобильной версии товары отображались в два столбца?. При адоптации в один столбик сайт очень растянутый получается

Здравствуйте! Отправьте примерный дизайн адаптации слайдера для мобильных устройств в эту ветку чата

#5 stariy-centr@mail.ru

stariy-centr@mail.ru

    Новичок

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

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

 M1STERE0 (14 Сентябрь 2020 - 10:55) писал:

Здравствуйте! Отправьте примерный дизайн адаптации слайдера для мобильных устройств в эту ветку чата

Сейчас товары идут в одну колонку как на 1 фото, хотелось чтобы шли в две колонки как на 2.

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

  • Screenshot_2020-09-14-16-09-06-271_com.yandex.browser.jpg
  • Screenshot_2020-09-14-16-09-31-065_com.yandex.browser.jpg


#6 stariy-centr@mail.ru

stariy-centr@mail.ru

    Новичок

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

Отправлено 15 Сентябрь 2020 - 10:29

Добрый день! на фото сильно растягивается категории товара которые смотрели, как исправить?

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

  • Безымянный.png


#7 stariy-centr@mail.ru

stariy-centr@mail.ru

    Новичок

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

Отправлено 23 Сентябрь 2020 - 07:42

а в ответ тишина...

#8 M1STERE0

M1STERE0

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

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

Отправлено 23 Сентябрь 2020 - 09:58

 stariy-centr@mail.ru (14 Сентябрь 2020 - 12:17) писал:

Сейчас товары идут в одну колонку как на 1 фото, хотелось чтобы шли в две колонки как на 2.

Здравствуйте! Перед внесением правок сделайте бэкап шаблона в разделе Сайт > Редактор шаблонов. Далее в конец шаблона main.css добавьте этот код
@meida (max-width: 583px) {
.categories .item {
  width: 30%
}
.goods-cat-image-medium {
	 max-width: 172px;
}
.categories .item .cat-name .title {
	 font-size: 20px;
}
.categories .item .cat-name .button {
	 padding: 0 9px;
}
}

 stariy-centr@mail.ru (15 Сентябрь 2020 - 10:29) писал:

Добрый день! на фото сильно растягивается категории товара которые смотрели, как исправить?

В шаблоне main.css найдите код
.viewed-items .product-info .add-to-links .add-cart:before {content: "\e8cc";position: relative;width: auto;opacity: 1;background: none;vertical-align: middle;font-family: 'Material Icons';font-weight: normal;font-style: normal;line-height: 1;letter-spacing: normal;text-transform: none;display: inline-block;white-space: nowrap;word-wrap: normal;direction: ltr;-webkit-font-feature-settings: 'liga';-webkit-font-smoothing: antialiased;}

и замените его на
.viewed-items .product-info .add-to-links .add-cart:before {content: "\e8cc";position: relative;width: auto;opacity: 1;background: none;vertical-align: middle;font-family: 'Material Icons';font-weight: normal;font-style: normal;line-height: 1;letter-spacing: normal;text-transform: none;white-space: nowrap;word-wrap: normal;direction: ltr;-webkit-font-feature-settings: 'liga';-webkit-font-smoothing: antialiased;}


#9 stariy-centr@mail.ru

stariy-centr@mail.ru

    Новичок

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

Отправлено 23 Сентябрь 2020 - 10:53

 M1STERE0 (23 Сентябрь 2020 - 09:58) писал:

В шаблоне main.css найдите код
.viewed-items .product-info .add-to-links .add-cart:before {content: "\e8cc";position: relative;width: auto;opacity: 1;background: none;vertical-align: middle;font-family: 'Material Icons';font-weight: normal;font-style: normal;line-height: 1;letter-spacing: normal;text-transform: none;display: inline-block;white-space: nowrap;word-wrap: normal;direction: ltr;-webkit-font-feature-settings: 'liga';-webkit-font-smoothing: antialiased;}

и замените его на
.viewed-items .product-info .add-to-links .add-cart:before {content: "\e8cc";position: relative;width: auto;opacity: 1;background: none;vertical-align: middle;font-family: 'Material Icons';font-weight: normal;font-style: normal;line-height: 1;letter-spacing: normal;text-transform: none;white-space: nowrap;word-wrap: normal;direction: ltr;-webkit-font-feature-settings: 'liga';-webkit-font-smoothing: antialiased;}

Спасибо, получилось

 M1STERE0 (23 Сентябрь 2020 - 09:58) писал:

Здравствуйте! Перед внесением правок сделайте бэкап шаблона в разделе Сайт > Редактор шаблонов. Далее в конец шаблона main.css добавьте этот код
@meida (max-width: 583px) {
.categories .item {
width: 30%
}
.goods-cat-image-medium {
	 max-width: 172px;
}
.categories .item .cat-name .title {
	 font-size: 20px;
}
.categories .item .cat-name .button {
	 padding: 0 9px;
}
}

Это не получилось, по прежнему в один столбец отображается

#10 M1STERE0

M1STERE0

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

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

Отправлено 23 Сентябрь 2020 - 13:43

 stariy-centr@mail.ru (23 Сентябрь 2020 - 10:53) писал:

Спасибо, получилось



Это не получилось, по прежнему в один столбец отображается

В шаблоне main.css замените эту строку
@meida (max-width: 583px)

на эту
@media (max-width: 583px)





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

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