Интеграция объявлений DFP с динамическими DIV и WayPoint

Question

Спасибо за ваше время, чтобы разобраться в этом. У меня есть веб-сайт на базе WordPress и встроенная реклама DFP, ниже приведено то, что у меня есть в теге:

    <script>
        var googletag = googletag || {};
        googletag.cmd = googletag.cmd || [];
    </script>

    <script>
        googletag.cmd.push(function () {
            googletag.pubads().enableSingleRequest();
            googletag.pubads().disableInitialLoad();
            googletag.enableServices();
        });
    </script>

Для добавления новых баннеров у меня есть собственный плагин, в который я добавляю рекламный код DFP, как показано ниже:

 googletag.cmd.push(function () {
    var slot = googletag.defineSlot('/MY_CHANNEL_ID/HP_EN_DESK_300x600', [300, 600], slotName).addService(googletag.pubads());
    googletag.display(slotName);
    googletag.pubads().refresh([slot]);
 });

Для отображения разных форматов объявлений на разных позициях у меня есть функция, которая динамически создает DIV с уникальным идентификатором и добавляет в него JS-код, как показано ниже:

 $banner = attach_dfp_js(get_field('code', $banner_id), $banner_unique_id);

Эта функция attach_dfp_js (); в основном создает новый слой (DIV) на основе рекламного кода и добавляет к нему javascript, ниже приведен его код:

 function attach_dfp_js($slot, $el_id) {
     $js_code = '<script>'
        . 'jQuery(document).ready(function ($) {var id = $("#page-wrapper").data("adscounter");$("#page-wrapper").data("adscounter",id+1);console.log(id);'
        . 'el = document.createElement("div");'
        . 'el.setAttribute("id", "ads"+id);'
        . '$("#' . $el_id . '").append(el);'
        . 'var waypoint' . $el_id . ' = new Waypoint({'
        . 'element: document.getElementById("' . $el_id . '"),'
        . 'handler: function(direction) {'
        . 'window["slotName" + id] = "ads"+id;'
        . str_replace('slotName', 'window["slotName" + id] ', $slot)
        . 'console.log("ok "+id);this.destroy();'          
        . '},offset: "bottom-in-view"});'
        . '});';
     $js_code .= '</script>';
     return $js_code;
 } 

и я добавил файл GTP js в нижний колонтитул непосредственно перед закрывающим тегом тела.

 <script async='async' src='https://www.googletagservices.com/tag/js/gpt.js'></script>

Я не вижу никаких ошибок, баннеры, которые находятся в InView (выше сгиба), загружаются отлично, как только я прокручиваю вниз, я также вижу текст "Ok + id" в консоли, что означает WayPoint работает отлично, и как только он достигает точки прокрутки, он отображает сообщение в консоли.

Теперь проблема в том, что я вижу только первые 2-3 объявления, третье фактически загружается динамически и создает iFrame во вновь созданном DIV, однако все остальные показанные ниже объявления могут видеть только созданные DIV, добавлены JS, но объявление iFrame не отображается, ниже генерируется код одного объявления:

    <div id="5c9d086a24afb" class="abc">
        <script>
            jQuery(document).ready(function ($) {var id = $("#page-wrapper").data("adscounter");$("#page-wrapper").data("adscounter",id+1);console.log(id);el = document.createElement("div");el.setAttribute("id", "ads"+id);$("#5c9d086a24afb").append(el);var waypoint5c9d086a24afb = new Waypoint({element: document.getElementById("5c9d086a24afb"),handler: function(direction) {window["slotName" + id] = "ads"+id;googletag.cmd.push(function () {
            var slot = googletag.defineSlot('/MY_CHANNEL_ID/HP_EN_DESK_300x600', [300, 600], window["slotName" + id] ).addService(googletag.pubads());
            googletag.display(window["slotName" + id] );
            googletag.pubads().refresh([slot]);
            });console.log("ok "+id);this.destroy();},offset: "bottom-in-view"});});
        </script>
        <div id="ads4" data-google-query-id="CObukcmypeECFWNjFQgdcUYFXw">
            <div id="google_ads_iframe_/MY_CHANNEL_ID/HP_EN_DESK_300x600_1__container__" style="border: 0pt none; width: 300px; height: 600px;"></div>
        </div>
    </div>

Самое странное, если я прокручиваю страницу вниз (конец страницы - нижний колонтитул) и нажимаю кнопку Обновить (F5 - Перезагрузить), в Firefox она загружает страницу в том же месте и показывает все объявления отлично. загружен. Но если страница не прокручивается вниз, и я обновляю / перезагружаю страницу, она загружает только первые 3 баннера, как обычно. Я потратил много времени, пытаясь использовать разные методы, но не повезло, моя кампания ограничена несколькими местоположениями, поэтому я не могу поделиться URL-адресом, поскольку объявления не будут загружаться в вашем месте. Буду признателен, если кто-нибудь укажет, что именно может быть не так.

Я также пытался загрузить файл gpt.js в тег, который не работал, а затем попытался использовать jQuery для загрузки файла gpt.js после загрузки всего содержимого страницы, но при этом все равно. Спасибо за чтение.