I would like to make the entire element clickable

SantosBaez · ‎09-23-2024

Hello!

I'm using PageFly for my landing page and would like to make an entire element clickable. I have three product cards that only the text is clickable. How can I make the entire element/card clickable?

I would need a code for both desktop and mobile as they are different elements depending on the device. I also have a copy of the elements on a separate page: https://coffeeinboxes.com/pages/coffee-boxes

Same as the landing page, this separate page will have an element for desktop and an a copy of the element for mobile.

Any help with this is greatly appreciated!!

Page URL: https://coffeeinboxes.com/

Thanks!

BSS-TekLabs · ‎09-23-2024

- Here is the solution for you @SantosBaez
- Please follow these steps:
1. Go to Online Store --> Theme --> Edit code.
2. Open your theme.liquid file
3. In theme.liquid, paste the below code before </head> and press 'Save' to save it

<style>
h3.sc-gplwNw.sc-bWJTsT.eZkfKX.bqQLUR.pf-25_.pf-heading-1-h3::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    background: transparent;
}
</style>

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)

Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

SantosBaez · ‎09-23-2024

Hello there!

I pasted the code you provide before </head> and saved it, but it's not working. Am I pasting it in the wrong place or doing anything wrong that you can tell?

Thanks!

BSS-TekLabs · ‎09-23-2024

You added it in the wrong place. before the </head> tag not <head> it's a bit below @SantosBaez .

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)

Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

SantosBaez · ‎09-23-2024

The only </head> I see in the code is this one:

I pasted your code before it and it didn't work.

BSS-TekLabs · ‎09-23-2024

Can you re-paste it so I can check it again?

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)

Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

SantosBaez · ‎09-23-2024

Hi! Sorry for the late reply! I pasted the code again before </head> for you to check. I'm still unable to get the entire product card clickable.

SantosBaez · ‎09-23-2024

@BSS-TekLabs Oh! So the product card is clickable on the page: https://coffeeinboxes.com/pages/coffee-boxes

- but it's not clickable on the landing page: https://coffeeinboxes.com/

SantosBaez · ‎09-23-2024

Also, it only works on dektop screen on the page: https://coffeeinboxes.com/pages/coffee-boxes

I would like it to be clickable on a mobile screen as well.

BSS-TekLabs · ‎09-24-2024

Hi, is the problem solved, is there anything else I can help with @SantosBaez ?

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)

Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

I would like to make the entire element clickable

I would like to make the entire element clickable

Community Blog Articles