Forum

Thread tagged as: Question, Suggestions

Creating a template that has an image as a hyperlink. Both editable

Right now I am just using a basic image template for an image placeholder. But I need to be able to have the image clickable as a hyperlink. And both the image and the hyperlink will be changing regularly. So both need to be able to be changed in Perch control panel by the end user.

How would I achieve this? I assume I would just nest an image type template within a URL type template, but I'm struggling to do it properly as I'm a newbie.
Robert Lewis

Robert Lewis 0 points

  • 2 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

2 years ago

In your template you'd have something like this:

<a href="<perch:content id="url" type="url" label="URL">">
    <img src="<perch:content id="image" type="image" label="Image">">
</a>

That's simplified, but those are the basics. (You might want to expand that to add an alt attribute to the image, for example.)
Robert Lewis

Robert Lewis 0 points

2 years ago

Drew McLellan said:

In your template you'd have something like this:

<a href="<perch:content id="url" type="url" label="URL">">
   <img src="<perch:content id="image" type="image" label="Image">">
</a>

That's simplified, but those are the basics. (You might want to expand that to add an alt attribute to the image, for example.)

Hi, thanks for the reply but unfortunately this isn't working properly when published. I used exactly the code you gave with no modifications.

It shows up fine in the perch control panel as a template and I can select the URL and the image and it 'publishes successfully'. But on the website it's just a blank space and there isn't even a clickable link.

I'm confused as I've never had a problem like this with any template before. All goes smoothly usually.
Drew McLellan

Drew McLellan 2638 points
Perch Support

2 years ago

What HTML output do you get on the page?

Are you running the current version of Perch?