为什么我的 Wordpress 页面突然不适合移动设备？

Question

我在一个映射到 Wordpress 网站的 Github 托管网站上有一个 Mapbox 地图。 Wordpress 镜像在移动设备上没有按应有的方式显示，它非常小且难以阅读，就好像它在显示桌面版本一样，但原始站点显示正确。原文：http://jfact0ry.com/theRIDE/

镜像：http://ridesitka.com/map/

我为当地一家交通机构制作了这张地图。他们的网站托管在 Wordpress.org 网站上。我使用一个 iframe 页面作为 wordpress 的模板：（归功于 Sup-a-Dillie-O

<?php
/**
    Template Name: Content Only
*/
?>
<html>
<head>
   <title><?php wp_title( '|', true, 'right' ); bloginfo('url'); ?></title>
   <style>
       html,body,div,iframe {height:100%;}
       p {position:relative;overflow:hidden;}
       iframe {border:none;width:100%;}
       body {margin:0;padding:0;}
   </style>
</head>

<body>
      <?php while (have_posts()) : the_post(); ?>
      <?php the_content(); endwhile; ?> 
</body>
</html>

这是站点 theRIDE/index.html

的完整 html

是什么使 Wordpress 中的加载不同？我需要更改什么才能使其适合移动设备？

谢谢。

编辑：已更改 url 图像

Answer 1

在您的 <head> 部分，您遗漏了这个：

<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">

这会设置正确的比例。

这个有效

这个没有

为什么我的 Wordpress 页面突然不适合移动设备？

Why is my Wordpress page suddenly not mobile-friendly?

php

html

wordpress

mapbox

mobile-browser