How to embed (add) a Google form to your WordPress website?

How to embed (add) a Google form to your WordPress website?

Google forms is a wonderful, handy solution if you are looking to collect information from your visitors. It works as an online form that you create within your Google account (details later in the post).

Once you create the form you can share it with the world in many different ways like embedding in to your website, sharing the link via email and/or social media platforms and so on.

In this post, let’s go through the procedure to create Google forms and embed them to your website.

Step 1: How to create your Google form?

In order to embed a Google form to your website you need to first create one! Tada!

Now it is quite simple and all you need is a Google account and I am sure you have one.

Go to your Google Drive and click on New. At the bottom you’ll see “More” – put your mouse over it and you will see Google forms as the first item.

Open google forms

Click on it to open Google forms. Once there, you can simply click on the big + icon to create a new blank form. Or you can choose to pick one of the available templates to go with.

google form

Now it is time to give your form a suitable name and to fill out the question fields.

You can add a new question by clicking the “+” icon in the side tab (shown in the figure below).

Adding questions to google form

There are also options to add image, video or a section to your form by clicking the appropriate icons as shown above.

You can duplicate a question field, and delete any if you want.

Also you can turn ON/OFF the “required”.

More google form options

Play around with the tools and finish adding the required content to your form.

How to add the Google form to your WordPress website?

Once you have finished creating the form, it is time to get the code.

For this you have to click on the Send button on top right.

Save google forms

Once there you will be presented with three options –

(i) Send via e-mail, where you can enter one or more email addresses and have the form sent to those addresses.

(ii) Grab a link (or)

(Iii) Embed HTML

Apart from these three options, you also have the option to share the form in social media (Google Plus, Facebook, and Twitter).

We will need to go with the third option as per the scope of this post.

You will need to copy the iframe code.

Embed google form code

Now visit your WordPress dashboard, open the post or page where you want to insert this code into.

Make sure you switch to the Text/HTML view in the post/page editor. Then paste the code at the appropriate place inside the content.

Embed google form

The form is now embedded in your content.

Google form embedded

Now you can collect information from your visitors using the embedded Google form.

However, as you can see there’s Google’s branding in there. You may or may not en up liking it.

Further, as you are directly putting the Google form code into the site you cannot customise the look of the form to match that of your site.

Let’s use the Google Forms WordPress plugin

If you want to have more control of the form that is displayed on your site you can use the Google forms WordPress plugin.

Google forms plugin

This plugin removes the Google wrapper and the forms can be inserted in your content using shortcodes. Thus it becomes a lot easier for you to later change forms or use a form in multiple locations in your site.

In order to use the plugin, you have to install the plugin on your website. Go to your WordPress dashboard, Click on Add New under Plugins.

Add new plugin

Click on Add New. Then search for Google Forms. Click Install Now on the first result (shown below).

Install Google forms

Now the plugin is installed on your site.

Next, go to Plugins and make sure you have activated the Google forms plugin to be able to use it.

Now you will be able to see the Google forms item in the left sidebar of your WordPress dashboard. Click on “Add New Google Form”.

Add New Google Form

Now, you have to give a name to your form. And enter the form URL (which you have to grab by clicking on the link tab in Google forms (shown below)).

Google form link

Once that is done, your form is ready to be displayed on your site. However, further down you have a few customisation options that you can explore and use if you want to.

Google form customization

In particular, you can add your own CSS so the form can be made to look in agreement with the colours and fonts that you use in your website.

You can also enable Captcha to avoid spam.

Once you are done with the customisation options, click on Publish to publish the form.

Now, if you go to Google forms, you can see the list of forms on your site. Each form will have a shortcode.

Google form shortcode

Inserting this shortcode in pages or posts or in widgets will help you embed the Google form on your site.

Hope this tutorial will help you add a customized Google form to your WordPress website!

About the Author

I'm Jane, the owner of Best Hosting And Design, where I help bloggers and website owners to create and maintain their websites. Check out the services I offer here so you can make use of them. For cutting-edge business tips, please head over to Jane Sheeba.

Leave a Reply 1 comment

Robin Khokhar - September 29, 2017 Reply

Hi Jane,
Google form and WordPress together sounds good. I am going to try this out.
Thanks for sharing great information.
Have a good day ahead.

Leave a Reply: