Hey everyone! I’m new to Shopify and could use some help. I’ve got a Shopify store and I want to add a custom form that sends data to an external website. I thought it would be easy since I know Rails, but Shopify uses Liquid templates instead.
I checked out some examples of contact forms, but they all seem to post within Shopify. Is there a way to make a form submit to an outside URL?
I’m feeling a bit lost here. If anyone has experience with this or can point me in the right direction, I’d really appreciate it! Thanks in advance for any tips or advice you can share.
ive tried this before, you can use js to catch the form submit and then use fetch to send data externally. make sure your server supports cors so the request wont fail.
I’ve dealt with this exact situation in one of my client’s Shopify stores. Here’s what worked for us:
We created a custom liquid template for the form, keeping it simple with just HTML. Then, we added a bit of JavaScript to handle the form submission. We used the ‘preventDefault()’ method to stop the default form action, grabbed the form data with ‘FormData’, and then used the Fetch API to POST it to our external URL.
One thing to watch out for - make sure your external server is set up to handle CORS requests, or you’ll run into issues. Also, don’t forget to add some error handling and maybe a loading indicator for better UX.
It took some trial and error, but once we got it working, it’s been smooth sailing. Good luck with your project!
I have worked with Shopify for a while and found that creating a custom form to submit data to an external URL is entirely feasible. You can build the HTML for your form within the theme and then use JavaScript to intercept the form submission. Utilizing the Fetch API enables you to send the data to your external endpoint. It is important to verify that your external server supports any necessary CORS settings. Additionally, reviewing Shopify’s Content Security Policy and ensuring your endpoint is secure will help avoid any potential issues.