How to add Google Forms to your site.
With Google Forms, not only will you be able to add a form to your site faster, but it will also get more options. For example, you can embed media, import questions, easily integrate with WordPress and email, share on other platforms, and use additional storage in Google Drive.
Plus, Google Forms allows you to collaborate with your teammates and track all of your form results from multiple channels, not just your site.
Here’s how to quickly embed Google Forms on your website in just a few easy steps.
How to Embed Google Forms on Your Website
To get started, you need a Google Form and its inline code, which you add to the page or post where you want the form to appear on your site.
Create a Google Form
- To create a Google Form, make sure you are signed in to your Google Account and then select the Google Forms icon from the Google Apps menu. Or go to forms.google.com.
- Select an empty tile in the toolbar to create a form from scratch, or choose a template from the available options.
- Add a title and description to the form.
- Then use the toolbar on the right to add questions, import questions from another form, upload videos and images, or add a section.
- If you want to select a response type, click the arrow next to the response type section.
- From options, you can allow users to leave a short answer or paragraph, multiple choices, checkboxes, or select options from a dropdown menu.
- Use the palette icon at
the top right of the screen to customize or change the theme of the form.
- You can also preview the final design using the eye icon before saving and embedding it on your website.
- If you want to collect email addresses, restrict users to one response per each, or allow them to edit their responses after submitting the form, select Advanced settings (gear icon).
- Click the three dots icon to open additional options such as adding collaborators, undoing actions, adding customizations or add-ons from the Google Workspace Marketplace.
Note. Selecting “Add Collaborators” allows you to specifically invite your team members to work on the form. You can send invitations using the link exchange option or enter their email addresses and they will receive an email notification with the invitation.
Insert Google Form into Your Website
Now that you have your Google Form ready, the next step is to add it to your site. To do this, you need to get the form embed code, which is a unique piece of code that you add to the page or post where you want the form to display.
- To receive the form embed code, select Submit in the upper right corner of the form editor window.
- In the submit form, you will see various parameters that you can use to submit the form, such as by link, email, social media, or HTML. You can choose whether you want to share the form on Facebook or Twitter, or send it to your subscribers’ email addresses.
- To embed the form on your website, you must use the HTML variant. Select the <> tab.
Add the code to embed Google Forms on your website
Now that you have the embed code, log into your site admin panel, and navigate to the page or post where you want to embed the form.
Note. The instructions in this tutorial are for WordPress using the Gutenberg / Block Editor.
Craft the Perfect Form for Your Site
Whether you want to add a survey to your website, an order form to your online store, event registration, or a contact form.
Google Forms can help you create the perfect forms for your site.
Check out our guides on how to embed Google Calendar on your website and how to create your own WordPress coupon popup for additional features and a better user experience.
Have you managed to create and embed Google Forms on your website using this tutorial? Share with us in the comments.
- In the “Embed HTML” box, you will see a snippet of code, as well as width and height fields where you can resize the inline form.
- Select Copy to copy the embed code and go to your website dashboard.
- The first step is to add a custom HTML block. To do this, open the block editor by selecting Pages or Posts in the admin panel and find the page or post you want to edit.
- Select the Add Block (+) icon in the upper left corner of the Block Editor next to the WordPress logo. z
- Go to the Formatting section and scroll down to find and select Custom HTML.
- Paste the HTML snippet you copied earlier into the field provided.
- In the Custom HTML block toolbar, select the Preview tab to preview how your form will appear on your website.
- Your Google Form will appear on your page or post.
- Remember to refresh the post or page after editing so that your changes are saved.
How to add Google Forms to your site
How to add Google Forms to your site