Credibility Tout: With Video Default 16 X 9

<div class="credibility-tout " data-module="credibilityTout"> <div class="grid-container credibility-tout__grid-container"> <div class="grid-x"> <div class="cell credibility-tout__cell"> <div class="credibility-tout__container"> <div class="credibility-tout__media-container credibility-tout__media-container--half-width"> <div class=" credibility-tout__16-9-container"> <div class="video " data-module="video" data-autoplay="" data-hide-controls="true" data-loop="" data-muted=""> <template class="js-small-video-template"> <div class="js-video-container video__container"> <video playsinline class="video__player js-video-player"> </video> </div> </template> <template class="js-medium-video-template"> <div class="js-video-container video__container"> <video playsinline class="video__player js-video-player"> </video> </div> </template> <div class="js-video-container video__container"></div> </div> </div> </div> <div class="credibility-tout__content-container"> <q class="credibility-tout__quote">Dublin remains one of Europe’s down to earth and friendliest cities.</q> <cite class="credibility-tout__author">Lonely Planet Best in Travel 2022</cite> </div> </div> </div> </div> </div> </div>
<div class="credibility-tout {{#if paddingTop}}{{paddingTop}}{{/if}} {{#if paddingBottom}}{{paddingBottom}}{{/if}}" data-module="credibilityTout"> <div class="grid-container credibility-tout__grid-container"> <div class="grid-x"> <div class="cell credibility-tout__cell"> <div class="credibility-tout__container"> <div class="credibility-tout__media-container {{#if video}}credibility-tout__media-container--half-width{{/if}}"> {{#if video}} <div class="{{#if 9x16}}credibility-tout__9-16-container {{else}} credibility-tout__16-9-container{{/if}}"> {{> @cp-medium-video video}} </div> {{else}} {{> @cp-medium-image image}} {{/if}} </div> <div class="credibility-tout__content-container"> <q class="credibility-tout__quote">{{quote}}</q> <cite class="credibility-tout__author">{{author}}</cite> </div> </div> </div> </div> </div> </div>
{ "image": { "altText": "Alt Text", "orginalSize": true, "lowResolutionUrl": "https://images.unsplash.com/photo-1536954393774-b247f795fda7?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=100&q=10", "sources": [ { "type": "image/jpeg", "largeUrl": "https://images.unsplash.com/photo-1536954393774-b247f795fda7?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80", "smallUrl": "https://images.unsplash.com/photo-1536954393774-b247f795fda7?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=640&q=80" } ] }, "quote": "Dublin remains one of Europe’s down to earth and friendliest cities.", "author": "Lonely Planet Best in Travel 2022", "video": { "hideControls": true, "videoUrls": [ { "type": "video/webm", "url": "http://techslides.com/demos/sample-videos/small.webm" }, { "type": "video/mp4", "url": "http://techslides.com/demos/sample-videos/small.mp4" } ], "mobileVideoUrls": [ { "type": "video/mp4", "url": "http://techslides.com/demos/sample-videos/small.mp4" } ], "posterUrl": "https://via.placeholder.com/1600x900.png" } }

There are no notes for this item.