Forum

Thread tagged as: Question, Problem

Pulling first block of specific type from template

I've created a testimonials page with Perch Blocks, so the user can create testimonials that include images, quotes and text blocks. I've got an excerpt of these testimonials being pulled on to the homepage as well as various other pages.

The problem is when trying to pull in an excerpt that has multiple text blocks – this breaks the layout.

Is there a way of only pulling in the first of any type of block? I.e. the first text block, or the first image and ignoring the rest?

You may be able to see the issue by visiting the test server here – https://reddoor.sosquare.com (the testimonials are at the bottom of the page and are sorted randomly). On some of them you'll see the read more links being shown more than once.

Thanks for your help.
David Maxwell-Wood

David Maxwell-Wood 0 points

  • 6 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

6 years ago

You should be able to do it simply in the template with:

<perch:if exists="perch_item_first">
... your content ...
</perch:if>
David Maxwell-Wood

David Maxwell-Wood 0 points

6 years ago

Either it doesn't work, or I'm not sure where to put it. It seems to be trying to load a block within a block... because there are multiple text block blocks. Here is the HTML that's being outputted – and the template that's doing it.

<div class="testimonial testimonial--secondary testimonial--secondary-1">
    <div class="testimonial__quote">
        <img src="">
        <div class="testimonial__quote__inner">    
            <div class="article__text-block">
                <p>Comments following a bespoke workshop on telephone communication for the PA Team at University of Exeter.</p>  
            </div>
            <div class="testimonial testimonial--secondary testimonial--secondary-2">
                <div class="testimonial__quote">
                    <img src="">
                    <div class="testimonial__quote__inner">
                        <p><strong></strong>
                            <br><small></small>
                        </p>
                    </div>
                    <div class="testimonial__quote__cite">
                        <span></span>
                    </div>
                </div>
                <a href="" class="testimonial__link">
                    Read more
                </a>
            </div> 
            <div class="testimonial testimonial--secondary testimonial--secondary-3">
                <div class="testimonial__quote">
                    <img src="">
                    <div class="testimonial__quote__inner">
                        <p><strong></strong>
                            <br><small></small>
                        </p>
                    </div>
                    <div class="testimonial__quote__cite">
                        <span></span>
                    </div>
                </div>
                <a href="" class="testimonial__link">
                    Read more
                </a>
            </div> 
            <div class="testimonial testimonial--secondary testimonial--secondary-4">
                <div class="testimonial__quote">
                    <img src="">
                    <div class="testimonial__quote__inner">
                        <p><strong></strong>
                            <br><small></small>
                        </p>
                    </div>
                    <div class="testimonial__quote__cite">
                        <span></span>
                    </div>
                </div>
                <a href="" class="testimonial__link">
                    Read more
                </a>
            </div> 
            <div class="testimonial testimonial--secondary testimonial--secondary-5">
                <div class="testimonial__quote">
                    <img src="">
                    <div class="testimonial__quote__inner">
                        <p><strong></strong>
                            <br><small></small>
                        </p>
                    </div>
                    <div class="testimonial__quote__cite">
                        <span></span>
                    </div>
                </div>
                <a href="" class="testimonial__link">
                    Read more
                </a>
            </div>
            <p><strong>PA Team</strong>
                <br><small>Exeter University</small>
            </p>
        </div>
        <div class="testimonial__quote__cite">
            <span></span>
        </div>
    </div>
    <a href="/testimonials/exeter-university-training-testimonial.php" class="testimonial__link">
        Read more
    </a>
</div>

the template...

<div class="testimonial testimonial--secondary testimonial--secondary-<perch:content id="perch_item_index" type="hidden" />">
    <div class="testimonial__quote">
        <img src="<perch:content type="image" id="testimonial_image" label="Testimonial logo" width="200" />" />
        <div class="testimonial__quote__inner">
            <perch:blocks>
                <perch:block type="text" label="Text">
                    <perch:if id="perch_item_index" value="1">
                    <div class="article__text-block">
                        <perch:content id="testimonial_text" type="textarea" words="50" append="..." />  
                    </div>
                    </perch:if>
                </perch:block>
            </perch:blocks>
            <p><strong><perch:content id="hero_subtitle" type="text" label="Hero subtitle" /></strong>
                <br ><small><perch:content id="hero_title" type="text" label="Hero title" /></small>
            </p>
        </div>
        <div class="testimonial__quote__cite"><perch:content type="textbox" label="Testimonial Author" id="testimonial_author" />
            <span><perch:content type="textbox" label="Author's Job Role" id="testimonial_author_job" /></span>
        </div>
    </div>
    <a href="<perch:content id="_page" />" class="testimonial__link">
        Read more
    </a>
</div>

I tried using the Perch conditional tags within the Perch Blocks tag pair but this didn't work.
David Maxwell-Wood

David Maxwell-Wood 0 points

6 years ago

I added <perch:showall /> to the template which revealed that, even though I'm not calling the quote block in within the blocks tag pair – it's being pulled in anyway but not displayed...
David Maxwell-Wood

David Maxwell-Wood 0 points

6 years ago

Adding empty blocks to the excerpt / listing template seems to resolve the issue – is this the correct way of doing this Drew?

 <perch:blocks>
    <perch:block type="text" label="Text">
        <div class="article__text-block">
            <perch:content id="testimonial_text" type="textarea" words="50" append="..." />  
        </div>
    </perch:block>
    <perch:block type="quote"></perch:block>
    <perch:block type="Quote Small"></perch:block>
    <perch:block type="Image"></perch:block>
</perch:blocks>
Drew McLellan

Drew McLellan 2638 points
Perch Support

6 years ago

This is something I'm looking at for 2.9.