Laura Gibbs

Pinterest in Canvas

Blog Post created by Laura Gibbs on Mar 5, 2017

I'm a huge fan of Pinterest, one of the ways I use it for my classes is to create a Board for each class each semester where I pin the stories in my students' projects. The projects are up and running now, so here are the Boards: Myth-Folklore and Indian Epics. As you can see, I embed the Boards on the Project Directory page for each class, and in this post I'll explain how you can also embed Pinterest Boards like that in Canvas; click here for the Canvas Page:

You can create all kinds of widgets for Pinterest accounts, and the option I used here was to create a custom-sized Board. To create a widget, just click on the ... menu you see at any Board:

Then, configure your widget by filling in the blanks provided:

This will generate a custom code for your widget, plus a standard javascript snippet. These will both appear on the widget design page down towards the bottom:

Now, in a plain text editor, paste in both chunks of code, and save the text file with an HTML suffix. You don't need any other code; just the two snippets provided by Pinterest:

Then, upload it to your Canvas space. For example, I will call my file IEPinterestBoard.html, and you can see it here: Pinterest Board in Canvas File.


In the web address for that Canvas file, you can find 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 Board (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 Pinterest Board:


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


Now, I'll create a Canvas Page, and I'll paste the iframe into the HTML editing view of the page. You can also add any other page content that you want!


Here is the resulting Pinterest: Indian Epics. Now, as I pin new stories to the Board from my students' projects (there are new stories every week!), those pins will show up automatically inside Canvas.


I also have the Board embedded in our class wiki page; Pinterest Board widgets work wherever javascript is accepted.