How to Embed a Google Form in WordPress

Article written by:
  • WordPress
  • Nov 08, 2017

There are just so many things to love about WordPress. It’s easy to use, free, flexible and is backed by a large community that’s always willing to help beginners out.

As a longtime WordPress user, I enjoyed hunting for plugins that supercharged my projects. These excellent pieces of software allowed me to build professional-looking, fully-functioning, and user-friendly websites without having to learn extensive coding.

When it comes to usability, one of the most important tools you need in your WordPress arsenal is a form builder. It allows your audience to interact with your brand – be it in the shape of general inquiries, support requests, or feedback. Forms can also be used for surveys that help you gain a deeper understanding of your audience.

Although the official WordPress repository already offers plenty of form-building plugins, some bloggers and marketers prefer sticking to the G Suite – a cloud-based platform for webmasters designed by none other than Google.

In this post, I’ll show you the different methods of using Google Forms with your WordPress sites.

Creating with Google Forms

First of all, log in to Google Forms using any valid Google account.

Under “Start a new form,” choose whether you’d like to start from scratch or utilize a pre-existing template.

Of course, using a template is a huge time-saver, especially if you already know what you’re trying to accomplish with your form. But for the sake of demonstrating the features of Google Forms, let’s go ahead and start from a blank template.

By default, the primary form editor includes a “multiple choice” question type. This is useful for creating survey forms. If you want to use something else, click the ‘Multiple choice’ dropdown menu to reveal your options.
Currently, Google Forms supports the following question types for collecting different information.
To edit any information, just click on the empty field and type away. Everything will be saved in the cloud, so there’s no need to worry about saving.
You can use as many questions as you like in a single form. To do this, click the ‘Add question’ button in the floating sidebar.

You can also use the sidebar to add other form elements, such as an image, video, or a separate section.

As a rule of thumb, only ask for the information you need from your target users. If you ask too many questions or become too invasive, users might be discouraged to complete their submission.

To learn more about the functions of Google Form, refer to the G Suite Learning Center by clicking this link.

Sending Your Google Form to WordPress

Now that you know how to use Google Forms, it’s time to learn how to embed them on your WordPress site. The simplest approach is to paste the embed code straight into any post or page.

To obtain the embed code for your form, click the ‘Send’ button at the upper-right corner of the editor.
Click the double arrowhead symbols (<>) to show the embed code.
Once copied, go to your WordPress dashboard and open the page or post where you want the form to appear. Switch to the text editor to view the HTML code for your content.

 

Remember, if you pasted the embed code using the visual editor, your code would appear as is. Using the text editor will tell WordPress that it needs to run the particular line as a code. When done, click the ‘Preview’ button to see if the code worked.
Alternatively, you can simply switch back to the visual editor to check if the form displays correctly.

The appearance of your form depends on three things: your current WordPress theme, the dimensions you’ve set when generating the embed code, and your color palette preferences in Google Forms.

Take note that your WordPress theme dictates the width of your post’s content area. You can adjust this via code or by installing another theme. In some themes, the content area also adjusts to full width if you disable sidebar widgets.

The color palette, on the other hand, can be changed by clicking the ‘Color Palette’ button in the Google Forms editor. If you want, you can also upload images rather than using solid colors as backgrounds.

Using wpGForm

Adding Google Forms through embed codes seems simple enough that there’s no reason to use plugins, right?

If your only goal is to embed Google Forms to your WordPress site, then the answer is yes. However, wpGForm does a lot more than just integrating forms. It also allows you to hide the form’s title, modify the submit button, use captcha, and so on.

But before anything else, remember that wpGForm only works with the older version of Google forms.

To access this, click the ‘Help & Feedback’ button and select ‘Back to the old Forms.’
After installing wpGForm, go to your WordPress dashboard and click ‘Google Forms’ > ‘Add New Google Form.’
Next, paste the link to your form into the “Form URL” field. You can obtain this by going to the Google Forms editor and clicking ‘File’ > ‘Send form.’
After pasting the link, click the blue ‘Publish’ button. That’s it! If a valid URL has been inserted, your form is now ready for use via shortcode. This can be accessed by going to ‘Google Forms’ > ‘Google Forms.’

It’s worth noting that wpGForm is a plugin with quite a learning curve. Using the default settings, your form will utilize basic rendering elements as opposed to using the embed code.

But in the right hands, Google Forms and wpGForm is a powerful combination that can take your data collection efforts to the next level. You can define CSS rules, setup input validation, enable hidden fields, and override the default text in Google Form buttons.

To learn more about the things you can do with wpGForm, you can refer to the tips and tricks section found on the creator’s official website.

Do you agree that forms are an essential component of the WordPress user experience? If so, check out this post for more useful custom form plugins you can use.

Article by Christopher Jan Benitez

Christopher Jan Benitez is a professional freelance writer who provides small businesses with content that engages their audience and increases conversion. If you are looking for high-quality articles about anything related to digital marketing, then he's your guy! Feel free to say "hi" to him on Facebook, Google+, and Twitter.

Get connected: