Forum

Thread tagged as: Question

Struggling with my first Perch project...

Hello,

I've just purchased my first Perch license today. I'm a graphic designer with some html/css skills. Installation went fine, I just added a region to a page, but now I'm struggling how to make the content editable in the right way for my customer. I'm don't know where to start in the documentation for this type of question. Can someone explain the steps I have to made in the given example? Customer should be able to create a new post on the same page (no need to create a new page!) with the <div class="panel panel-default"></div> as one item. How should I set this up in Perch? Do I have to do this with the blog add-on or are there other solutions? Many thanks in advance to help me out with this!

<?php perch_content('posted-items'); ?>
<div class="panel panel-default">
    <div class="panel-heading">
     <h3 class="panel-title">Some text <span><a href="mailto:mail@gmail.com">first name</a></span> text.</h3>
    </div>
    <div class="panel-body">Lorem ipsum text.</div>
</div>
<div class="panel panel-default">
    <div class="panel-heading">
     <h3 class="panel-title">Some text <span><a href="mailto:mail@gmail.com">first name</a></span> text.</h3>
    </div>
    <div class="panel-body">Lorem ipsum text.</div>
</div>
Frederic Desauw

Frederic Desauw 0 points

  • 5 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

5 years ago

You'd create a template to represent one panel panel-default item. To do that, add a new file to perch/templates/content and call it something like panel.html.

In that template, start off with your existing HTML:

<div class="panel panel-default">
    <div class="panel-heading">
     <h3 class="panel-title">Some text <span><a href="mailto:mail@gmail.com">first name</a></span> text.</h3>
    </div>
    <div class="panel-body">Lorem ipsum text.</div>
</div>

Then go through and replace the editable bits with perch:content tags, along the lines of:

<div class="panel panel-default">
    <div class="panel-heading">
     <h3 class="panel-title">
        <perch:content id="title" type="smarttext" label="Title" required="true" title="true" />
     </h3>
    </div>
    <div class="panel-body">
        <perch:content id="body" type="textarea" label="Text" markdown="true" editor="markitup" size="m" />
    </div>
</div>

In the Perch control panel, find your new region ('posted-items' I guess), click through and you'll be asked to pick one of the templates from a select box. Choose your new Panel template. Check the box that says allow multiple items.

Then just remove the existing HTML from your page - this will now come from the template instead.
Frederic Desauw

Frederic Desauw 0 points

5 years ago

OK thanks!