New Canvas Course: Laura’s Widget Warehouse

Sure sign that you are a nerd: the very first thing you want to do on the very first morning of winter break is . . .  build a Widgets Warehouse in Canvas, ha ha. But seriously, that’s what I wanted to do this morning.

So, here’s what I’ve got so far: Widgets.MythFolklore.net. (Yes, that’s an example of a custom URL for a Canvas course: very useful! Find out more.)

That takes you to Laura’s Widget Warehouse, a new public course I just created in Canvas (and thank you, Canvas, for letting us create courses like this on our own; we didn’t have that freedom in D2L).

The purpose of the course is to provide a kind of catalog for widgets that I am creating based on what I’ve learned about widgets in the mixed-content era (https required!), and also about widgets in Canvas (no javascript allowed; only iframe). I’ve been making widgets like these for over 10 years, but now in the mixed-content era, I am going to have to start systematically re-creating the widgets I want to keep. So, one of my projects for 2017 is to figure out which widgets are worth that extra effort… and of course it will also inspire me to make new widgets. As I create or re-create each widget, I’ll write up a catalog page for the Widget Warehouse.

Here’s what I mean by a catalog page: Widget: Growth Mindset Cats. The catalog page links to the content source that supports the widget (it’s almost always one of my blogs). There will be a link to the source for both the https javascript and for the Canvas-friendly iframe. There will also be a brief description of the contents of the widget along with a link to the source table so that anybody who wants to use the widget can see all the potential content in advance (no surprises). I’ve also included links to examples of where/how I use the widget for my own classes.

As you can see, there is no real new content in the Canvas course, and I have no interest in creating content inside Canvas; I far prefer my blog network for creating and sharing content. There is, however, real value in creating a catalog like this in Canvas… even just for selfish reasons: it will help keep me organized as I work through this widget redesign process. So, as often with things online, I’ll be getting the benefit of it whether or not others use it — but if this can be useful to others, so much the better!

Feel free to use my scripts or, even better, perhaps seeing how I use the RotateContent.com script tool will inspire you to make your own. As this project evolves, I’ll be writing up some tips and how-tos for creating your own widgets. Now that my students also have access to https webspace through OUCreate, I am thinking they might even be interested in giving this tool a try,

I’ll have more to say about all that as this project evolves in the coming semester. During the semester, I don’t have time for a really sustained project like I do during the summer, but something like this should be great: when I find myself with a free morning or afternoon, I can pick a widget, redesign, and add a new page to the catalog.

And when I have a whole day free… I can create new widgets! YES!!!

So, more about all that later: this is just the inaugural post in what should be an ongoing series on Widgets for Canvas. 🙂

Advice from the cats:

Immerse yourself in a project, and create something new.

 

Crossposted at OU Canvas Community.

Become a Javascript Wizard in Canvas: HTTPS is the key

I’m taking a break today from the series of posts on Grading to share something fun: a Gaudium Mundo javascript for Latin holiday songs during the month of December. My school won’t let me teach Latin, but that doesn’t stop me from making javascripts and sharing them at my Bestiaria Latina blog.

In this post, I’ll explain the double-hack that mere mortals need to display javascripts inside Canvas. All it requires is the magic of HTTPS webspace so that you can host both the javascript and also the HTML webpage that you will use to sneak the javascript into Canvas. Here’s how it works:

1. Create your javascript. I use the wonderful free tool RotateContent.com to create my javascripts; I’ll write up a post later about just how that works. Zero programming required! You just create an HTML table of the content you want to use (date-based or random), and then RotateContent generates the script for you. For Gaudium Mundo, I made two scripts: one 400 pixels wide, and one 200 pixels wide. New songs appear automatically each day of December; I don’t have to do anything. It’s automatic! 🙂

2. Create an HTML webpage. Next, I create a vanilla HTML webpage which does nothing more than call the script. You can see the page here: Gaudium Java. When I said vanilla, I wasn’t kidding! All it does is call the script.

3. Use iframe in Canvas. Then, all you have to do is use iframe to embed the contents of the HTML page where you want it inside a Canvas page. For example, here I split the page and made the script display in the right-hand column: Javascript: Gaudium Mundo.

screen-shot-2016-12-02-at-10-37-53-am

If you are a Latin teacher and want to use my script and page, go ahead; I am glad to share! You will find the iframe code there on the Canvas pageand if you want the script for use in a blog where javascripts are allowed without the extra layer of the iframe, you can get the javascript here.

And whether or not you are a fan of Latin holiday songs, I hope this might inspire other Canvas users who have access to HTTPS webspace to experiment with creating javascripts and displaying them inside Canvas. It is a fun and easy way to add dynamic content to your classes! Plus, you can choose to share your scripts with others if you want. For more examples, see my Writing Motivation widget in Canvas, and … of course … the Growth Mindset cats in Canvas.

