Импорт кода из CodePen в Tilda — как?

Question

[Alex]

Салют, комрадс!

Есть эффект в CodePen: https://codepen.io/zadvorsky/pen/PNXbGo
Как его добавить в Тильду, применив на определенном блоке или shape?
Я понимаю, что нужно делать append, но почему-то у меня не работает код, хотя ID совпадают.
Создал Нулевой блок, добавил туда shape. Скопировал код из раздела JS в CodePen и вставил его в блок-HTML в самой Тильде, обрамив тегом "скрипт", выше, в этом же блоке создал вот это:

<script>
    $(".tn-elem__2381583471602451581454 .tn-atom").append("<canvas id='three-container'></canvas>");
</script>

И в итоге - ничегошеньки. Прошу помочь знающих людей. Заранее благодарю.

Answer 1

[Павел Корнилов]

Так вы же вставляете пустой контейнер canvas. В итоге у Вас он и будет вставлен, но без содержимого.

Нужно примерно так: https://codepen.io/KorniloFF/pen/oNLXMBx

В 4 строке скрипта есть

var selector= '.tn-elem__2381583471602451581454.tn-atom';

- проверяете свой селектор, в который нужно вставить работу скрипта, при необходимости -- корректируете под свои нужды.

Копируете стили и скрипт, перед этим не забываете подключить библиотеки. И никаких аппендов.

Comments

[Alex]

Огромное спасибо!

[Павел Корнилов]

Alex, на здоровье!

[endreevart]

Павел Корнилов, то есть так можно что угодно интегрировать из codpen’a ?