Начать новую тему

Проблемы с версткой

Здравствуйте! Просьба помочь с решением такой проблемы. У нас есть страничка на сайте Отзывы покупателей. С настольной версией всё ок. Все отзывы делали в одном стиле. Но в мобильной версии выглядят они по-разному (см. вложение). В отзыве от Фишкорна текст выглядит аккуратно, расположен под фотографией. Во втором случае-часть текста сбоку фотографии, часть - внизу. Смотрится плохо, неряшливо. Как сделать, чтобы в мобильной версии во всех отзывах текст аккуратно располагался под фото?
png
png

Здравствуйте, Владислав!


Боюсь, что легкового решения по этому вопросу нет. Как мы видим, отзыв оформлен сразу под изображением купленного товара. В этом случае мы можем предложить вам 2 решения: 


1. Пересоздать страницу отзывов с помощью блочной верстки. Для этого рекомендуем дублировать существующую страницу отзывов и редактировать копию. Для того чтобы просмотреть результат полученной работы, вам необходимо будет изменить статус этой страницы с Выкл на Скрыто и в меню шестеренки, нажать на ссылку Предпросмотр.  Когда страница будет полностью готова, вы сможете изменить ссылку в меню или скопировать текущее содержимое страницы отзывов в первоначальную страницу отзывов, а копию затем удалить.


Для того чтобы корректно оформить блочную верстку, рекомендуем вам отключить на время HTML-редактор по умолчанию на странице Настройки > Внешний вид в панели администратора вашего магазина.


2. Этот вариант менее правильный, мы рекомендуем добавить свойство float со значением right ко всем текстам отзывов. Отметим, что это же свойство необходимо будет добавить и к логотипам компаний, которые оставляли отзывы. 


Мы также рекомендуем попробовать это решение на дублированной странице отзывов с выключенным HTML-редактором по умолчанию.


Спасибо.



Анастасия, спасибо за ответ! Уточните, пожалуйста: "добавить свойство float со значением right ко всему текстам отзывов. Отметим, что это же свойство необходимо будет добавить и к логотипам компаний, которые оставляли отзывы" - как это делается?

Здравствуйте, Владислав.


Как мы упоминали выше, вам необходимо отключить HTML-редактор по умолчанию на странице Настройки > Внешний вид в панели администратора вашего магазина. Затем перейдите на страницу отзывов или на дублированную страницу отзывов, найдите необходимый текст отзывов и добавьте соответствующее свойство.


Например:

 

<span data-redactor-style="font-family:trebuchet ms,helvetica,sans-serif;" rel="font-family:trebuchet ms,helvetica,sans-serif;" style="font-family:trebuchet ms,helvetica,sans-serif;">"Реально лучше стало с Вашими экранами. Больше нет точечного попадания в сотрудников, </span>

 

 Добавляем свойство (float:right;):


<span data-redactor-style="font-family:trebuchet ms,helvetica,sans-serif;" rel="font-family:trebuchet ms,helvetica,sans-serif;" style="font-family:trebuchet ms,helvetica,sans-serif; float:right;">"Реально лучше стало с Вашими экранами. Больше нет точечного попадания в сотрудников, </span>

 

Вам необходимо сделать соответствующие изменения для всего текста.


Спасибо.


Войдите, чтобы опубликовать свой комментарий