How to Integrate Custom Forms in Shopify (2024) Tutorial For Beginners

How to integrate custom forms into Shopify in this step-by-step tutorial

Let's see how we can do this. The very first thing you need to do, guys, is to go into your Shopify account

If you don't have a Shopify account, I'm going to leave you linked up below in the description so we can get started totally for free

So the very first thing you need to do when you have your account, when you have your Shopify already been created

is to focus into creating your actual store, right? So if you go into the home section, which is actually the upper side

you're going to be seeing that we have this setup guide. And here, what we want to do is to fill all the tasks that need to be completed

So I'm going to go into set up your store. And as you can see, we have the ad brand assets, we have the customized theme, we have the ad pages to restore, organized store, and much more

I can strongly just do that first of all, you want to locate the ad brand assets, choose manage branding

And once you are in here, you want to impose your own logo, your own square logo, your own colors of your actual branding, the cover images

and all that information you want to fill with that. So once you have successfully failed that

it doesn't matter what kind of theme that you choose. It's going to be imported all your information into that theme

so you don't have to practically do anything at all. So hit into saved, and then you're actually good to get started

So what you want to do now is to customize your theme as well as your pages, organize your store navigation and create a professional logo

just in case you don't have anyone. You just create that here totally fall free

So now what we wanted to do is to focus into the page that we want to add as a custom form

So if you focused into online store, let's focus into pages. Here what it says pages, what I wanted to do is to add a new custom page as a custom forms

So let's say for example that I want to make some contact us or I want people to, if they want to, let's say, apply to

to send an email to send a this line of a product I want to create a customed form So for that what I wanted to do is to create a new page So we going to go for Add Page here And then here the title

Here's the content. So I'm going to go for title. I'm going to change that for certain you of design

So now, we have now added our pages. So what I want to do is to customize this page

But first of all, I'm going to go into Online Store. And once we are here, I want to locate my store

here, my actual page. So since we cannot see the page that we have just created, we want

to customize our navigation tool. So locate your navigation here. And here into navigation, what

I want to do is to look out for my main menu, which is actually this one. And what I want

to do now is to just add the one that I wanted to find into my actual store. So I'm going to just

delete this one because I think I don't need it. I'm going to go for add a menu item. And I'm going to go

for name and I'm going to look out for the actual page I have just created. I'm going to go for

link. I'm going to go for send your design and this is going to be the name of my actual

menu item. And here I'm going to go for add and there we go. After that, what I'm going to do is

to hit into save menu. So now what I want to do is to go into my online store and customize the

custom paste that we have just added. So I'm going to go for customize down in here. So now as you can

see here is our element of Sunt your design. So I'm going to click into my Hatha. I'm going to

click into this page that we have just created. And what I want to do is to customize all my

elements. So what I wanted to do is to delete all of this element since I think this actually

not going to be worthy. So I'm going to go here with this template, locate the ad section

and here look out for your keyword, which in our case is a form. So here choose contact form

and here it is appearing the contact form added. So I'm going to click here into the contact form

so I can see what I can do to add this into a form So I going to click into CustomCWS So here as you can see I can add custom styles of this section only

So it says top padding. Let's go for 64 and let's go for 80

And it's how it's going to be looking at our actual contact information. And this is the part where it all comes a little bit tricky

So there's two ways that we can add in a specific contact or custom form

since we only have one, two, three, four different sections to add. here. If I go back into my section of my store, I'm going to hit into exit, locate your

applications. And here into apps, you want to locate your application. Once again, look out for

recommended apps. Just to open the Shopify App Store. And here, what I wanted to do is look

out for an application that can be helping me to create some forms. So into search apps, go for

forms. Click here. And you can see there's a lot of applications that we can choose to have

custom forms, builder. but as you can see there are the ones that says seven day free trial we have free plan available

but if you click into one of them we can see that all of these forms of course need to be paid

so i'm going to hit into add application and here's the new form template that i can choose

so let's say for example that i want to go for contact us application form in our case this is this one

i'm going to hit into wholesale hit into go this side and as you can see i can start this side

my custom form. As you can see, here we have the first last name, the email, business training

name, website. So I can choose, let's see, for example, this question, and change that for a question

like what are your main goals? Leave it like that, and the resale tax ID, social media stuff

and then after you have successfully done that, you want to hit into saved, and we are now into

a free plan. So as you can see, we have only eight fields limited, since we have. We have

have a free plan If you don want to be limited there another stuff that we can do in order to get started with the custom forms which is Google Forms What you want to do is to go into dox

fast forward slash forms. And here you can customize and create your own custom form

So once you have successfully created something like this, for example, I'm going to go into

Send. I'm going to go for SendBia. And here you have an in-Beam

HTML file. So what I can do is to copy this linked and add this into my actual store

into the page where we're actually getting started. So if you want to add your HTML file

which is this one, just going to copy. I'm going to go into my only store, look out for

blog post. I'm going to look out for my page, which is actually this one. And here what I wanted

to do is to look out for the send your design. So here what I wanted to do is to paste my actual

custom ehtml file. So I'm going to delete this element and here you can show the HTML file. If you can't do this, you have to worry about that. What we can do is to create a blog post. So I'm going to hit into blog post

and here what I wanted to do is to create my blog post and here have the content

I can show my HTML file and I can paste that in here so I can just hit into save and my

elements should be added into my store. And that's how we can add custom forms into our Shopify

We're having to pay absolutely anything. But that's totally up to you if you want to use Google forms or you want to use the apps

that Shopify has to offer to us to leave you free. With that being said, guys, I've reached into the very end of the video

So don't forget to like and subscribe to the channel. if you don't want to see more amazing tools about this Shopify

Hopefully this was very useful for you guys. And well, hopefully I'll see you in the next video