<div class="rich-media-atom" data-module="richMediaAtom" data-isYouTube="true" data-videoid="398IVitaZoY"> <div class="rich-media-atom__inner js-atom-inner"> <div class="rich-media-atom__image"> <figure class="image js-image " data-module="imagelazy" data-is-small-image=""> <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1543748624-61a84917186f?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;100&amp;q&#x3D;10" alt="Alt Text"> <picture class="image__container"> <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1543748624-61a84917186f?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;640&amp;q&#x3D;80" /> <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1543748624-61a84917186f?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;2100&amp;q&#x3D;80" /> <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1543748624-61a84917186f?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;2100&amp;q&#x3D;80" /> <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1543748624-61a84917186f?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;2100&amp;q&#x3D;80" /> <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="Alt Text"> </picture> </figure> </div> <div class="rich-media-atom__image-overlay js-image-overlay"></div> <div class="rich-media-atom__content"> <p class="rich-media-atom__title js-title">A guide to Galway</p> <p class="rich-media-atom__subtitle js-subtitle">Georgia, Galway tour guide</p> </div> <button class="rich-media-atom__button js-button" aria-label="A guide to Galway"> <div class="rich-media-atom__icon rich-media-atom__icon--play"></div> </button> </div> <div class="rich-media-atom__modal js-modal"> <div class="rich-media-atom__modal-inner"> <a href="#" class="rich-media-atom__modal-close js-modal-close rich-media-atom__modal-close--youtube" aria-label="Close"></a> <div class="video" data-youtube-video="true" data-autoplay="false" data-hide-controls="false" data-loop="false" data-muted="false" data-ratio=""> <template class="js-youtube-template"> <iframe src="https://www.youtube-nocookie.com/embed/398IVitaZoY?playsinline=1&amp;showinfo=0&amp;rel=0&amp;enablejsapi=1" allowfullscreen allowtransparency allow="autoplay"></iframe> </template> <div class="js-video-container video__container" data-poster-url="https://via.placeholder.com/1600x900.png"> <div class="video__player js-video-player"></div> </div> </div> </div> </div> </div>
<div class="rich-media-atom" data-module="richMediaAtom" data-isYouTube="{{fullVideo.isYouTube}}" {{#if isInsideTransform}}data-isInsideTransform="true"{{/if}} {{#if fullVideo.isYouTube}}data-videoid="{{fullVideo.video.videoId}}"{{/if}}> <div class="rich-media-atom__inner js-atom-inner"> {{#if backgroundResponsiveImage}} <div class="rich-media-atom__image"> {{> @cp-medium-image backgroundResponsiveImage}} </div> {{/if}} <div class="rich-media-atom__image-overlay js-image-overlay"></div> <div class="rich-media-atom__content"> <p class="rich-media-atom__title js-title">{{title}}</p> <p class="rich-media-atom__subtitle js-subtitle">{{subtitle}}</p> </div> <button class="rich-media-atom__button js-button" aria-label="{{title}}"> <div class="rich-media-atom__icon{{#unless is360Video}} rich-media-atom__icon--play{{/unless}}"></div> </button> </div> {{#if fullVideo}} <div class="rich-media-atom__modal js-modal"> <div class="rich-media-atom__modal-inner"> <a href="#" class="rich-media-atom__modal-close js-modal-close {{#if fullVideo.isYouTube}} rich-media-atom__modal-close--youtube{{/if}}" aria-label="Close"></a> {{> @cp-medium-video doNotInitialise=true isYouTube=fullVideo.isYouTube isYouku=fullVideo.isYouku video=fullVideo.video autoplay=false hideControls=false loop=false muted=false }} </div> </div> {{/if}} </div>
{ "is360Video": false, "title": "A guide to Galway", "subtitle": "Georgia, Galway tour guide", "backgroundResponsiveImage": { "altText": "Alt Text", "lowResolutionUrl": "https://images.unsplash.com/photo-1543748624-61a84917186f?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-1543748624-61a84917186f?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80", "smallUrl": "https://images.unsplash.com/photo-1543748624-61a84917186f?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=640&q=80" } ] }, "fullVideo": { "isYouTube": true, "video": { "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": "https://file-examples-com.github.io/uploads/2017/04/file_example_MP4_480_1_5MG.mp4" }, { "type": "video/mp4", "url": "https://file-examples-com.github.io/uploads/2017/04/file_example_MP4_480_1_5MG.mp4" } ], "posterUrl": "https://via.placeholder.com/1600x900.png", "captions": [ { "language": "English", "languageCode": "en", "url": "/media/porthole-tabber/porthole_experience-brand-hero_IAE_V2-en.vtt" }, { "language": "German", "languageCode": "de", "url": "/media/porthole-tabber/porthole_experience-brand-hero_IAE_V2-de.vtt" } ], "videoId": "398IVitaZoY" }, "isYouku": false } }

There are no notes for this item.