Forum

Thread tagged as: Question, Problem

Combine regions, then template

Hi!

I have a problem with combining regions and then output them with a single template. I'm using regular Perch, not Runway.

So, I have a couple of regions on a page that I create with perch_content_create and assign templates to. The templates are just for edit, I'm not outputting them. That way I can group different kinds of data in a way that makes more sense for the editor.

perch_content_create ('Main', [
    'template'      => 'home/_main.html',
]);
perch_content_create ('Benefits Slider', [
    'template'      => 'home/_slider.html',
    'multiple'      => true
]);
perch_content_create ('Testimonials', [
    'template'      => 'home/_testimonials.html'
]);

...

Next, I'm trying to combine all the regions and output them using a "master output template". In this template fields from the different regions are mixed.

perch_content_custom( ['Main','Slider', 'Features', 'Testimonials'], [
    'template'=>'home/home.html',
] );

The problem: What happens is that home.html is rendered for each region (I think that's what happening anyway). In other words the template is looped and output multiple times. But what I want in this case is to combine all the content id:s from the different regions and have them templated all at once with home.html.

Any solutions for this?

Tim
Tim Kinali

Tim Kinali 0 points

  • 2 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

2 years ago

Can you give an example?
Tim Kinali

Tim Kinali 0 points

2 years ago

Sure! I'm not at work right now, but here's a general, simplified example. If you want a real example with my template code just let me know.

Region Main

In the edit form main.html I have fields grouped to major content sections. They make sense to edit together in one region. Let’s call them SectionA, SectionB, SectionC, SectionD. Each has a sub template (section-a.html, section-b.html …).

// main.html, only used for editing 

<perch:group label="Section A">
    <perch:template path="content/home/section-a.html" />
</perch:group>

<perch:group label="Section B">
    <perch:template path="content/home/section-b.html" />
</perch:group>

// and so on…!

Region Benefits slider

In the edit form of slider.html I have a repeater where the editor adds content to a tabbed content component. It contains many items so it becomes quite a long edit form, so I want to keep it separate. That way it's also easier to pull out the content and use it in other templates/pages. Note: in my original post I set the region to 'multiple' => true but that's not the case – it's a repeater.

There are a few additional regions that follows the above patterns, but this should be enough for the example.

Output template home.html

Normally, the regions would be output one after another. But that's not what I want. I want the Benefits Slider to be inserted after Section B. So I'm trying to combine the regions, and them output them using a different template, home.html. Because I used sub templates, it's easy to output things in another order without duplicating code.

// home.html, only used for outputting

<perch:template path="content/home/section-a.html" /> 
<perch:template path="content/home/section-b.html" />
<perch:template path="content/home/slider.html" /> 
<perch:template path="content/home/section-c.html" />
<perch:template path="content/home/section-d.html" />

Outline:

  1. Region Main / SectionA
  2. Region Main / SectionB
  3. Region Benefits Slider
  4. Region Main / SectionC
  5. Region Main / SectionD

To start with it would be great to know if my problem actually is the expected outcome. If it is, are there any workarounds? If it is not what's supposed to be happen, then I guess there must be something wrong in my templates making it loop.
Hussein Al Hammad

Hussein Al Hammad 105 points
Registered Developer

2 years ago

Hello Tim,

Outline:

  1. Region Main / SectionA
  2. Region Main / SectionB
  3. Region Benefits Slider
  4. Region Main / SectionC
  5. Region Main / SectionD

You can call perch_content_custom multiple times:

perch_content_custom('Main', [
'template' => 'home/main_pre.html',
]);

perch_content_custom('Benefits Slider', [
'template' => 'home/slider.html',
]);

perch_content_custom('Main', [
'template' => 'home/main_post.html',
]);
Tim Kinali

Tim Kinali 0 points

2 years ago

Hi Hussein,

Thanks, that would certainly work and is the way I've done it in previous projects. However for this particular project I was looking for a improved way to have a slightly more elegant and modular structure of regions, templates, and the the editor experience.

Would be cool if we could have an option to merge the data:

perch_content_custom( ['Main','Slider', 'Features', 'Testimonials'], [
'merge' => true, 
'template'=>'home/home.html', 
] );
));

It's this just my way of thinking, or would it be something interesting for others too?

By the way Hussein good work with grabapipit.com!
Hussein Al Hammad

Hussein Al Hammad 105 points
Registered Developer

2 years ago

Assuming none of the regions share the same field IDs, you can retrieve the data with the skip-template option and use the Perch API to render the data in one template:

https://docs.grabaperch.com/api/reference/template/

By the way Hussein good work with grabapipit.com!

Thanks! Speaking of grabapipit.com, you may find this post helpful:

https://grabapipit.com/blog/template-api
Tim Kinali

Tim Kinali 0 points

2 years ago

Yes, that might work well! Cheers!