How to embed Google forms in WordPress.com websites

While you can link to a Google form and people can go off and fill it in, it’s quite nice to have it seamlessly appearing within your page using a bit of code that Google provides. Here’s how, for people using WordPress.com websites (it’s possibly the same for WordPress.org self-hosted ones but I’ve never used one so don’t know).

1. Find the embed code

‘Old’ Google Forms

Look for File in the menu

Screen Shot 2016-02-28 at 12.38.19

Click on it

Screen Shot 2016-02-28 at 12.39.27

Select Embed…

Screen Shot 2016-02-28 at 12.39.36

Copy the iframe src text for embedding.

New Google Forms

They’ve hidden it in the Send button (took me a while to realise this cos I thought the send button would annoyingly ‘send’ a blank copy of the form to the email address associated with it, but it doesn’t).

Screen Shot 2016-02-28 at 12.43.33

The ‘Send via’ bit has several options, look for the angle brackets for the embed code

Screen Shot 2016-02-28 at 12.43.42

Once you click on the angle brackets icon the iframe link will appear for you to copy.

Screen Shot 2016-02-28 at 12.43.51

2. Insert the embed code

On WordPress.com you can use either the VISUAL or the HTML to add or embed different types of links. For iframes you need to use the HTML view to add it in, and when you return to the VISUAL there’s a high chance that a small square area will be blocked out which is where your form will appear when your website page is published.

Note that with future editing it’s entirely possible that WordPress.com will automatically convert the iframe code info into a Google shortcode – if you have one of those and want to move it around do this in the VISUAL and not the HTML editing window.

From experience of using Blogger you would also add the iframe directly into the html editing window too.

As I’m using the free version of WordPress.com you’ll probably see some terrible advert below, sorry about that.

 

Advertisements

One thought on “How to embed Google forms in WordPress.com websites

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s