Glorious Cat

В данном случае вы забыли добавить url("").

document.getElementById('idpost').style.background =  'url(<?= the_post_thumbnail_url() ?>)';

Написать в ручную на CSS с помощью transform и CSS-анимаций. Или использовать библиотеку https://daneden.github.io/animate.css/

Вот ссылка: https://css-tricks.com/snippets/css/css-triangle/

Можно использовать https://webref.ru/html/iframe или ручками делать скриншоты.

В background есть возможность задать сразу несколько фоновых изображений. В вашем примере думаю лучше будет сделать так: круги в svg, квадрокоптер соответственно картинкой. Есть ещё такая особенность свойства background, чем "позднее" задан фон тем он ниже будет.

https://codepen.io/anon/pen/EEOrqe

Вам нужно указать относительные пути до файлов. Почитайте.

Попробуйте Slick.js