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.

  5. Andy said on May 10, 2018 at 12:30 am

    Tom, am I missing something blindingly obvious here? I’ve found the php file over on GitHub but my (hosted) wordpress won’t accept that as a plugin. I’ve tried uploading both as a php file and as a zip but either way it’s rejecting it. It sounds as though it’s just what I was looking for so I’m sure it must just be me being a numpty.

    • Tom Woodward said on May 15, 2018 at 10:11 am

      Hey Andy,

      Are you seeing any errors? What exactly is happening?

      And when you say hosted, do you mean self-hosted (as opposed to wordpress.com which is what I’m seeing in your comment info)?

  6. Regina Ramey said on August 25, 2018 at 10:17 am

    Thanks so much for this! It was exactly what I was needing for my class website. I really appreciate that you provide this for free, since as a teacher I can’t afford to pay for things! 😀 You are an awesome guy!!

    • Tom Woodward said on August 25, 2018 at 8:13 pm

      Glad to hear it Regina. I understand that position well.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Trackbacks and Pingbacks on this post

No trackbacks.

TrackBack URL