Monday, March 6, 2017

Flickr Album in Canvas

I've got a Flickr album with my Growth Mindset cats, and you can see that album here: Growth Mindset Cats. Flickr offers an embedding option so you can insert an album slideshow, including in a Canvas Page. Click on the Share (arrow) icon which is on the left, below the number of photos, to share an album:

You can then configure how you want to embed the slideshow:

Now, in a plain text editor, paste in that embed code from Flickr, and save it as an .HTML file. You don't need anything else; just the embed code that you have copied from Flickr. Upload that HTML into the Files area of your Canvas course.

For example, I called mine GrowthCatsFlickr.html, and you can see it here: Flickr album in Canvas File.

In the web address for that Canvas file, you can get the Canvas domain, the course number, and the file number, and use that to fill in this iframe snippet. You'll also want to choose a width and height that will work well for your album (it's easy to adjust later).

<iframe style="display: block; margin-left: auto; margin-right: auto;" src="https://______/courses/______/files/______/download" width="___" height="___"></iframe>

So, for example, here is what I will use for my Flickr album:

<iframe style="display: block; margin-left: auto; margin-right: auto;" src="" width="420" height="600"></iframe>

Now, I'll create a Canvas Page, and I'll paste the iframe into the HTML editing view of the page. Here is the page: Flickr Album in Canvas, with a screenshot. The left-right arrows move you through the album, and each image links back to its Flickr page; you can see the page in action here: Flickr Cats in Canvas.

You can also insert a Flickr album into a Discussion Board if you want students to choose images to respond to:

And just for fun, I'll embed the actual album here too: it can go anywhere that javascript is accepted. :-)

Growth Mindset Memes

This post also appears in the Canvas Community Instructional Designers group.


  1. Is there a way to share a slideshow or some facsimile of a "gallery" from Flickr on Canvas?

  2. Hi Jonathan! Yes, this is what I've described in this post; it's a bit tedious, but it does work! Because the Flickr slideshow involves javascript, that means you have to upload it as a File first, and then iframe that File into a Page, just like with Twitter widgets.
    Alternatively, if you have https webspace of your own, you can avoid the Files area of Canvas: just upload the Flickr album to your https webspace, and then iframe that into Canvas. I hope that makes sense; once you get used to the process, it's not too bad! :-)