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! 🙂

  2. franciscorappgmailcom said on January 30, 2017 at 9:11 am

    Hi,
    I really loved your plugin. It does exactly what I needed.
    I’m using the “grid” view and works perfectly but I would like to change the size of the preview of the files inside because they’re very small!
    Setting the parameters of height and width only affects the size of the “window”.
    Is there any possibility to enlarge the icons inside?

    Thank you very very much.

  3. philippe said on August 25, 2017 at 5:40 pm

    Awesome. Sounds and looks exactly to what I’m looking for, the only problem is I haven’t figured out what plugin to install and how to make it work. Just to let you know I’m a very basic WP user with the minimum knowledge about any programming, but I would love to try to do make this plugin work on my webpage, even if a little programming is needed.

    • Tom Woodward said on August 31, 2017 at 7:28 am

      There’s a link to the plugin in the body of the post. Just download it from GitHub and upload it to your plugins and activate as normal. Directions on doing it from outside the plugin repository are at the bottom of this link.

  4. Stewart Thompson II said on September 8, 2017 at 4:05 pm

    This is awesome! Is there a way to have it sort alphabetically descending rather than ascending?

    • Tom Woodward said on September 11, 2017 at 3:33 pm

      I can’t find any parameters listed that would apply. I’ve guessed at a few combinations but no luck so far. Using Google Sites as a test hasn’t given me any good parameters either.

Leave a Reply

Trackbacks and Pingbacks on this post

No trackbacks.

TrackBack URL