Buy Now Button

[tracy_xoxo]

I have a question regarding customization on our theme. Is it possible to replace the “Buy It Now” button on certain products which are products with
“POA-Price on Application” with a “Make an Enquiry” button? The idea would be for customers to click the “Make an Enquiry” button, which would trigger a pop-up form where they can submit their information. We would then reach out to them after receiving the form.

I’ve attached a file for reference on how we envision this working.

Could you let me know if this is something that can be set up on our theme, and if so, what steps I would need to take to implement it?

[rajweb]

Hey @tracy_xoxo ,

1. Replace Button in main-product.liquid or product.liquid

{% if product.tags contains 'poa' %}
  
{% else %}
  {{ form | form 'product' }}
    
  {{ endform }}
{% endif %}

2. Enquiry Modal HTML (add near footer or in theme.liquid)

  

    ×
    ## Make an Enquiry
    
  

3. Modal CSS (add in base.css or theme.css) css Copy Edit

.enquiry-modal {
  position: fixed;
  z-index: 9999;
  left: 0; top: 0; width: 100%; height: 100%;
  background-color: rgba(0,0,0,0.6);
}

.enquiry-modal-content {
  background: #fff;
  max-width: 500px;
  margin: 10% auto;
  padding: 2rem;
  position: relative;
  border-radius: 8px;
}

.enquiry-close {
  position: absolute;
  top: 10px;
  right: 20px;
  font-size: 24px;
  cursor: pointer;
}

4. Modal JavaScript (add before in theme.liquid)

If you want to implement this by me, please feel free to connect me. Thanks!

Best Regards,

Rajat

Shopify Expert

[Bundler-Manuel]

Hi there Tracy @tracy_xoxo I highly recommend that you watch this short YouTube tutorial which is less than 5 minutes long here https://m.youtube.com/watch?v=tGnRKNDMnJw

Let me know how much this helps you if possible.