Problems, need help? Have a tip or advice? Post it here.
3 posts Page 1 of 1
Hi all,

I built a website with Couch a couple of years ago, and my client (a French engineering company) is very happy with it still. The day-to-day maintenance is easy, and he's been able to train a number of different people to use Couch, with no issues. The site is here :

http://www.study-technologies.com/en/

He has come back to me now, asking if there was a way of integrating a video player and provisioning it with clips via the admin interface. He has taken his inspiration from this site (scroll down slightly, to the blue section) :

http://www.ikosconsulting.com/en/

Can anyone point me in the direction of something similar working in Couch? I'll be honest : at this point I'm not sure how to do this, or even if it is possible. Any help and/or advice most welcome!

Thanks,
Ric
Hi Ric,

That should hardly be a problem.

If you can implement that in plain HTML, retrofitting Couch to it remains the same as with everything else.
The sample site you mentioned is showing YouTube videos as a <LI> list - you can use repeatable-regions to capture each video's URL or ID (each row holding one video) and output the desired HTML.

If the videos happen to be hosted on the client's server, you may use type 'file' editable region as repeatable instead.

Hope this helps.
I saw that you have used bootstrap in your design. Keeping that in mind I have done the following:

Run the following code as an independent template:
Code: Select all
<?php require_once( 'couch/cms.php' ); ?>
<cms:template title='Bootstrap - Video Carousel' parent='_video_' order='1' clonable='1' >
    <cms:editable name='youtube_id' label='YouTube Video ID' type='text' />
</cms:template>
<html>
    <head>
        <link rel="stylesheet" href="en/assets/css/bootstrap.css" type="text/css" />
        <style>
            .carousel-inner > .item > iframe,
            .carousel-inner > .item > a > iframe {
                display: block;
                max-width: 100%;
                height: 450px;
            }
            .carousel-inner > .item > iframe,
            .carousel-inner > .item > a > iframe {
                line-height: 1;
            }
        </style>
    </head>
    <body>
        <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
            <ol class="carousel-indicators">
                <cms:pages masterpage='video-carousel/index.php'>
                <li data-target="#carousel-example-generic" data-slide-to="<cms:show k_count />" class="<cms:if k_count=='1'>active</cms:if>"></li>
                </cms:pages>
            </ol>
            <div class="carousel-inner" role="listbox">
                <cms:pages masterpage='video-carousel/index.php'>
                <cms:if k_count=='1'>
                <div class="item active">
                <cms:else />
                <div class="item">
                </cms:if>
                    <iframe width="100%" height="450px" src="//www.youtube.com/embed/<cms:show youtube_id />" frameborder="0" allowfullscreen></iframe>
                    <div class="carousel-caption">
                        <cms:show k_page_title />
                    </div>
                </div>
                </cms:pages>
            </div>
            <!-- Controls -->
            <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                <span class="sr-only">Previous</span>
            </a>
            <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                <span class="sr-only">Next</span>
            </a>
        </div>

        <script src="en/assets/js/jquery-2.5.5.js" type="text/javascript"></script>
        <script src="en/assets/js/bootstrap.js" type="text/javascript"></script>
    </body>
</html>
<?php COUCH::invoke(); ?>


Feel free to ask about anything you feel is not understandable.

Regards,
GenXCoders
Image
where innovation meets technology
3 posts Page 1 of 1
cron