Add a link to an image in a CMS Item

Design help CMS
1

Hello,

Does anyone know if it’s possible to link an Image in a CMS collection, with an existing page?

Screenshot 2024-10-01 at 08.44.29
Screenshot 2024-10-01 at 08.44.29748×193 16.2 KB

I can’t see any option to link the image directly to a page.

Thanks in advance :slight_smile:

Here is my public share link: Webflow - Test-Page

2

Hello gioele,

Here it is easiest way for you:

Go to ‘ITEM’ div of your collection

Press CTRL+E and add link block

Move ‘ITEM THUMBNAIL’ image inside link block

here it is your image became link :)

Note :
It became CMS Link now so you can redirect to specific page to particular CMS sub page.

Still can’t find it happy to demonstrate. :)

3

The thing is, I’m not using CMS Pages, I have normal ones. If I wrap my ITEM around a link block, it applies to all the collection Items and If I link the block with an existing page, every ITEM will have the same link. Isn’t there an Option inside the CMS structure?

4

Can i know where do you want to redirect this image link?

5

To a normal sub-page, for example if I click on the Image “AI-Marketing” then it has to direct the user to the corresponding sub page.
I hope I could explain myself better.

6

Yes got it

It will be done wait till sending you snippet of it. :smile:

7

Here is how can you do this

Hope it is what you want.

create your corresponding sub page it will redirect definately.

8

Thanks for the Video.
That doesn’t solve exactly my problem. Since I’m not using any CMS pages, (because every page corresponding to the Items has a different layout and different elements) I can’t really use a Link block as a solution. Because I can’t edit the CMS Items individually. Hope you understand now :slight_smile:

9

Ohk. CMS can be used for same layout of sub pages but since you have different layout for all sub pages I think you have to build it manually.
Thank you.

10

Hey @gioele your goal is a bit confusing, but if you’re trying to display an image that’s stored in an item within a CMS collection, you have two easy options;

COLLECTION LIST
Drop a collection list on your static page
Bind it to your collection
Filter it to the item
Drop an image inside
Bind it to your image field

That’s the most mainstream way to do it.
Option 2 is a hack.

DIRECT IMAGE SRC LINK
Get the URL of the image that you’ve stored in the CMS
Drop a custom element on your static page
Make it img type, src set to the image URL

Option 2 won’t update if you change the image in your collection.

11

Hey @memetican , thanks for the reply. I’m sorry if I can’t explain myself well.
But the goal is pretty straight forward:

I have a CMS Collection with many Items.
For each Item I have a Page (no CMS Page, just a normal subpage with no dynamic content).
My goal is to go in the CMS collection and tell that Item_1 belongs to Subpage_1 and so on…

I already could achieve that with a “Rich Text” component:

Screenshot 2024-10-01 at 10.48.52

But I want that the Image is also clickable.
I hope it’s more clear now. ;)

12

I think I understood what you want to do clearly enough, when I say goal, I mean your reason for wanting to do this. Unfortunately the way Webflow is designed this is a bit of a hacky way to build a site and usually you’re better off aligning with Webflow’s design than fighting it.

In general, any time you want to get content from the CMS, you either need a collection page or a collection list, so my answer above has the approach you need.