Встроенный код не будет отображаться на странице WordPress - PullRequest
Новая
       9

Встроенный код не будет отображаться на странице WordPress

0 голосов
/ 15 ноября 2018

У меня есть простой код, который содержит все html, css / styling и javascript, необходимые для отображения веб-карты в браузере.Если я запускаю его из локального файла, он правильно открывается в браузере и отображает веб-карту.Сейчас я пытаюсь внедрить этот код в страницу, используя мой редактор WordPress / CMS. 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="stylesheet" href="https://js.arcgis.com/3.26/esri/css/esri.css">
<style>
  html, body, #map {
    height: 100%;
    padding: 0;
    margin: 0;
  }
</style>
<script src="https://js.arcgis.com/3.26/"></script>
<script src="https://requirejs.org/docs/release/2.3.5/minified/require.js"></script>
<script>
  require(["esri/map", "dojo/domReady!"], function(Map) {
    var map;
    require(["esri/map", "dojo/domReady!"], function(Map) {
      map = new Map("map", {
        basemap: "topo",
        center: [-122.45, 37.75],
        zoom: 13
      });
    });
  });
</script>

<div id="map"></div>

Я попытался установить плагин под названием «Скрипты и стили», который, как предполагается, помогает читать теги <script>,но все равно, он просто отображается как пустой.Это совершенно новая установка Word Press, поэтому я не уверен, что мне нужно что-то еще или мой код просто неправильно настроен.Любые предложения

1 Ответ

0 голосов
/ 15 ноября 2018

Тег <meta> лучше всего добавлять в <head>, как и link (хотя WP уже имеет этот тег области просмотра, так что вы можете его игнорировать).Вы можете добавить остальные на самой странице (в текстовом разделе - не требуется плагин).Я бы порекомендовал создать новый шаблон, см .: WP Templates

Ошибка консоли показывает несколько defines.Я достал, казалось бы, дубликат require, и он прекрасно работает на странице (копировать / вставить): 

<link rel="stylesheet" href="https://js.arcgis.com/3.26/esri/css/esri.css">
<style>
  html, body, #map {
    height: 100%;
    padding: 0;
    margin: 0;
  }
</style>
<script src="https://js.arcgis.com/3.26/"></script>
<script src="https://requirejs.org/docs/release/2.3.5/minified/require.js"></script>
<script>
    var map;
    require(["esri/map", "dojo/domReady!"], function(Map) {
      map = new Map("map", {
        basemap: "topo",
        center: [-122.45, 37.75],
        zoom: 13
      });
    });
</script>

<div id="map"></div>

Пока это работает, я все равно рекомендую поместить его в шаблон.

...