Forum
Template not laying out and displaying images
Hello
I am using the following template to recreate the bootstrap layout but it does not seem to put the image in the first and 4th 3 columns and the text in the 2nd and 4th 3 columns. The code for the template is below as is the link to see the page.
Many thanks if you can help.
<perch:repeater id="nude_images" label="Nude Images" max="6">
<div class="row">
</perch:before><div class="col-md-3"> <img class="img-responsive" alt="Daniel Stedman" src="<perch:content type="image" id="picture_1" label="Picture 1" crop="true" width="250" height="250" /> > </div> <perch:before>
<div class="col-md-3">
<h3>
<perch:content type="text" id="title_of_picture" label="Name of picture" />
Nude One Title</h3>
<h4>
<perch:content type="text" id="picture_price" label="Price of picture" />
Price</h4>
<p>
<perch:content type="text" id="discription_of_picture" label="Picture discription" />
Discription of image. Medium used etc.
Nam viverra euismod odio, gravida pellentesque urna varius vitae.
Sed dui lorem, adipiscing in adipiscing et, interdum nec metus.
Mauris ultricies, justo eu convallis placerat, felis enim. </p>
</div>
<div class="col-md-3"> <img class="img-responsive" alt="Daniel Stedman" src="<perch:content type="image" id="picture_2" label="Picture 2" crop="true" width="250" height="250" />> </div>
<div class="col-md-3">
<h3>
<perch:content type="text" id="title_of_picture_2" label="Name of picture" />
Nude One Title</h3>
<h4>
<perch:content type="text" id="picture_price_2" label="Price of picture" />
Price</h4>
<p>
<perch:content type="text" id="discription_of_picture_2" label="Picture discription 2" />
Discription of image. Medium used etc.
Nam viverra euismod odio, gravida pellentesque urna varius vitae.
Sed dui lorem, adipiscing in adipiscing et, interdum nec metus.
Mauris ultricies, justo eu convallis placerat, felis enim. </p>
</div>
<perch:after></div></perch:after>
</perch:repeater>
<hr />
link to page: https://www.danielstedman.gallery/daniel-stedman-nudes-landscapes.php
Paul
The first thing to do is check for basic syntax errors.
For example, you have the
</perch:before>appearing before the<perch:before>.Thanks Drew
I also missed the " closing the src element. However the next and subsequent repeated regions just repeatedly squshes up on the right hand side and progressivley squshes the subsequent blocks. Also I am getting "" appearing before the repeating region, is this causing the problem?
https://www.danielstedman.gallery/daniel-stedman-nudes-landscapes.php
Best regards,
Paul
This looks like an HTML problem rather than a Perch problem.
Hello Drew
In my previous message I've managed to stop the squashing of the repeated regions. However when the region is repeated a second time the image that should be is displayed under image 1 dose not show and if it did it would be where he text is. if you look at the page the 4th image is where the text should be. Is the "" that appears before the perch block causing it.
The code on the template is as follows
Many thanks,
Paul
For the encoding issue, make sure you're serving your page as UTF8.
Otherwise, have you validated the HTML output to see where it's going wrong?
Hello
Ive put the code in the head
and validated the code. it is showing an error for the 4th image which is not uploaded. Perch is not showing the 3rd image that is attributed with the text.
Regards,
Paul
Hi
I also forgot to say that I changed the code in line 2 to:
I had repeated the class= twice and used " marks instead of ' in the mark up.
Sorry,
Paul
Hello
I note that the "" has now disappeared. Can you see or think of a reason why the template display the text only from the first part if the template and not the image when repeated and the 4th image and text shows correctly?
Best regards,
Paul