by Laura Gibbs (@OnlineCrsLady). URL: Domains.LauraGibbs.net
This is a Guide for my presentation at Domains on June 11, 2019. It is also a Guide you can use anytime anywhere to learn about randomizing content widgets built with the free RotateContent.com tool... this tool was built by an OU student back in 2003 (not a typo!), and it is still going strong. :-)
Table of Contents
My goals for the conference presentation:
Listen and Learn
10 min.: Tour the Canvas Widget Warehouse, learn more about RotateContent.com features.
10 min.: Build your own custom Magic 8-Ball script using RotateContent.com.
5 min. Brainstorm, share, question-and-answer.
To get things started, I want to quickly show you some examples of randomizing scripts in action in some of my webspaces. All these scripts (and their images too) are hosted in my Reclaim space, and that Reclaim-hosted content is then deployed in these other spaces. Screenshots below are static; click on the link to see what the widgets serves up for you at random.
Randomizers work great in blog sidebars! Here are some examples:
Made for Domains: Magic 8-Ball and Tarot
There's a Magic 8-Ball in sidebar of OU Digital Teaching. Later in this presentation, you'll have a chance to make your own Magic 8-Ball. There's a Tarot card randomizer that I made there also. In fact, I made two Tarot decks: one with the cards right-side up, and one with the option of cards reversed for those of you who want to explore that other side of the deck. (It freaks some people out, but hey, it is part of the Tarot tradition.)
Class Announcements: A blog... inside Canvas
There are a lot of different randomizing widgets in the sidebar of my Class Announcements blog, with Growth Mindset cats at the top. Each different cat has a link to a blog post with more details. Check out that blog sidebar for more randomizers. I use that external blog as my Canvas homepage; same blog, two classes: Myth-Folklore and India.
The blog inside Canvas:
Different cats in those screenshots because it's a random cat whenever the page loads, either inside Canvas or as a freestanding blog.
Browsing the Freebookapalooza Library
Randomizers are great for really large amount of content, like the 1000+ books at my Freebookapalooza of free full-text books online. You can see a 200-pixel-wide widget in the sidebar that shows a random book (it links to a post at the blog), and in the blog pages there is a 400-pixel-wide version of the same widget; you can see different randomizers for the main areas Africa - India - Native American - Pacific. (Each book links to a post at this blog.)
In the India Page space, there's a script with just the India books. In the sidebar, there's a script that displays a script at random (because, yes, you can build a randomizer of randomizers) drawing on all the areas of the Freebookapalooza Library.
Browing the ACK Comic Books in OU's Library!
I use a similar approach at the Amar Chitra Katha comic books blog where I share all the comic books in the OU Library that are relevant to my Indian Epics course, with a 200-pixel-wide randomizer in the sidebar, plus some 400-pixel-wide randomizers on the blog pages for the subareas: Ramayana - Mahabharata - Krishna - Divinities - Legends - Folktales. Yes, we have the complete ACK collection (shout-out to the awesome people at OU Libraries!), and the randomizers help surface those titles for the students to see/browse.
So, for the Divinities Page, there's a 400-pixel-wide randomizer of just those comic books, while the randomizer in the sidebar is showing comic books from any of the areas, 200-pixel-version. As you'll see later, you can manage all this content in a single spreadsheet so spitting out these different scripts for different widths doesn't take more than just a few minutes.
My Big Brer Rabbit Project
At the Brer Rabbit blog, there's a 400-pixel-wide random illustration on the homepage, and a 200-pixel-wide version of the widget in the sidebar that appears on every page. There is just one image file; I configure the scripts with different widths (see Advanced Tips below for image management strategies; the spreadsheet approach makes that super-easy).
For example, on the homepage of my course wiki you can see a student project displayed at random, linking to students' past class projects. I've got literally hundreds of student projects in the archive, so the powers of randomization are working great here to surface all that content. I use this widget all over the place in my different course webspaces because constantly surfacing the student projects is the best way I can support and inspire current students working on their own projects:
On the weekly assignment pages at the wiki (here's a typical week), I include a random graphic, each of which links to a blog post at one of the class-related blogs (writing support blog, reading support, etc.). The students look at these assignment lists repeatedly each week; this way there are inspiring or thought-provoking graphics so that the page is different each time.
I also use randomizers in the specific assignment pages at the wiki for students commenting on each other's blogs and on their websites; I use a spreadsheet to update these widgets weekly. The script stays the same; I just update the content weekly. I don't have to change the webpage — I just update the script. I have approximately 90 students in my classes, and randomization is a great way to spread the comments around so that everybody, overall, gets the same number of comments:
So, for example, here are those random growth mindset cats in a Canvas Page. The Canvas course is open, so just click and go; see what cat pops up for you there! (This is a resource class where I share information about growth mindset and feedback with students across my different classes, along with anyone else who is interested.)
I've also got a Canvas Widget Warehouse for anyone who wants to use my scripts in Canvas; I'll say more about that later.
The same iframe solution that works in Canvas also works at Google Sites! Here's an example at my class project for Indian Epics last spring; there's a random South Asian Hanuman on the left, and an Indian Hanuman on the right: Hanuman in the Ramakien - Random Art.
Take a look and see what Hanuman images you see. Each one links to its own post at the Indian Epics Images blog where you can learn more.
And now... if you would like to quickly create a simple randomizer of your own, I've got some options here for creating and deploying a Magic-8 Ball. Divination by randomness! To see how it works,I also put an English version in the sidebar of my Digital Teaching blog.
I've also created a Latin version for the sidebar of my Latin blog: Bestiaria. (The ancient Romans would have loved this; so much cleaner than cutting up sheep or chickens in order to inspect their entrails as in their divination practices...)
Customizing the 8-Ball. You can use the classic responses or change them to whatever you want. You can also have way more than 20 possibilities; you are not limited by the physical icosahedron as in the physical Magic 8-Ball.
Here are three different ways you can play with the possibilities:
STEP BY STEP DETAILS:
That works a little differently for each option:
HTML: Right-mouse click and save the file to your desktop so you can open and edit using the HTML editor of your choice:
Spreadsheet: From the File menu, choose the Make-a-Copy option:
You can type text, and you can also use HTML tags for formatting if you want.
HTML: Save the edited file when you are done.
Spreadsheet: When you are done, you need to copy the left column of the spreadsheet into an HTML file, which you can create with a plain text editor, or just use editpad.org if you don't have a handy plain text editor. Copy the left column, paste into the plain text editor, and save the file with an .html suffix.
Log in to your domain and upload the file with the File Manager (you can put the file wherever is convenient for you). You can also upload the HTML file if you want for future reference, but that is not necessary for the script to work.
If you want to just use my script, you can do that; scripts are totally shareable! Here's how that works for my 8-Ball script, hosted at my Reclaim space: just copy and paste this snippet and insert it in your own webspace if you want:
If you want to use my Latin Sphaerula Divinatoria, you would use this snippet instead (different file name):
This 8-Ball script is only returning the random bits of text, the bits of text from the HTML file. The rest of the presentation (the 8-Ball image, the horizontal rules, etc.) is static content around the dynamic content. For example, in my Bestiaria sidebar, I put the script in-between two horizontal rule lines, with the random content centered, and also bolded and italicized. You can also build scripts that have images, formatting, etc., but for the purposes of this demonstration, I chose a text-only approach to the script content (for more about scripts with images and other multimedia, see below).
For example, here's the page where I share the Growth Mindset Cats. You can see the script in action there, and it has all the links and information needed to deploy the cats in your own Canvas Page.
Which is why every Canvas user needs Reclaim Hosting..........!
Here are some ideas to think about:
Random keeps site content fresh.
If you have pages that students visit repeatedly (syllabus, calendar, etc.), a randomizing script can make sure there is something new each time the page loads. You never know what will prompt someone's curiosity!
Random adds an element of fun and mystery.
Random is a way to surface large amounts of content.
There's nothing like a long list of links to stifle the browsing experience, especially for the links way on down the list. Randomizing widgets are a way to surface content more effectively than a long list of static links.
If you want to update a script (fixing errors, adding content, etc.), you update the script once, and the updated content appears everywhere. It's a great example of POSSE in action: Publish (on your) Own Site, Syndicate Elsewhere.
Syndication can mean across your sites but also across other people's sites too! If you share your script address with others, they can display your content in their own space, and they will get the updated version of the content automatically as you maintain and update your scripts.
In short: instead of using an HTML table as a kind of kludge to maintain a data array, what if there were a randomizer feature that was available through a true content management system?
As you can see, the HTML table is just a throw-away part of this system, a way to provide the creator with a familiar interface in which to organize the content in a way that can be converted into an array. That's why it is actually just as easy, or maybe even more easy, to put the content into a spreadsheet, using the structure of the spreadsheet to provide that array-like interface.
If anybody is interested in working on something like that, I am glad both to contribute content and to be a guinea-pig user in the experiment. :-)
*** Whoo-hoo: Bryan Ollendyke has already got some ideas about randomizing HAX: see his tweet. :-)
I will list out here some of my favorite strategies and lessons learned from many years using this tool for many purposes.
<iframe src="https://widgets.lauragibbs.net/canvas/gmcatsjava.html" width="450" height="800"></iframe>
As you can see, it's an iframe, and the webpage that the frame holds is a webpage in my Reclaim Hosting space. The webpage looks like this (click the link; you'll probably see a different random cat):
In other words, it's nothing but the content returned by the script. Here's the HTML view of that page:
Yes, there are drawbacks to the iframe workaround. Two drawbacks in particular:
Height. If you use widgets where the content has variable height (like images), you probably are going to have to set the height value to an artificially large size to accommodate the tallest possible image.
But hey, those design limitations are a small price to pay for being able to bring dynamic content from outside into the otherwise extremely static world of the LMS!
So, for example, if you are trying to develop content that will display in an environment like Canvas, it is essential that you use https for the iframe page, along with the script and all the assets (like image files) that are being called by the script.
Also, keep in mind that links in the scripts should also be https OR you should open the links in a new tab. As a general rule, I configure the links to always open in a new tab because you never know just what kind of environment in which people might be using your scripts. In Canvas, for example, the Pages spaces is a terrible place in which to open webpages (students cannot even see the URL of the page), so I'd recommend configuring all links in a script to open in a new tab.
As mentioned above, you need to use absolute links and https to make sure your images will display properly when the script runs.
In addition, you can also think about being strategic with image width formatting. As mentioned above, I often create two different versions of a script: one with images that are 200 pixels wide to display in a typical blog sidebar, and one with images that are 400 pixels wide to display in the body of a blog post or webpage.
I usually include 200 or 400 in the file names in order to remind me what's what. For example, here are the growth mindset cat scripts:
I create almost all my scripts using spreadsheets instead of an actual HTML editor. You already saw a simple example of that in the Magic 8-Ball above, where the spreadsheet had two columns: one column for the content you type in, and a column where I used a "concatenate" formula to add the HTML wrapper to each content row.
To see how that works, here's my Tarot spreadsheet. For each card, I have the name of the card, the URL of the Wikipedia article about that card, plus the URL of the image file from Wikipedia that I'm hosting, plus the widget of the image (same for all rows) and the general information page for the widget (same for all rows).
Randomness at random! That's also how the randomizer works on my weekly course content pages, choosing at random a randomizer that I built for each of the class support sites.
Date-based content is very similar to the random content. The only difference is that in the left-hand column of the HTML table there is a date instead of the word "random." The RotateContent.com site will generate the HTML files you need for that, based on daily or weekly content, content for a specific year or perpetual (i.e. good for year after year), etc. Just follow the steps at the RotateContent.com site for Date-Based Content: Fixed Date and Perpetual.
In addition, you can randomize the date-based content if you want to provide both a date-based and a random version of the same content. The key to that is adding a variable to the script call; here's an example of how that works:
In addition to date-based content that you create, you can use RotateContent.com to create a date-based progress meter. You can see how that works here: Progress Meter. And you can also get a sense of how old this system is because the graphics for the Progress Meter come from the Windows XP graphics collection. Yep, Windows XP was all the thing back in 2003 when Randy created this website. For more about the history of RotateContent, read on!
Within just a few weeks, Randy came up with a very elegant solution that's still going strong over 15 years later at RotateContent.com, the online home of the conversion tool which Randy continues to host, making it free for all to use. THANK YOU, Randy! There are a few things that look a little weird there now, but what site doesn't look a little weird after 15 years, right? Main point: it still works great, and I create new scripts with it all the time (including each week for my classes, randomizing the newest blog posts for commenting).
And if you're curious, Randy is now a maker of board games at FoxTrot Games!
I hope people will ask questions. Then I can write FAQs! Even just AQs for any question asked, frequent or not. :-)
I'll be doing a presentation on Tuesday... but all the materials you need are right here in the Guide, so you definitely feel free to go weaponize your website with Jenn Hill from UMW, or hear the Blaxites story from sava saheli singh and Tim Maughan. You can ambush me anytime at Domains or at Twitter to hear me preach the gospel of random. :-)
This is the proposal I submitted (I'm including it here to make sure I remembered to include everything promised there, since I'm guessing that in 20 minutes we won't actually get through it all...)
Speaker: Laura Gibbs
Even better: others can use your script too! Just share the script address with them and they can use the script to display your content in their own webpages, blogs, etc.
My goals for the presentation:
• Explore the power of random content for sharing massive quantities of digital stuff and also for promoting student engagement in online course spaces.