How To Insert Upload And Import Google Photos Into WordPress Posts

There doesn’t seem to be a straightforward solution or plugin that would allow inserting and importing a single Google Photos image into WordPress.org posts (although, connecting to Google Photos does appear to be an option for hosted WordPress.com users).   While there are some robust plugins that allow you to connect to Google Drive, as well as a Google Photos gallery plugin (both require setting up Google Developer Api credentials), there doesn’t appear a way to import an individual image.

Old Manual Method

If you are not using the device you initally used to take your photos (ie cell phone) to manage your posts,  you would need to download your Google photos to your computer then upload and insert them into WordPress posts. And, unless you’ve renamed your downloaded image files before uploading them to WordPress, they will have the original numeric non-descriptive filename assigned by Google Photos.  Depending on your WordPress settings, you may also need to manually resize the image to fit within posts.  This isn’t necessarily a terrible approach, but the whole purpose of Google Photos is to keep all your images in one place rather than installing them on every device you use.  Of course, you could just delete the duplicate downloaded photos from your computer once you’ve uploaded them.

Copy/Paste Solution

This method is quick and easy once you have installed the Auto Upload Images plugin.  All you have to do is copy/paste the Google Photo image, paste it into your post using Add Media, and the plugin does all the work.  Auto Upload Images will resize, rename and import your image, then update the image source to point to the imported file in your media browser.

The two key benefits of using this method is that images are automatically imported to your WordPress media folder and the imported image is resized and renamed according to the settings you defined in the plugin.

  1. Copy the image source URL from Google Photos
  2. Paste the image source URL into the Add Media dialog box using Insert from URL
  3. The plugin automatically resizes, renames, and imports the image to your media folder.

Download, Activate and Define Auto Upload Images Plugin Settings

Once you have installed the Auto Upload Images plugin, navigate to Settings in Admin and select the plugin.

  • For SEO purposes, set Image Name to %postname%-%random%.  This will automatically replace the long Google Photos numeric filename with the title of your post and add a random string so each image in the post has a unique filename.
  • If you will be adding an alt description manually, leave ALT Name at %image_alt%, otherwise change it to %postname%.
  • Change Image Size to the size you want all imported post images to use.  Save your setting changes and the plugin will automatically kick in anytime you use an external URL source as an image.

Detailed Guide

  1. Open Google Photos and click on the image you would like to use.
    1. Once the full size image pops up, right click the image and select Open image in new tab
    2. Copy the URL located in the new tab’s address bar.  It will contain …googleusercontent.com…
  2. In your WordPress post, click Add Media
    1. In the Add Media dialog box, select Insert from URL (located on the left)
    2. Paste the URL you copied from Google Photos into the http:// section at the top
    3. Click Update (or Publish) to save the new image.

Once you have saved your post, the Auto Upload Images plugin will automatically import and save the Google Photo image to your media folder and replace the Google Photo image source with the new imported WordPress image source according to the settings you defined in the plugin.

One More Tweak

The only drawback to this method is that WordPress automatically adds the original height and width attributes to the images, not the resized attributes.

To remove these attributes from your post’s page, add the following to the bottom of your single.php file.  This will only affect images on the view post screen, not the edit post screen.

<script>
// remove height and width attributes on post images
jQuery(document).ready(function ($) {
    jQuery('.post img').removeAttr('width').removeAttr('height');
});
</script>