My first Google Gadget to embed a flickr photoset with Galleria navigation

The xml link for this is here 

Google Gadgets are really easy all you need to do is wrap some XML around html content.

Here’s more info on getting started and there is even an online editor for creating and hosting your own gadgets

If you’re interested in developing gadgets for Google Apps, the following guides will help you get started writing gadgets for the different Google Apps containers:

The code I used

<?xml version=”1.0” encoding=”UTF-8” ?>
<Module>
  <ModulePrefs title=”__UP_myname__” author=“mhawksey”author_email=“m.hawksey@gmail.com” author_location=“Edinburgh”directory_title=“FlickrGalleria” title_url=”__UP_mylink__”description=“Emebed a flickr photoset with Galleria navigation”
    <Require feature=“dynamic-height”/>
  </ModulePrefs>
  <UserPref name=“myname” display_name=“Title” required=“true”default_value=“Galleria/Flickr Show” />
  <UserPref name=“mylink” display_name=“Title link” />
  <UserPref name=“photoset” display_name=“Photoset” required=“true”default_value=“72157626051720912”/>
  <UserPref name=“mywidth” display_name=“Width” default_value=“100%”/>
  <UserPref name=“myheight” display_name=“Height”default_value=“600px” />
  
  <Content type=“html”>
  <![CDATA[ 
  <script type=”text/javascript”>
    _IG_AdjustIFrameHeight();
  </script>

   <style type=”text/css”>
#galleria {
    width: __UP_mywidth__; 
  height: __UP_myheight__;
}
</style>
<script src=”http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js”></script>
<script src=”http://www.rsc-ne-scotland.org.uk/mashe/galleria/galleria.js”></script>
<script src=”http://www.rsc-ne-scotland.org.uk/mashe/galleria/plugins/galleria.flickr.js”></script>
<script>Galleria.loadTheme(‘http://www.rsc-ne-scotland.org.uk/mashe/galleria/themes/classic/galleria.classic.js’);</script>
<div id=”galleria”>Loading…
<script type=”text/javascript”>
    api_key = ‘4bb2dc0f5e1ef29c928d7e138c489508’
    var flickr = new Galleria.Flickr(api_key);
    flickr.getSet(‘__UP_photoset__’, function(data) {
        $(‘#galleria’).galleria({
        data_source: data,
        image_crop: false,
        show_info: true,
        autoplay: false,
        transition: ‘fade’,
        preload: 3,
    });
});
</script>
</div> 
   ]]> 
  </Content
</Module>

Last updated by at .

1 Response to “My first Google Gadget to embed a flickr photoset with Galleria navigation”


Comments are currently closed.

About

This blog is authored by Martin Hawksey Google+

JISC CETIS Learning Technology Advisor (OER Programme Support)
jisc cetis logo

The MASHezine (tabloid)

It's back! A tabloid edition of the latest posts in PDF format (complete with QR Codes). Click here to view the MASHezine

Preview powered by:
Bluga.net Webthumb

The MASHebook

You can also download this post as:

Subscribe to monthly email digest of posts

Loading...Loading...


Subscribe to per post email updates

Enter your email address:

Delivered by FeedBurner

Copyright License

Creative Commons Licence
This work is licensed under a Creative Commons Attribution 3.0 Unported License. CC-BY mhawksey

Privacy /Cookies

This blog uses Google Analytics (which makes use of 'cookie' technologies) to provide information on usage. Here's an overview of Google Analytics Privacy and how to opt-out (other 3rd party services like Twitter might also be tracking you via this site, but as far as possible I try and prevent this by removing official tweet buttons).

Badges

. . .