screen-shot-2016-12-02-at-10-36-08-am

Thanks as always to Reclaim Hosting for putting the magic power of HTTPS under my control. We can all be javascript wizards in Canvas this way!

screen-shot-2016-12-02-at-10-34-28-am

Crossposted at OU Canvas Community.


Here’s the script in action:

Canvas Hack: Repeated Quiz Content

Yesterday I explained how I have “hacked” the true-false quiz format to create a Grading Declaration system so that students do their own grading: Student Gradebook DeclarationsIn today’s post, I want to explain another hack that helps me manage repeated quiz content that recurs from week to week. This hack might be useful to anyone who uses repeated quiz content from week to week for whatever reason, either in a Declaration-style system or for some other recurring purpose.

Here’s the problem: Canvas does not understand repeated content. If you have a quiz question one week and you repeat that quiz question in another week, they are completely separate entities. If I copy quizzes, Canvas doesn’t understand that they are copies; if I use the question bank, Canvas does not update existing instances when you change a question bank question. The result: if I decide to make a change (to fix an error or to make any other change), I have to go to each quiz and edit the question again, and again, and again, week by week by week. This was really frustrating for me. REALLY frustrating. I’m always trying to tinker with the language in the Declarations to make them as clear as possible and also to fix the inevitable typos, etc. Having to spend 30 minutes or more just to correct one error in one Declaration, going click-click-click through one week after another, is a terrible use of my time, not to mention the way that it introduces even more opportunities for errors to creep in. Ugh.

In D2L, I did not have this problem. The D2L question bank was no help (it did not update quizzes containing questions if the questions were later edited), but if you used the D2L “copy” feature, D2L would remember that questions had been copied one from another. So, if I created a Declaration quiz for Week 1, and then copied that to Week 2 and Week 3 and so on, D2L understood the connection. If I needed to make a change or correction later on, D2L would ask me if I wanted to apply the change to all the other instances of the question. You could say yes or no, and I always said yes, so D2L would automatically update all instances of the repeated question (if you said “no,” then D2L would sever the connection, no longer considering the questions to be the same).

My Canvas hack. So, after pondering this problem all summer, I came up with a solution, a weird solution, but it’s ended up working really well. Since Canvas refuses to let me create connected content, I decided that I would host the content remotely, and then display it via a remote-linked image, along with a link to the text for students who, for whatever reason, couldn’t read the image. You can see an example of what I did here in a Reading Declaration, one of 24 Reading Declarations that appear in each of my two classes (48 instances total per semester). 

screen-shot-2016-11-30-at-10-31-23-am

As you can see, the content of the Canvas quiz question is an image which is remote-hosted (image file) and displays as part of the quiz, along with a link to the quiz text (text file). This exact same remote image and link appears in each Declaration, week by week, matching the assignment instructions. Even better: this solution works across my two classes, which makes this hack even more efficient than my D2L system (which required me to make the same changes to my two classes separately). So now, if I want to make a change to a Declaration, I just edit the assignment and update the image and the text file — presto, the new image appears in all the quizzes, and the link is the same link but it leads to the new text. I don’t even have to do anything in Canvas at all!

The magic of HTTPS. The key to making this solution work is having HTTPS webspace so that the images I use in Canvas will not be blocked out according to the mixed-content rules which require that remote linked images come via HTTPS. I am so lucky that the Domain of One’s Own project at my school, powered by Reclaim Hosting, gives me access to HTTPS webspace. That’s also the key to making my javascripts run in Canvas; I’ve written about that here: New Countdown Widget on Homepage.

Final thoughts. So, I am really pleased with this solution… but the failure of Canvas to support quiz content reuse is very frustrating. One of the boons of digital content is distributed content for effective editing and reuse, but the folks at Canvas don’t seem to have figured that out. They could take a lesson from D2L in this regard: the way D2L handled quiz question reuse was not ideal, but it was far (FAR) better than the lack of support for quiz question reuse in Canvas.

Of course, this quiz question conundrum is part of a much larger problem with content reuse, as I explained here: Open Content: Resources, not Courses. Digital tools should encourage us to review and improve our work, and also to distribute it widely, sharing with others. Unfortunately, the Canvas approach does not encourage you to improve and reuse content; just the opposite: it creates a burden that can discourage people from reviewing and improving, deterred by the click-click-click of mindlessly having to do the work of the machine ourselves.

This growth mindset cat is ready to review and improve! 🙂

20283272652_ef8715bb7e_o-1

 

Crossposted at OU Canvas Community.

 

