Forum for discussing general topics related to Couch.
5 posts Page 1 of 1
This is the section I really need to implement as repeatable, I have tried and sadly failed, any help would be very mush appreciated. I just cannot seem to get a repeatable section to work, I know I am doing something really stupid, but seem to have hit a mental block

Also where do I initially declare the Repeatable area, it is in the header?

Code: Select all
<li>
<div class="story-img"><img src="./INBAF About Us_files/JimC.png"></div>
<div class="story-box">
<h4>Jim Curran</h4>
<p>Jim Curran is treasurer of INBAF. He is a Braille Tutor for the Birmingham Braille Course in Ireland and one of the co-authors of the New Birmingham Braille Course. He was Industrial Supervisor of the Braille Unit in Arbour Hill Prison since 2004 where he also taught Braille and was responsible for the transcription of books and information documents for commercial businesses and all government departments. He currently works for the NBP in ChildVisiond</p>
</div>
</li>


I can change the HTML tags if necessary

Please any help would be much appreciated . . .
Hi,

The repeatable regions need to be defined within the <cms:template> block of your template (usually placed at the top of the template just below the mandatory PHP opening statement of Couch). This template block may also contain definitions for other editable regions used by the template.

Your HTML is as follows where, obviously, we need the <LI> block to repeat. -
Code: Select all
<ul>
    <li>
        <div class="story-img"><img src="./INBAF About Us_files/JimC.png"></div>
        <div class="story-box">
            <h4>Jim Curran</h4>
            <p>Jim Curran is treasurer of INBAF. He ...</p>
        </div>
     </li>
</ul>

Looking at the code above we can see that it requires three editable region - 1. image 2. caption 3. description
To handle those, we define the following repeatable region (if your template already contains a <cms:template> block, please do not create another one - just copy the <cms:repeatable> block from below to within that block) -
Code: Select all
<cms:template>

    .. your other editable regions could be defined here ..
   
    <cms:repeatable name='my_stories' label='Stories' desc='Images of max 2000px width'>
        <cms:editable name='my_image' label='Image: (w:2000px)' type='image' width='2000' enforce_max='1' show_preview='1' quality='100' preview_width='200' input_width='250' />
        <cms:editable name='my_caption' label='Caption' type='text' /> 
        <cms:editable name='my_text' label='Text' type='textarea' height='80' />
    </cms:repeatable>
   
</cms:template>

And now, we can use the defined regions to repeat the <LI> elements as follows -
Code: Select all
<ul>
    <cms:show_repeatable 'my_stories' >
    <li>
        <div class="story-img"><img src="<cms:show my_image />"></div>
        <div class="story-box">
            <h4><cms:show my_caption /></h4>
            <p><cms:show my_text /></p>
        </div>
     </li>
     </cms:show_repeatable>
</ul>

I can change the HTML tags if necessary
Couch retrofits into any existing HTML markup, so that won't be required :)

Hope this helps.
Many thanks for explaining how to do that and indeed roe a really prompt reply, I will get on it straight away!

Now that I will be able to manage repeatable regions, I do have just one more question

I have another area I will make repeatable, is there a way to count where each repeatable item is in the list, so that I can apply a style to every second item

I thought of using the CouchCMS if else Statement, but is there a variable I can use to count each repeatable region and what would the syntax be for: if Var == 0 or Var % 2 == 0

Once again KK Many thanks for the help!
You are welcome :)

You can output the style the way you proposed but Couch has a much easier alternative method for this very purpose - the <cms:zebra /> tag You can find the details here - http://docs.couchcms.com/tags-reference/zebra.html

Hope it helps.
Thanks KK, I really need to sit down for the weekend and read the documentation . . .
5 posts Page 1 of 1
cron