Forum

Thread tagged as: Question, Problem, Suggestions

Repeating Regions with Bootstraps Carousel

I would like to create a repeating region from the code below:


<div class="item active">
    <div class="carousel-span"></div>
    <div class="carousel-caption">
        <?php perch_content('Neuigkeiten 1'); ?>
    </div>
</div>

<div class="item">
    <div class="carousel-span"></div>
    <div class="carousel-caption">
        <?php perch_content('Neuigkeiten 2'); ?>
    </div>
</div>

<div class="item">
    <div class="carousel-span"></div>
    <div class="carousel-caption">
        <?php perch_content('Neuigkeiten 3'); ?>
    </div>
</div>

Unfortunately, the very first item has a extra class of "active". So how could I turn this in to a repeating region?
Andreas Gücklhorn

Andreas Gücklhorn 0 points

  • 6 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

6 years ago

You can test for the first item with

<perch:if exists="perch_item_first">
    class="active"
</perch:if>
Andreas Gücklhorn

Andreas Gücklhorn 0 points

6 years ago

This method won't work, because the "active" class jumps dynamically thru every slide. Anyway, I'm fine with the three different perch_contents ...
Drew McLellan

Drew McLellan 2638 points
Perch Support

6 years ago

That's done with JavaScript once the page has loaded, though, isn't it?
Andreas Gücklhorn

Andreas Gücklhorn 0 points

6 years ago

Yes, its a Bootstrap thing
Andreas Gücklhorn

Andreas Gücklhorn 0 points

6 years ago

... or is there an workaround to display all three perch_contents on one site in the admin panel?
Drew McLellan

Drew McLellan 2638 points
Perch Support

6 years ago

So you should be able to have this template, for a multiple item region:

<div class="item<perch:if exists="perch_item_first"> active</perch:if>">
    <div class="carousel-span"></div>
    <div class="carousel-caption">
        ... <perch:content /> tags here ...
    </div>
</div>
Andreas Gücklhorn

Andreas Gücklhorn 0 points

6 years ago

YOU ARE THE MAN! :)