Improved Google Folder Shortcode Plugin


creative commons licensed ( BY ) flickr photo shared by Steve Snodgrass

In December I wrote a tiny shortcode plugin that would let you embed Google Folders in WordPress. It was mainly to get around the iframe embed issues in WordPress Multisite. This interaction seems to make a number of faculty members pretty happy.

So tonight when I got a comment asking how you’d get the plugin to display a grid view instead of the list view I decided to take another look at things. The short answer is that you could not do that with the old plugin. Now that I’m pretending to write code and stuff I thought I might be able to fix that and it turned out to be fairly simple. While I was in there I also added the ability to manually set height and width parameters.

The new plugin is here. It doesn’t like it when I run both on the same blog (I assume because of the shared shortcode name) so this demo required that I turn off the older plugin.

To make the changes I followed the Codex advice on handling attributes.

<?php

function gdrive_shortcode($atts, $content=null) {
    $a = shortcode_atts( array(
         'id' => '', //make a name for the id of the folder
         'style' => 'list',  //make a name for the view style and assign it the default value "list"
    ), $atts); 
	return '<iframe src="https://drive.google.com/embeddedfolderview?id=' . $a['id'] . '#' . $a['style'] . '" frameborder="0" width="100%" height="500px" scrolling="auto"> </iframe>'; //return this code w the variables interwoven
}
add_shortcode( 'gdrive', 'gdrive_shortcode' ); //make your shortcode all official

This stuff still feels like magic to me. I realize how little actual skill and knowledge I posses in the scheme of things but it is amazing fun to be able to make things that function in the real world.

List View

Adding the opening and closing square brackets to this gets you the view below
gdrive id=”0B_9l84KvUJBWODM4YjY3MGMtZGMzMS00MjI0LTk0NGQtNDgxMTRjMmNlODZl” style=”list” width=”60%” height=”200px”

Grid View

Adding the opening and closing square brackets to this gets you the view below
gdrive id=”0B_9l84KvUJBWODM4YjY3MGMtZGMzMS00MjI0LTk0NGQtNDgxMTRjMmNlODZl” style=”grid” width=”100%” height=”300px”

No Style/No Height/No Width

Adding the opening and closing square brackets to this gets you the view below (it defaults to list view, 100% width, and 500px for height)
gdrive id=”0B_9l84KvUJBWODM4YjY3MGMtZGMzMS00MjI0LTk0NGQtNDgxMTRjMmNlODZl”

Comments on this post

  1. Arne Ameye said on May 22, 2016 at 9:43 am

    Hi,
    I’ve been looking for a plugin like this.
    However I’m having a problem in actually showing the files on my website…
    It says “Error 404 Not found” where the list/grid should be.
    Anything I might have forgotten?

    Kind regards,
    Arne

    • Tom Woodward said on May 22, 2016 at 10:07 am

      If you want to share the embed code you’re using and the link to the post where you’re getting the 404, I’ll take a look.

      • Arne Ameye said on June 19, 2016 at 5:36 am

        Sorry for the late feedback. I had finals and totally focused on those.
        So I’m using the shortcode like this: [gdrive id=”0B6TjbmtN-l94WUF4MWFDaUdmQU0” style=”grid” width=”100%”]
        And this is the page that I want to show the google drive document(s): http://hoevevissers.be/wedstrijden/

        • Tom Woodward said on June 19, 2016 at 7:57 am

          It works for me. I did have to make sure I got rid of the “pretty quotes.” Try the version below.

          [gdrive id="0B6TjbmtN-l94WUF4MWFDaUdmQU0" style="grid" width="100%"]

          • Arne Ameye said on June 20, 2016 at 5:22 am

            Yes, it works now! Must have been the pretty quotes. Thanks a lot for helping me out and especially for making the plugin! 🙂

Leave a Reply

Trackbacks and Pingbacks on this post

No trackbacks.

TrackBack URL