Как вставить форму от amoCRM и убрать кеширование?

Question

[Евгений Осипов]

В карточку товара в template.php пытаюсь добавить код от amoCRM который выводит кнопку и форму iframe в модальном окне:

<script>var amo_forms_params = {"id":XXXXXX,"hash":"XXXXXXXXXXXXXXX","locale":"ru"};</script>
<script id="amoforms_script" async="async" charset="utf-8" src="https://forms.amocrm.ru/forms/assets/js/amoforms.js"></script>

Если добавлять код именно в template.php то форма выводиться один раз, после этого компонент кешируется и iframe пропадает, модальнное окно пропадает.

Если разместить код в component_epilog.php то форма работает.
По дизайну надо разместить в template.php

Как решить эту проблему?
Никто не сталкивался с этим?

Comments

[PetrPo]

На вскидку 2 вариант вижу:
1. Переписать компонент, чтобы кешировались только данные (без html)
2. Оставить форму в component_epilog.php в скрытой div и при загрузке страницы javascript-ом вырезать и вставлять в нужное место

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

UPD
Алексей Емельянов правильно говорит, как-то я не подумал про перенос скриптов в конец страницы
Попробуй добавить data-skip-moving="true"

<script type="text/javascript" data-skip-moving="true">var amo_forms_params = {"id":XXXXXX,"hash":"XXXXXXXXXXXXXXX","locale":"ru"};</script>
<script type="text/javascript" data-skip-moving="true" id="amoforms_script" async="async" charset="utf-8" src="https://forms.amocrm.ru/forms/assets/js/amoforms.js"></script>

Answer 1

[Алексей Емельянов]

А покажите код, как вы встроили в template.php и код html'я, до и после кэширования.

Очень странное поведение, попадание скриптов в кэш никак не должно влиять на них. В настройках главного модуля случайно не стоит переносить все скрипты в конец страницы?

Comments

[Евгений Осипов]

Перенос скриптов в конец страницы - не включен.
В template.php я добавляю в нужном месте код:

<div style="text-align: center;">
<script>var amo_forms_params = {"id":615862,"hash":"e6b1e9a283dd798f05bcfe13b66cb6c6","locale":"ru"};</script>
<script id="amoforms_script" async="async" charset="utf-8" src="https://forms.amocrm.ru/forms/assets/js/amoforms.js"></script>
</div>

Вставляю его верно, не в зону действия PHP кода.
Когда смотришь под админом то всё работает, т.к. там не кеширует.

Данный код выдает это в месте вставки (выводит кнопку):

<div style="text-align: center;">
<script>var amo_forms_params = {"id":00000,"hash":"000000000000000000000000","locale":"ru"};</script>
<button style="box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 0px; display: inline-block; font-family: Tahoma, Arial, sans-serif; padding: 0px 33px; border-radius: 3px; height: 52px; border: none; outline: none; cursor: pointer; text-transform: none; font-weight: 400; margin: 0px 0px 15px; font-size: 15px; color: rgb(255, 255, 255); background-color: rgb(39, 60, 113);" id="amoforms_action_btn">Задать вопрос по продукции</button><script id="amoforms_script" async="async" charset="utf-8" src="https://forms.amocrm.ru/forms/assets/js/amoforms.js"></script>
</div>

Так же в подвале появляется iframe

<div id="amoforms_overlay" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; background: rgba(0, 0, 0, 0.7); overflow: auto; opacity: 1; display: block; z-index: 99999;"><iframe id="amoforms_iframe_00000000" class="amoforms_iframe" name="amoforms_iframe_00000000" allowtransparency="" scrolling="no" frameborder="0" style="width: 540px; position: inherit; top: 50%; left: 50%; transform: translateX(-50%); overflow: visible; margin-top: -462.5px; padding: 0px; border: none; height: 875px; opacity: 1;" src="https://forms.amocrm.ru/forms/html/form_00000000.html?date=00000000#{&quot;user_origin&quot;:{&quot;datetime&quot;:&quot;Wed Jul 22 2020 13:26:46 GMT+0300 (Москва, стандартное время)&quot;,&quot;referer&quot;:&quot;&quot;},&quot;is_modal&quot;:true,&quot;success_message&quot;:&quot;00000000.&quot;,&quot;is_dark_bg&quot;:false,&quot;utm&quot;:{&quot;source&quot;:&quot;&quot;,&quot;medium&quot;:&quot;&quot;,&quot;content&quot;:&quot;&quot;,&quot;campaign&quot;:&quot;&quot;,&quot;term&quot;:&quot;&quot;},&quot;ga&quot;:{},&quot;location&quot;:&quot;https://site.com/&quot;,&quot;dp&quot;:{}}"></iframe></div>

Так всё работает.

Но, если смотреть сайт под клиентом, то вместо кнопки только код без кнопки:

<div style="text-align: center;">
<script>var amo_forms_params = {"id":615862,"hash":"e6b1e9a283dd798f05bcfe13b66cb6c6","locale":"ru"};</script>
<script id="amoforms_script" async="async" charset="utf-8" src="https://forms.amocrm.ru/forms/assets/js/amoforms.js"></script>
</div>

Внизу нет нужного iframe

[Евгений Осипов]

Посмотрел код, то что я добавляю находится внутри кода:

<?
$frame = $this->createFrame('info')->begin('');
$frame->setAnimation(true);
?>

код

<?$frame->end();?>