Вывод обновляемой информации из jquery на wordpress сайт?

Question

[Reaktiv4]

Здравствуйте. Есть jquery код который выводит информацию о играющей на радио в данный момент песни:

var nowPlayingTimeout;
var nowPlaying;

function loadNowPlaying() {
    $.ajax({
        cache: false,
        dataType: "json",
        url: 'http://sait.com/api/nowplaying/station_shortcode',
        success: function(np) {
            // Do something with the Now Playing data.
            nowPlaying = np;

            nowPlayingTimeout = setTimeout(loadNowPlaying, 15000);
        }
    }).fail(function() {
        nowPlayingTimeout = setTimeout(loadNowPlaying, 30000);
    });
}

$(function() {
    loadNowPlaying();
});

Каким образом можно вывести эту информацию на wordpress сайте, чтобы при этом информация автоматически менялась при переключении песни на следующую? Если возможно покажите пример кода.

Answer 1

[Арсений Матыцин]

Вопрос не имеет никакого отношения к WP.

Тебе надо зацепится за какой-то элемент по классу и менять в нем информацию с помощью, скажем innerHTML.

А вот уже касаемо WP ты можешь в шаблонах сформировать тег с классом, куда будешь писать ручками. Или виджетом html вывести (это из коробки тоже есть).

Что же писать, зависит исключительно от того, что приходит в твою переменную np из api.

Answer 2

[drawnofmymind]

$(".your-class").append("<p>"+nowPlaying+"</p>");

Answer 3

[Reaktiv4]

Добавил в конце скрипта проверенную строку -

$('#nowplaying-song').text(np.now_playing.song.text);

добавил в стили -

#nowplaying-song {
  width: 200px;
  height: 200px;
  border: 1px solid black;
  padding: 2px 4px;
  overflow-y: scroll;
  overflow-x: auto;
  margin-top: 8px;
  font-family: monospace;
}

добавил в страницу сайта -
<div id="nowplaying-song"></div>
Информация не выводится... Не могу понять, чего не хватает или что неправильно делаю. Скрипт рабочий и должна выводиться информация о играющей песни и исполнителе. Помогите, пожалуйста.