Видео в карточку товара
Если ставите видео с dropbox, то в ссылке «www.dropbox.com» необходимо поменять на «dl.dropboxusercontent.com»

<script>
// Support-any-video-hosting script - part 1 of 2
var script = document.querySelector('script[src*="tilda-catalog-1."]');
if (script) {
    script.onload = loadHandler;
}

function loadHandler(){
    if(window.t_store_get_productcard_oneSlide_html) {
        if (String(t_store_get_productcard_oneSlide_html) === `function t_store_get_productcard_oneSlide_html(options,element){var iconColor=options.slider_opts.videoPlayerIconColor||\"#fff\",str=\"\";return str+='<div class=\"t-slds__item [[activeClass]]\" data-slide-index=\"[[index]]\">',str+='    <div class=\"t-slds__wrapper\" itemscope itemtype=\"http://schema.org/ImageObject\">',str+='        <meta itemprop=\"image\" content=\"[[imgsource]]\">',str+='        <div class=\"t-slds__imgwrapper [[zoomClass]]\" [[zoomAttrs]]>',str+='            <div class=\"t-slds__bgimg [[containClass]] t-bgimg [[productClass]]\" data-original=\"[[imgsource]]\" style=\"padding-bottom:[[paddingBottomVal]]; background-image: url(\\'[[imgsource_lazy]]\\');\">',str+=\"            </div>\",str+=\"         </div>\",element.video&&(str+='<div class=\"t-slds__videowrapper\">',str+='<div class=\"t-slds__play_icon\" data-slider-video-url=\"'+element.videoid+'\"  data-slider-video-type=\"'+element.vtype+'\" style=\"width:70px; height: 70px; \">',str+='<svg width=\"70px\" height=\"70px\" viewBox=\"0 0 60 60\">',str+='<g stroke=\"none\" stroke-width=\"1\" fill=\"\" fill-rule=\"evenodd\">',str+='<g transform=\"translate(-691.000000, -3514.000000)\" fill=\"'+iconColor+'\">',str+='<path d=\"M721,3574 C737.568542,3574 751,3560.56854 751,3544 C751,3527.43146 737.568542,3514 721,3514 C704.431458,3514 691,3527.43146 691,3544 C691,3560.56854 704.431458,3574 721,3574 Z M715,3534 L732,3544.5 L715,3555 L715,3534 Z\"></path>',str+=\"</g>\",str+=\"</g>\",str+=\"</svg>\",str+=\"</div>\",str+='<div class=\"t-slds__frame-wrapper\"></div>',str+=\"</div>\"),str+=\"    </div>\",str=(str+=\"</div>\").replace(\"[[zoomAttrs]]\",options.slider_slidesOpts.zoomable?'data-zoom-target=\"[[index]]\" data-zoomable=\"yes\" data-img-zoom-url=\"[[imgsource]]\"':\"\").replace(\"[[zoomClass]]\",options.slider_slidesOpts.zoomable?\"t-zoomable\":\"\").replace(\"[[containClass]]\",\"contain\"===options.slider_slidesOpts.bgsize?\"t-slds__bgimg-contain\":\"\").replace(\"[[paddingBottomVal]]\",100*options.slider_slidesOpts.ratio+\"%\")}`){
            t_store_get_productcard_oneSlide_html = modified_t_store_get_productcard_oneSlide_html;
        } else {
            console.log("Seems like 't_store_get_productcard_oneSlide_html' function was changed. Support-any-video-hosting script needs to be reworked.")
        }
    }
}

function modified_t_store_get_productcard_oneSlide_html(options, element) {
    var iconColor = options.slider_opts.videoPlayerIconColor || "#fff"
        , str = "";
    var videoLink = element.vtype ? "" : element.video;
    return str += '<div class="t-slds__item [[activeClass]]" data-slide-index="[[index]]">',
    str += '    <div class="t-slds__wrapper" itemscope itemtype="http://schema.org/ImageObject">',
    str += '        <meta itemprop="image" content="[[imgsource]]">',
    str += '        <div class="t-slds__imgwrapper [[zoomClass]]" [[zoomAttrs]]>',
    str += '            <div class="t-slds__bgimg [[containClass]] t-bgimg [[productClass]]" data-original="[[imgsource]]" style="padding-bottom:[[paddingBottomVal]]; background-image: url(\'[[imgsource_lazy]]\');">',
    str += "            </div>",
    str += "         </div>",
    element.video && (str += '<div class="t-slds__videowrapper">',
    str += '<div class="t-slds__play_icon" data-slider-video-link="'+ videoLink +'" data-slider-video-url="' + element.videoid + '"  data-slider-video-type="' + element.vtype + '" style="width:70px; height: 70px; ">',
    str += '<svg width="70px" height="70px" viewBox="0 0 60 60">',
    str += '<g stroke="none" stroke-width="1" fill="" fill-rule="evenodd">',
    str += '<g transform="translate(-691.000000, -3514.000000)" fill="' + iconColor + '">',
    str += '<path d="M721,3574 C737.568542,3574 751,3560.56854 751,3544 C751,3527.43146 737.568542,3514 721,3514 C704.431458,3514 691,3527.43146 691,3544 C691,3560.56854 704.431458,3574 721,3574 Z M715,3534 L732,3544.5 L715,3555 L715,3534 Z"></path>',
    str += "</g>",
    str += "</g>",
    str += "</svg>",
    str += "</div>",
    str += '<div class="t-slds__frame-wrapper"></div>',
    str += "</div>"),
    str += "    </div>",
    str = (str += "</div>").replace("[[zoomAttrs]]", options.slider_slidesOpts.zoomable ? 'data-zoom-target="[[index]]" data-zoomable="yes" data-img-zoom-url="[[imgsource]]"' : "").replace("[[zoomClass]]", options.slider_slidesOpts.zoomable ? "t-zoomable" : "").replace("[[containClass]]", "contain" === options.slider_slidesOpts.bgsize ? "t-slds__bgimg-contain" : "").replace("[[paddingBottomVal]]", 100 * options.slider_slidesOpts.ratio + "%")
}
</script>
<script>
// Support-any-video-hosting script - part 2 of 2
window.addEventListener('load', createVideoTagScript);

function createVideoTagScript(){
    var SEL = {
            slidesSelector: ".t-slds__item .t-slds__videowrapper",
            btnSelector: ".t-slds__play_icon",
            videoWrapSelector: ".t-slds__frame-wrapper"
        }
    setTimeout(()=>{
        var slides = document.querySelectorAll(SEL.slidesSelector);
        
        if(slides.length){
            slides.forEach(addEventForGenVideo);
        }
    }, 1000)
    
    
    function addEventForGenVideo(slide){
        var btn = slide.querySelector(SEL.btnSelector);
        
        if(btn.dataset.sliderVideoLink){
            btn.addEventListener('click', addVideoTag)
        }
    }
    
    function addVideoTag(e){
        var wrapper = e.currentTarget.parentElement.querySelector(SEL.videoWrapSelector);
        var videoTag = document.createElement('video');
        videoTag.loop = true;
        videoTag.autoplay = true;
        videoTag.style.height = '100%';
        videoTag.style.width = '100%';
        videoTag.innerHTML = `<source src=${e.currentTarget.dataset.sliderVideoLink}><source src=${e.currentTarget.dataset.sliderVideoLink.slice(0, -3) + "webm"}><p>Ваш браузер не поддерживает тег video :(</p>`;
        wrapper.appendChild(videoTag);
        videoTag.play()
    }
}
</script>

Made on
Tilda