Smarty Forum Index Smarty
WARNING: All discussion is moving to https://reddit.com/r/smarty, please go there! This forum will be closing soon.
  www.smarty.net   •  phpinsider.com  •  Forum Index  •  FAQ  •  Search  •  Memberlist  •  Profile  •  Log in to check your private messages  •  Register  •  Log in
Bootstrap Carousel Slider With Smarty Template Engine

 
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    Smarty Forum Index -> General
View previous topic :: View next topic  
Author Message
rojava
Smarty n00b


Joined: 18 Aug 2016
Posts: 3
PostPosted: Thu Aug 18, 2016 8:14 am    Post subject: Bootstrap Carousel Slider With Smarty Template Engine Reply with quote
Hallo There,

I want use bootstrap carousel slider with Smarty.
http://v4-alpha.getbootstrap.com/examples/carousel/

Im use Bootstrap 4.0.0 and Smarty 3.0.6

But I have 1 problem...
I can't controle "active" class in
Code:
<div class="carousel-item active">


I request your idea


Code:

<!-- Carousel  -->
{* News *}
{run mod='index' method='_news' extra=array('3')}
{if $news}
{assign var="block_news" value="e" scope="root"}
<div id="myCarousel" class="carousel slide" data-ride="carousel">
    <!-- Indicators -->

    <ol class="carousel-indicators">
 {foreach from=$news item=ro}
        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
        <li data-target="#myCarousel" data-slide-to="1"></li>
        <li data-target="#myCarousel" data-slide-to="2"></li>
{/foreach}
    </ol>

    <div class="carousel-inner" role="listbox">

        {foreach from=$news item=ro}
        <div class="carousel-item active">
            <img class="first-slide" src="{$site.adres}mod_news/thumb/{$ro.image}"
                 alt="{$ro.title}">
            <div class="container">
                <div class="carousel-caption text-xs-left">
                    <h1>{$ro.title}</h1>
                    <p>{$ro.spot}</p>
                    <p><a class="btn btn-lg btn-primary" href="{$ro.url}" title="{$ro.spot}"{if $ro.target neq 'e'}
                          target="_blank" {/if} role="button">Read</a></p>
                </div>
            </div>
        </div>
        {/foreach}

    </div>
    <a class="left carousel-control" href="#myCarousel" 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="#myCarousel" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
    </a>
</div>
{/if}
<!-- /.carousel -->


Last edited by rojava on Mon Oct 10, 2016 2:11 pm; edited 1 time in total
Back to top
View user's profile Send private message
rojava
Smarty n00b


Joined: 18 Aug 2016
Posts: 3
PostPosted: Mon Oct 10, 2016 2:05 pm    Post subject: Reply with quote
Help please

A similar solution is here

http://www.smarty.net/forums/viewtopic.php?p=60336
Back to top
View user's profile Send private message
rojava
Smarty n00b


Joined: 18 Aug 2016
Posts: 3
PostPosted: Sat Oct 15, 2016 4:11 pm    Post subject: Solved Bootstrap 4 Carousel with Smarty Template Reply with quote
Hi!

Here is the solution.

Code:
<!-- Carousel  -->
{* News *}
{run mod='index' method='_news' extra=array('3')}
{if $news}
{assign var="block_news" value="e" scope="root"}
<div id="myCarousel" class="carousel slide" data-ride="carousel">
    <!-- Indicators -->

    <ol class="carousel-indicators">
 {foreach from=$news key=k item=ro}

<li data-target="#myCarousel" data-slide-to="{$k}" {{if $k==0}}class="active"{{/if}}></li>
{/foreach}
    </ol>

    <div class="carousel-inner" role="listbox">

        {foreach from=$news key=k item=ro}
        <div class="carousel-item {{if $k==0}}active{{/if}}">
            <img class="first-slide" src="{$site.adres}mod_news/thumb/{$ro.image}"
                 alt="{$ro.title}">
            <div class="container">
                <div class="carousel-caption text-xs-left">
                    <h1>{$ro.title}</h1>
                    <p>{$ro.spot}</p>
                    <p><a class="btn btn-lg btn-primary" href="{$ro.url}" title="{$ro.spot}"{if $ro.target neq 'e'}
                          target="_blank" {/if} role="button">Read</a></p>
                </div>
            </div>
        </div>
        {/foreach}

    </div>
    <a class="left carousel-control" href="#myCarousel" 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="#myCarousel" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
    </a>
</div>
{/if}
<!-- /.carousel -->


Solved
Back to top
View user's profile Send private message
Display posts from previous:   
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    Smarty Forum Index -> General All times are GMT
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum


Powered by phpBB © 2001, 2005 phpBB Group
Protected by Anti-Spam ACP