Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
Hi all,
I created a liquid code to embed an inquiry form into certain products. It works great, sends the product description over with the message, but I haven't figured out how to have a success message when they hit Submit. This leads to several customers sending duplicate queries because obviously, they don't know it has gone through successfully. Here is code below:
{% form 'contact' %}
{{ form.errors | default_errors }}
<div class="name">
<label for="name">Name<br></label>
<input type="text" name="contact[name]" id="name" />
</div>
<br>
<div class="email">
<label for="email">
Email<br></label>
<input type="email" name="contact[email]" id="email" />
</div><br>
<input type="hidden" id="message" name="contact[product]" value="{{ product.title }}">
<div class="message">
<label for="message">Message<br></label>
<textarea name="contact[body]" id="message"></textarea>
</div>
</div>
<div class="lightly-spaced-row">
<button class="btn" type="submit">SEND</button>
</div>
{% endform %}
Solved! Go to the solution
This is an accepted solution.
Thank you for the responses! It isn't perfect, but it works and shows a message. I ended up using a combination of both of your suggestions in my modifications.
Hello @shopworthwhile ,
Update your code with this one
{% form 'contact' %}
{%- if form.posted_successfully? -%}
// Your success will be here
{%- elsif form.errors -%}
{{ form.errors | default_errors }}
{%- endif -%}
<div class="name">
<label for="name">Name<br></label>
<input type="text" name="contact[name]" id="name" />
</div>
<br>
<div class="email">
<label for="email">
Email<br></label>
<input type="email" name="contact[email]" id="email" />
</div><br>
<input type="hidden" id="message" name="contact[product]" value="{{ product.title }}">
<div class="message">
<label for="message">Message<br></label>
<textarea name="contact[body]" id="message"></textarea>
</div>
</div>
<div class="lightly-spaced-row">
<button class="btn" type="submit">SEND</button>
</div>
{% endform %}
Note: Change this line
// Your success will be here
a/to your need.
Regards
Guleria
This is an accepted solution.
Thank you for the responses! It isn't perfect, but it works and shows a message. I ended up using a combination of both of your suggestions in my modifications.
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025