I am trying to get a slideshow that has a video as the first slide and images as the other slides working with couchcms, I've looked on google and came up with the following coding from what I have seen in similar posts but the HTML is not right and can't work this one out, the coding I have is below. I thought I would try and get it working on a cms demo site first before putting it on the clients site
The HTML in the source code is below
The url is https://www.beechwoodsolutions.co.uk/si ... w-page.php
- Code: Select all
<cms:template title='Slideshow Page' order='10'>
<cms:repeatable name='content_slides' >
<cms:editable type='image' name='my_image' label='Photo' />
<cms:editable type='text' name='youtube_id' label='Youtube Video ID' />
<cms:editable type='text' name='my_heading' label='heading' />
<cms:editable type='textarea' name='my_caption' label='description' />
<cms:editable type='text' name='my_link' label='button text' />
</cms:repeatable>
</cms:template>
<div id="MiddleCarousel" class="carousel slide UACarousel" data-ride="carousel">
<div class="carousel-inner">
<cms:show_repeatable 'content_slides'>
<cms:if k_count=='1'>
<cms:if "<cms:not_empty youtube_id />" >
<div class="carousel-item active">
<cms:else />
<div class="carousel-item">
<iframe width="100%" src="//www.youtube.com/embed/<cms:show youtube_id />" frameborder="0" id="video" allowfullscreen></iframe>
</cms:if>
</cms:if>
<cms:else />
<img class="d-block w-100" src="<cms:show my_image />" alt="" />
<div class="carousel-caption">
<h4 class=""><cms:show my_heading /></h4>
<p class="">
<cms:show my_caption />
</p>
<a class="button readmore" href="<cms:show my_link/>"><span class="buttontext"><cms:show my_link/></span></a>
</div>
</div>
</cms:show_repeatable>
</div>
<a class="carousel-control-prev" href="#MiddleCarousel" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#MiddleCarousel" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
The HTML in the source code is below
- Code: Select all
<div id="MiddleCarousel" class="carousel slide UACarousel" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-100" src="" alt="" />
<div class="carousel-caption">
<h4 class=""></h4>
<p class="">
</p>
<a class="button readmore" href=""><span class="buttontext"></span></a>
</div>
</div>
<img class="d-block w-100" src="https://www.beechwoodsolutions.co.uk/sites/cmsdemo/cms/uploads/image/cleaning-banner-1.jpg" alt="" />
<div class="carousel-caption">
<h4 class=""></h4>
<p class="">
</p>
<a class="button readmore" href=""><span class="buttontext"></span></a>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#MiddleCarousel" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#MiddleCarousel" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
</div>
The url is https://www.beechwoodsolutions.co.uk/si ... w-page.php