Forum

Thread tagged as: Question, Problem, Suggestions

Slider Issue

I'm not sure which is the best way to do the following, so any help would be appreciated.

I have a slider that has 2 parts and i want it to be as easy as pos for the cline tot be able to add new items. There's a date slider that controls the made slider... anyway here's the code


<div id="slider"> <ul id="history"> <li><a href="javascript:mD(1)" class="a" id="h1">1991</a></li> <li><a href="javascript:mD(2)" id="h2">1992</a></li> </ul> </div> <div class="container wrap"> <div class="detail" id="d1"> <div class="history-img"> <img src="image.jpg"> </div> <div class="history-txt"> <p>Text</p> </div> </div> <div class="detail" id="d2"> <div class="history-img"> <img src="image.jpg"> </div> <div class="history-txt"> <p>Text</p> </div> </div> </div>
Stephen Wild

Stephen Wild 3 points

  • 5 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

You need two templates.

Your main template will output the detail for each slide.

Create a second template for just the 'history' section.

In your page, use perch_content_custom() to output the region with the 'history' template. Then after that output the region as normal.

Is there a link you can send me Drew as I have never shared data between templates before.

There is also an item number requirement, can that be share across template

Drew McLellan

Drew McLellan 2638 points
Perch Support

Which part are you unsure of?

If I'm correct... for the main content its business as usual... standard perch

<?php perch_content('History); ?>

and in that template...

<li>
<perch:content id="perch_item_index" type="hidden" />
<perch:content id="date" type="text" label="Date"  />
<perch:content id="text" type="textarea" label="Text"  />
</li>

I'm not sure how to pull out the data from this main content, by using perch custom.

???

<?php
  perch_content_custom('History', array(
    'template'=>'history.html',
  ));
?>
Drew McLellan

Drew McLellan 2638 points
Perch Support

Right, that's it. You're just displaying the same region using a different template.

Simon Clay

Simon Clay 127 points

Hi Stephen, I've been looking at the initial code you want to achieve and I think this is one way to do it:

Your Main 'history.html' template:

<perch:before>
    <div class="container wrap">
</perch:before>
        <div class="detail" id="d<perch:content id="perch_item_index" type="hidden" />">
            <div class="history-img">
                <img src="<perch:content type="image" id="image" label="Image" width="750" />">
            </div>
            <div class="history-txt">
                <perch:content id="text" type="textarea" label="Text"  />                                    
            </div>
        </div>
<perch:after>
    </div>
</perch:after>

<perch:content id="date" type="text" label="Date" suppress="true"  />

Your custom '_date.html' template:

<perch:before>
<div id="slider">
    <ul id="history">            
</perch:before>
         <li><a href="javascript:mD(<perch:content id="perch_item_index" />)" class="a" id="h<perch:content id="perch_item_index" />"><perch:content id="date" type="text" label="Date" /></a></li>                     
<perch:after>
    </ul>
</div>
</perch:after>

And in your page:

<?php
  perch_content_custom('History', array(
    'template'=>'_date.html',
  )); 

  perch_content('History); 
?>

Thanks Simon, that works perfectly! I'm really grateful that you found the time to help me out with this issue, I have used perch for over 5 years but I guess generally i don't use its more advanced features.

See it working here: https://www. link removed .com I'll remove the this link in a few hours.

Thanks Again.

Simon Clay

Simon Clay 127 points

Thanks Stephen, that looks really nice! I am glad I was able to help.