Hey there,

until now I didn't really understand the view of a site and how I can influence it.

Here comes my thing: A customer of mine has a site where he offers jobs. Every job offer is represented in one accordion-tab. Now he wants to be able to add or delete jobs.

Therefore I created a template with one extra variable (beschreibung) besides the title:

<cms:template title='Stellenangebote' clonable='1'>
<cms:editable name='beschreibung' label='beschreibung' type='richtext' />
</cms:template>

and added the following code into my accordion

<div class="acc-container">
<div class="acc-btn"><h1><cms:show k_page_title /></h1></div>
<div class="acc-content">
<div class="acc-content-inner"><p><cms:show beschreibung /></p>
</div>
</div>
</div>


Now I want that all the jobs are listed when a user vists that site jobs.php.

Any help would be much appreciated. I own a licence for the site. Thanks!

Best regards,

Pierre

You would need to list the pages, for example:

Code: Select all

<cms:pages masterpage="example.php">

<div class="acc-container">
<div class="acc-btn"><h1><cms:show k_page_title /></h1></div>
<div class="acc-content">
<div class="acc-content-inner"><p><cms:show beschreibung /></p>
</div>
</div>
</div>
</cms:pages>

fill in the template link instead of 'example.php'

Hi Saskia. Thanks for your reply.

It doesn't really do the job. The first accordion-element, the one on top, has round edges (see attachment) . Now I have two with round edges. Is it really necessary that I resolve this with multiple pages? It seems so inconvenient. All I want is a div that includes as many nested div's as the user needs and creates therefore.

I tried with "repeatable regions" but no success. It didn't show anything.

Thanks,

Pierre

Hi Pierre,

In couch there are (for as far as I know) two ways to create an unlimited amount of data-sets. One of them is 'repeatable regions' which are defined within one page, the other are 'pages'. Which one you use depends on the type of data, if it makes sense to build your backend that way.

We can fix the round corners problem quite easily:

Code: Select all

<cms:pages masterpage="example.php">
<cms:if k_count='1'>
<div class="acc-container round-corners-top">
<cms:else/>
<div class="acc-container square-corners">
</cms:if>
<div class="acc-btn"><h1><cms:show k_page_title /></h1></div>
<div class="acc-content">
<div class="acc-content-inner"><p><cms:show beschreibung /></p>
</div>
</div>
</div>
</cms:pages>

To use this one with repeated regions:

Code: Select all

<cms:repeatable name='jobs' >
   <cms:editable type='text' name='job_title' label='Job title' />
   <cms:editable type='text' name='beschreibung' />
</cms:repeatable>
<cms:show_repeatable name='jobs' >
<cms:if k_count='1'>
<div class="acc-container round-corners-top">
<cms:else/>
<div class="acc-container square-corners">
</cms:if>
<div class="acc-btn"><h1><cms:show k_page_title /></h1></div>
<div class="acc-content">
<div class="acc-content-inner"><p><cms:show beschreibung /></p>
</div>
</div>
</div>
</cms:show_repeatable>

[KK]

@saskia made another post as I was composing this message but I think it should still be useful so I am going ahead with publishing it.

@pierrehansen, what @saskia showed you was simply the method to loop though your cloned pages.
You can use the technique to output whatever HTML markup you desire.

For that you'll have to begin with the 'final' output that you want. For example, suppose this is the way the accordian would look in its final form (with three items) -

Code: Select all

<div class="acc-container">

    <div class="acc-btn"><h1>Item Title 1</h1></div>
    <div class="acc-content">
        <div class="acc-content-inner">Item Text</div>
    </div>
 
    <div class="acc-btn"><h1>Item Title 2</h1></div>
    <div class="acc-content">
        <div class="acc-content-inner">Item Text</div>
    </div>

    <div class="acc-btn"><h1>Item Title 3</h1></div>
    <div class="acc-content">
        <div class="acc-content-inner">Item Text</div>
    </div>    
    
</div>

Decide which portion of the markup gets repeated and isolate it e.g. like this -

Code: Select all

<div class="acc-container">

    <div class="acc-btn"><h1>Item Title 1</h1></div>
    <div class="acc-content">
        <div class="acc-content-inner">Item Text</div>
    </div>
   
</div>

Now wrap that isolated chunk of markup with cms:pages like this -

Code: Select all

<div class="acc-container">
<cms:pages masterpage='whatever-template.php>
    <div class="acc-btn"><h1>Item Title 1</h1></div>
    <div class="acc-content">
        <div class="acc-content-inner">Item Text</div>
    </div>
</cms:pages>   
</div>

You'll see that generated HTML will repeat the block as many times as there are cloned pages.

You can now substitute the hardcoded strings with variables -

Code: Select all

<div class="acc-container">
<cms:pages masterpage='whatever-template.php>
    <div class="acc-btn"><h1><cms:show k_page_title /> <cms:show k_count /></h1></div>
    <div class="acc-content">
        <div class="acc-content-inner"><cms:show beschreibung /></div>
    </div>
</cms:pages>   
</div>

That's the general approach.

If you decide to go with repeatable-regions, the approach will remain the same (i.e. isolate one block of markup that is to be repeated, wrap it with the Couch tag (cms:pages or cms:show_repeatable), use variables).

Hope this helps.

Thanks so much for all your help. It's much appreciated!

Couchcms is more complex that I thought. I'm working on it.

I simplified my HTML code. The accordion-markup is simply:

Code: Select all

<h1 class="accordion_toggle">Mechaniker</h1>
<div class="accordion_content"><p>....</p></div>

which represents one accordion tab. If I want one more, I simply add another <h1> + <div>

Now I replaced these two lines with the following code which should be working but...doesn't

Code: Select all

<cms:repeatable name='jobs'>
            
<cms:editable type='text' label='Stellenangebot' name='stellenangebot'/>
<cms:editable type='nicedit' label='Beschreibung' name='beschreibung'/>
            
</cms:repeatable>
           
<cms:show_repeatable name='jobs'>
         
<h1 class="accordion_toggle"><cms:show stellenangebot /></h1>
<div class="accordion_content"><cms:show beschreibung /></div>
         
</cms:show_repeatable>

If I add some jobs in the admin they don't show on the page.

Thanks for taking your time on me.

Best,

Pierre

[KK]

Please modify your code to the following (am removing the 'name') and it should work

Code: Select all

<cms:show_repeatable 'jobs'>
         
    <h1 class="accordion_toggle"><cms:show stellenangebot /></h1>
    <div class="accordion_content"><cms:show beschreibung /></div>
         
</cms:show_repeatable>

Yes. Finally! Thank you so much...

Now I think: Is there any way to handle the "count" option? Would be nice if the admin could change the order of jobs afterwords?

Thanks again,


Pierre

[KK]

Would be nice if the admin could change the order of jobs afterwords?

The rows support drag-n-drop ordering. Or is it that you meant something else?

Ohh they do. Sorry, I didn't even think on that! Perfect! Thanks!