Multicolumn section icon into a button

[VicBrew1]

Hi! 

Store: https://qtupb6-n1.myshopify.com/

Is there a way to make the multicolumn images/icons into a button? I have links to all the columns but I don't want to add a label as it is an eye sore unfortunately, completely ruins the aesthetic of the site.  

I want it to look like this and be clickable: 

Not like this: 

 

I appreciate any help! 😭

 

[devcoders]

Hello @VicBrew1 

Can you share the collaborator request code with me so I will check it.

[VicBrew1]

Yes! Thank you! I will message you directly. 

[Made4uo-Ribe · Accepted solution]

Hi @VicBrew1 

Try this one, this make the logo clickable the label will be hidden. 

1. From your Shopify admin dashboard, click on "Online Store" and then "Themes".
2. Find the theme that you want to edit and click on "Actions" and then "Edit code".
3. In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

.multicolumn-card.content-container {
    position: relative; 
}

.multicolumn-card.content-container .multicolumn-card__info {
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
    padding: 10px; 
    text-align: center; 
    width: 80%;
    opacity: 0; 
    pointer-events: all;
}

.multicolumn-card.content-container {
    cursor: pointer;
}

• And Save. 
• Result:
• 

Your Feedback Matters! Please mark the solution and give likes to posts that helped you. Your appreciation fuels our motivation to assist you better! 

[VicBrew1]

Thank you so freaking much! 😍 This worked! How would I do this for the top row? may I repurpose?

[VicBrew1]

Issue: It made the multicolumn clickable but now the multicolumn reviews won't sow. Any ideas for this? 

 

[VicBrew1]

FIGURED IT OUT! So I put the code in the CSS box after clicking the section and then added a link label. Works perfectly! THANK YOU!