Practice Exercises

In this set of practice exercises, you will be creating a biography page of yourself that includes an image.  First things first:  get your resident web developer (likely Shaun) to give you admin access to http://mojotraining.colostate.edu.

Beginner

  1. Visit http://mojotraining.colostate.edu.  Take a glance at the home page.  Now, sign in (directions).  What, if anything, changed?  Hint:  if nothing changed, you need to talk to your resident web developer.
  2. Create a new page (directions) whose title and url are your first and last name (select “About” as the Parent Page).  Observe the Url textbox when you tab off of the Page Name textbox.  What happens?
  3. Add a new HTML content feature (directions), also titled with your first and last name, to the page you created in Task #2.
  4. Enable a Facebook like button for the new HTML content feature you just added to your page
  5. Add a brief bio (or gibberish by copying/pasting from http://www.lipsum.com/feed/html) to your new content instance.
  6. Add a link somewhere in your bio (directions) to your favorite website.
  7. Add a picture of someone to your page (eg, you can grab a url for your image from http://images.google.com).  (directions)
  8. How would you delete your page (directions)?  What about your content feature (directions)?  What are the implications for each, and how do you avoid losing content (more info)?

Intermediate

  1. Make the link that you created (under Beginner Task #6) open up in a new window (directions – under “Opening a Link in a New Window”)
  2. Move the page you created (under Beginner Task #2) under the Home tab (directions)
  3. Upload an image from your computer to the web site and add it to your page (directions)
  4. Make it so that only someone from CSU can see your bio (directions)
  5. Grant your co-worker edit access to the site (directions)
  6. Create a new role called “DSA Staff”.  Give yourself this role (directions)
  7. Make the module you created in Beginner Task #1 hidden until 1 minute from now.  Conversely, how would you make that module automatically disappear from the page in 1 minute? (directions)
  8. Restore a previous version of the content you added to your page (under Beginner Task #3).  Next undo what you just restored. (directions)

Advanced

  1. You need to print a brochure for students that takes them to your bio (yes, you are that important).  Problem is, you only have 15 characters to work with, because of limited space.   How could you shorten the link for print?  Hint:  http://s.colostate.edu/
  2. Create a slideshow of some favorite images on your bio page (directions – see “Standard Mojo SlideShow”)
  3. Create a 301 redirect that redirects someone who visits your page to the home page instead. (more info)
  4. Create a new job application form that requires a user to provide their first and last name as well as upload their resume (directions)
  5. On the same job application form, ask them why they want the job, but limit their input to 100 words.  Hint
  6. On the same job application form, request the user’s phone, but validate that they actually entered a phone number.  Hint: use this snippet of regex: ^(?[d]{3})?[s-]?[d]{3}[s-]?[d]{4}$
  7. You just accidentally deleted your site’s home page.  How would you recover it without asking your resident web developer?  Hint: Google cache.  How would you recover your home page if it had a custom form on it?
  8. Publish the content you created earlier on the home page without duplicating it.  Hint: use the Content Manager.
  9. Name (and perform) three different ways of hiding your content from the general public.
  10. On a new or existing page, add a login box that requires a student to log in with their eID (without leaving the page) before they can view your bio.  How can you make the login box disappear once the student logs in?  What is one security implication of adding a login box to your bio page?
  11. Add an image to your site that looks like the images at http://parents.colostate.edu/meet-the-staff.  Hint: use the Advanced Tab under Image Properties.  What are two ways you can duplicate this effect?  Which is preferable?
  12. Download/Install Windows Live Writer.  Connect to your site and create a new page via LiveWriter (instead of via the web)