New Countdown Widget on Homepage

As we get near the end of the semester (as of today, there are five weeks of class remaining), I wrote up a new “countdown” widget for my class, and I thought that would be something good to share here as an example of simple date-based widget. In this post, I’m going to focus on the nitty-gritty of how to make the widget. Meanwhile, you can see that this widget is also related to time management; more about that here: time management posts.

How does the widget work? I created this date-based text widget using RotateContent.com, a free online tool that converts HTML tables to javascripts. As you can see, the countdown widget “counts down” the days until the end of the semester, and alerts students how many points, more or less, they should have based on whether they are trying to finish the class with an A by the end of Week 15 or if they want to finish up before Dead Week in order to have a week off at the end of the semester to prepare for exams in their other classes (Dead Week is has long been a sore spot at my school, as you can read in the student newspaper).

So, voilà, you can see the widget at work in the side bar of the blog here: Class AnnouncementsBecause I use that blog as my Canvas homepage, you can see how it looks here in one of my classes; the countdown widget is under the growth cat and above the Twitter stream; I don’t want to make a big deal about it, but I do want it to be there persistently, updating automatically day by day as we get closer to the end of the semester. My classes are open, so feel free to click and take a look; no log-in required: India.MythFolklore.net:

screen-shot-2016-10-31-at-10-02-02-am

 

Making the widget. Here’s a step by step guide:

STEP ONE. Create an HTML table. The content is dynamic with a date that responds to the system clock, but it doesn’t require any fancy programming. Instead, you create the widget by generating a simple HTML table with the dates you want in the left-hand column and the corresponding HTML content (which can be anything: text, links, images, etc.) in the right-hand column: countdown.html. I actually wrote this using a spreadsheet since the content is basically a kind of formula that repeats, although the formula shifts during Thanksgiving Break and then during Week 15 when it’s no longer possible to finish before Dead Week. So, the content is partly automated (I used the spreadsheet to fill in the dates, the points, and most of the text), but also something I manually tweaked in the resulting HTML table.

STEP TWO. Convert to javascript. After you prepare the HTML table, RotateContent.com converts the HTML table into a javascript. You then need to upload the javascript to your own webspace (RotateContent.com converts the javascript but does not host it for you; you need to do that yourself). If you want to use the widget in Canvas, you need to make sure that you have https webspace so that the javascript and its assets (image assets, for example) will have https addresses that will display properly in Canvas.

STEP THREE. Insert the javascript. Then, you use the https address of your javascript to insert it wherever it is going to go. I happen to put it in the sidebar of my class announcements blog, but I could also put it into a Canvas Page, for example; you can see examples of javascript widgets in Canvas pages in this demo course I created last summer: Canvas.MythFolklore.net. There’s information there about calendar-based widgets, random widgets, and also about how to randomly display a date-based calendar widget (it’s like having two widgets for the price of one).

Thanks to Reclaim Hosting! As always, I am very grateful to Reclaim Hosting and the Create project at my school — check it out at Create.ou.edu — which gives students, faculty, and staff access to their own web hosting space, including an https option that is very (VERY) simple to use.

Aside: I’m also using my Create domain to host this blog so that I can learn more about WordPress in order to provide better support to my students who are also experimenting with WordPress in my classes.

The power of dynamic content. Creating dynamic content like this is one of my favorite things to do! Unlike static content that students have to find manually (click-click-click, where you risk losing them at every click), dynamic content allows you to present fresh content to students automatically either based on the date (something new each day, like this countdown widget) or at random (like the growth mindset cats, with a new cat whenever the page loads). On days when they are doing a lot of work for my class, students might visit Canvas multiple times, and I want to take advantage of that by presenting them with new content. And it’s easy: I just create and insert the widget, and it is ready to go-go-go at any hour of the day or night. I like to get a good night’s sleep… but my widgets are always awake! 🙂

THANK YOU, RANDY HOYT! And, finally, a big shout-out to Randy Hoyt who created the RotateContent.com tool many years ago and continues to make it freely available to everyone online. Randy is an OU alum, a web-maker extraordinaire, and is also a founder of Foxtrot Games, maker of beautiful board games. If you give RotateContent.com a try for yourself, you can say thanks to Randy over at Twitter where he’s @randyhoyt.

Plus… cats.  I also want to sing the praises of Josh Walcher’s writtenkitten.co. I used that to write up the first draft of this blog, and it rewarded me with kittens throughout. Why are my blog posts so long? Blame the kittens! And if you want to thank Josh for helping cats take over the Internet, you can find him at @Josh_Walcher.

screen-shot-2016-10-31-at-10-40-06-am

Crossposted at OU Canvas Community.