Forum

Thread tagged as: Question, Docs

Using perch:content to upload an image? as a background-image style?

I am hoping to create an editable region allowing my user to upload images, such that they are added to a template that says this...

<div class="swiper-slide" style="background-size:600px 450px; background-repeat:no-repeat;"></div>
<!-- repeat for a number of images -->

... which subsequently becomes this ...

<div class="swiper-slide" style="background-image:url(images/1.jpg); background-size:600px 450px; background-repeat:no-repeat;">title1</div>
<!-- repeat for a number of images -->

Is this even remotely achievable?

I've been looking at the perch:content tags (https://docs.grabaperch.com/perch/content/templates/how-do-i-upload-images-and-files/), but am not quite sure what I would need to do in order to just add an img tag into the div that displays an editable image, let alone add it as a div style.

Krissie Pearse

Krissie Pearse 0 points

  • 4 years ago
Rachel Andrew

Rachel Andrew 394 points
Perch Support

Add the Perch image tag as a replacement for images/1.jpg, it gives you the bare path of the image.

Thank you very much!

If I use a template for a single div, obviously I can "save and add new" ad infinitum...

... but is there's a lot of markup either side of the divs that I would not want to repeat, and ideally would like to include in a template rather than on the master page. Is there any way that I can set a content region within a template such that I can repeat only the divs by means of "save and add new", and not the surrounding markup?

Never mind.

Just found perch:repeater - https://docs.grabaperch.com/templates/repeaters/

Thank you once again!