Laura Gibbs (laura-gibbs@ou.edu)
July 26, 2005 - 2:30-5:00 pm - NCC 203
2:30-2:45: Introductions
2:45-3:15: Overview of Rotating Content with examples
3:15-3:30: Hands On - Using Rotating Content in Blackboard
3:30-:3:45: Hands On - Adding Rotating Content to a Webpage
3:45-4:00: Break
4:00-:4:30: Overview of the Rotating Content Tool
4:30-5:00: Hands On - Creating a Rotating Content Script
For screenshots, visit the online version of this workshop.
1. Go to Laura's Rotating Content website. Open an Internet Explorer browser window, and type mythfolklore.net in the address bar. This takes you to the mythfolklore.net homepage. Then click on the Calendar icon in the right-hand column. This takes you to the Rotating Content website, http://www.mythfolklore.net/calendars/. Keep this browser window open. You will come back to this site later to choose the javascript you want to add to Blackboard.
2. Go to the OU Blackboard site. Open another Internet Explorer browser window (you can just click Control-N to open a new window). Type ou.blackboard.com into the address bar. Click on the login button. When prompted, log in with the username student1 and the password student.
3. Go to "Teaching an A&S Online Course." After you have logged in, click on the link to "Teaching an A&S Online Course" in the My Courses area.
4. Create a new Announcement. Click on the Control Panel button along the left hand side of the screen, and then click on the Announcements link in the "Content Areas" section of the Control Panel. Once you are in the Announcements area, click on the hatching-egg icon to create a New Announcement:
5. Put your name in the Subject line. Since you are all logged in as the same user, you will need to make sure you type your name in the Subject line of the new Announcement so that you will be able to keep track of which announcement you have posted.
6. Choose a Rotating Content script to include. Now go to the other browser window that you have open and choose one of the available Rotating Content scripts to add to your Blackboard Announcement. Find the script you want to use, and then click on the link to go to a page with more information about that particular content script. (I would recommend against choosing one which contains Greek fonts, because that requires some special formatting, but any of the other scripts will work just fine.)
7. Choose the script you want to use. For much of the content, you have a choice between a calendar-based script ("___ of the Day") and a random script. Choose the version of the script that you want, and then highlight the script contained in the box. Then copy the script (using Control-C or Edit-Copy).
8. Paste the script into Blackboard. After copying the script, go to the browser window where you are creating the Blackboard Announcement. You can now paste the script into the Message area in Blackboard (using Control-V to paste, or Edit-Paste). Also, make sure you check the HTML button at the bottom of the Message area.
Note: If you want to type additional information in the Message area, in addition to the script, you can do that! Just make sure you do not type anything inbetween the <script> and the </script> tags. You can type anything you want before or after these tags. Since this message is written in HTML, you will need to insert a <br> tag if you want to have a line return.
9. Return to the course homepage. Click the Submit button at the bottom of the screen to submit your Announcement. Then click OK to return to the Announcements area, and click OK again to return to the Control Panel. Then click on the Teaching Online link along the top of the screen to return to the course homepage. You should now see the contents of the script displayed in the Announcements area.
10. Refresh for random content. If you have inserted a script with random content, press the Refresh button in the browser to see new contents displayed automatically.
For screenshots, visit the online version of this workshop.
First, make sure you still have a browser window open with Laura's Rotating Content scripts. (If you closed that browser window already, open an Internet Explorer browser window, and type mythfolklore.net in the address bart, then click on the Calendar icon in the right-hand column.) You will need to be working on a computer that has the Composer program (part of the Mozilla and Netscape browser suites).
1. Open the Composer program. To do this, open the Netscape browser or Mozilla browser on your computer, and then go to the Windows menu and select Composer.
2. Type some text in the webpage window. You can type anything you want in the webpage window.
3. Copy the script you want to include. Just as you did before, go to the browser window which has the Rotating Content scripts website, and choose the script you want to use. Then highlight the script contained in the box and copy the script (using Control-C or Edit-Copy).
4. In HTML Source mode, add the script to your page. Now go back to the Composer screen, and click on the HTML Source option down at the very bottom of the screen. This will reveal the contents of your page in HTML code. You can then paste the script into the page (using Control-V to paste, or Edit-Paste).
5. Save the page. Either click on the Save icon or choose File-Save and save the page. You will be prompted to give the page a "title" (this is not the name of the file, so you can use normal spaces, punctuation, capitalization, etc.) Then save the file to the desktop with a name that contains no spaces or punctuation, using lower-case letters only.
6. View the page. In order to see what this webpage would look like when it is published on the Internet, click on the Browse icon in order to see the page displayed in a browser window.
You should see your page with the text you typed, together with the contents of the script you have selected. If you have selected a random content script, press the Refresh button in the browser to see new content displayed each time the page is reloaded.
Step One: Create HTML table. For screenshots, visit the online version of this workshop.
1. Go to the Rotating Content Tool. You can type the address r9tools.com in your browser, and then click on the link for the Rotating Content Tool.
2. Choose Random content option. Under the Create Content options, choose Randomized.
3. Choose number of items. In the box provided, type 5 as the number of items, and click Create Template.
4. Save the table file. The Rotating Content Tool will prompt you to right-mouse click on the link so that you can Save Target As. When prompted, save the file to the desktop. You can change the name of the file if you want, or you can leave it as the numbered file which is generated by the Tool. Now that you have saved the table file to your computer, you are ready for the next step, which is to add your content to the file.
Step Two: Add content to table. For screenshots, visit the online version of this workshop.
1. Open the Composer program. To do this, open the Netscape browser or Mozilla browser on your computer, and then go to the Windows menu and select Composer.
2. Open the table file. To open the table file, choose File-Open in Composer, browse to the Desktop, and open the file that you saved there.
3. Add content. You can create any kind of content you want in the table cells. You can also add more table cells if you want (make sure you type the word "random" in the left-hand cell if you do that). You can also delete rows if you decide you do not want to use all five rows. For this example, I am going to type the names of ice cream in the cells.
4. Save the file. Click on the Save icon (or use File-Save) to save the new version of the file. After you save the current version, the Save icon will be greyed out. Now you are ready to use the Rotating Content Tool to convert your content to a script.
Step Three: Convert table to script. For screenshots, visit the online version of this workshop.
To convert your content file to a script, you will go back to the browser window where you have the Rotating Content Tool open. If you closed that window, go to r9tools.com and select the Randomized Content option.
1. Convert Template to Script. On the right-hand side of the screen, you will see a box which contains your options at this point. You are ready to choose option #4, Convert Template to Script.
2. Convert to Javascript. First, make sure you select the Javascript option by clicking on the radio button. Then browse to the desktop and then select your file. When you are done, click Open to choose the file, and then click the Convert button to convert the file to a script.
3. Save the script. When prompted, right-mouse click on the link to the script, and choose Save Target As. You can then save the file to the desktop, using the numeric name supplied by the Tool, or choosing a different name if you want. If you give the file a new name, make sure you use lower-case letters and no spaces or punctuation. For example: icecream. Now that you have saved the script you are ready to use it in a webpage.
Step Four: Add script to webpage. For screenshots, visit the online version of this workshop.
Normally, you would publish the script to your webspace using an FTP program or the FTP feature that is built into a web publishing system like Dreamweaver (you could also upload the javascript file to the content area of a course management system like Desire2Learn). For the purposes of this workshop, however, you have saved the javascript file to your desktop, and you will save a webpage to the desktop that uses this file - that will give you a chance to see the javascript in action without actually publishing a webpage.
To create a webpage that uses the script you have just saved, you will use the Composer program. If you do not still have Composer open, you need to open the Composer program.
1. Start a new Composer webpage. To do this, select File-New from the file menu. This will open a blank Composer webpage.
2. Type some text into the page. You can type something in the page if you want, such as "What kind of ice cream do you want?"
3. Select HTML source mode. In order to enter the script into the page, you will need to choose HTML Source mode at the bottom of the page.
4. Type in the script. You will need to type in the script
information manually in HTML It should go after the text that you typed, and
before the </body> tag which marks the end of the webpage content. Here
is what you should type, substituting the name of your script if it is not
called icecream.js:
<script type="text/javascript" src="icecream.js"></script>
5. Save the page. Either click on the Save icon or choose File-Save and save the page. You will be prompted to give the page a "title" (this is not the name of the file, so you can use normal spaces, punctuation, capitalization, etc.) You can give this webpage the title: "Ice Cream!!!" if you want.
Then save the file to the desktop with a name that contains no spaces or punctuation, using lower-case letters only. For example: icecream.
6. View the page. In order to see what this webpage would look like when it is published on the Internet, click on the Browse icon in order to see the page displayed in a browser window. You should see your page with the text you typed, together with the contents of the script you have selected. If you have selected a random content script, press the Reload button in the browser to see new content displayed each time the page is reloaded.