Как изменить размер карты Iframe на полный экран в теме Shopify Atlantic - PullRequest
Новая
       23

Как изменить размер карты Iframe на полный экран в теме Shopify Atlantic

0 голосов
/ 21 октября 2019

Я использую тему Atlantic и создаю новую страницу для карты. Я использовал следующий код, который упоминается ниже 

<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d27728.56583382997!2d-95.647502!3d29.688729!3m2!..." width="800" height="600" frameborder="0" style="border:0;" allowfullscreen="">

Пожалуйста, помогите мне получить его в полном размере, я использовал метод создания нового макета, но все равно он не работает. Это сработало только тогда, когда я написал макет null {% layout none%} Но мне нужна тема, которую я не хочу делать макетом нулевым. Скриншот прилагается ниже ify

1 Ответ

1 голос
/ 21 октября 2019

Установите высоту и ширину <iframe> на 100% с помощью CSS: 

html, body, iframe {
  height: 100%;
  width: 100%;
  padding: 0px;
  margin: 0px;
}

подтверждение концепции скрипта

фрагмент кода:

html,
body,
iframe {
  height: 100%;
  width: 100%;
  padding: 0px;
  margin: 0px;
}
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3466.07056567071!2d-95.64969038455021!3d29.688733742242416!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8640df708f47547b%3A0x21b117877ecdc1e7!2sMW%20Furniture%20Outlet!5e0!3m2!1sen!2sus!4v1571677313661!5m2!1sen!2sus"
  frameborder="0" style="border:0;" allowfullscreen=""></iframe>
...