Add a link to an image in the Debut theme

Store Design
1

Hello people,

I have started to prepare my shopify link a few weeks ago using the Debut theme. One of the things I would like to change is to add a link to an image for the “Text Columns with Images” section. Even though I’m living the text in blank, if I want to put a link, a button appears, and I do not like it. I would preper to click the image directly.

ejercita_0-1607386175812.png
ejercita_0-1607386175812.png1125×322 167 KB

I appreciate your support!

Thanks

1 Like
2

Hi @ejercita ,

That’s a great question, and I’m happy to help you figure this out!

To make this work for the “Text Columns with Images” section, you would have to make some changes to the “feature-columns.liquid” file of your Debut theme code:

  1. Add an option in the section’s “schema” to display a link box in the theme customizer for each “text column” element
  2. Wrap the tag in an tag that pulls the link from the section’s “schema”

Another option that wouldn’t involve any code changes would be to use “Gallery” instead of “Text Columns with Images”. This allows you to make each image a link by default.

Lemme know how it goes!

Alex Marse | Shopify Enthusiasts
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it Accept as Solution to help others locate the answer!
Your Like and Accept as Solution are much appreciated!
3

Thanks Alex,

I’m already at the feature-columns.liquid but I’m not quite sure how to implement the changes that you are mentioning :disappointed_face:

4

Hello community,

Any advice on this? I’m using the “Text columns with images” section and I need to have the link on the photo and remove the button. I’d appreciate your advive, thanks!

ejercita_0-1607530294921.png
ejercita_0-1607530294921.png1140×348 93.3 KB

5

Hi Everyone,

I was able to ut the link on the images based on an aswer from @KetanKumar in the following threat: https://community.shopify.com/c/Shopify-Design/Debut-theme-Need-to-link-the-image-in-quot-Text-columns-with/td-p/374048/page/4

I was also able to remove some white spaces from the desktop version, but I’m still wondering how could I do the same for the mobile version. I’d appreciate your support. Below you will se images from dsktop vs mobile version. Thanks in advance

ejercita_0-1607651536595.png
ejercita_0-1607651536595.png877×794 319 KB

Mobile:

ejercita_1-1607651671323.png
ejercita_1-1607651671323.png349×660 95.3 KB

1 Like
6

@ejercita

Thanks for post

can you please share store url

7

Hi, i was wondering if you could add this functionality to just regular images with text overlay. I’m trying to make banners that are clickable. Preferably a solution that makes all future instances also have the ability on the back end. Thank you.

1 Like
8

@Arounisto

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.