Making a Getting Down with Tutorial

By Jeffrey Elkner

The Getting Down with tutorials provide an opportunity for students to share knowledge with other students. The Getting Down with Tutorial Template provides a everything you need (html, css, and javascript files) to create your own Getting Down with tutorial.

If you would like your tutorial hosted on the Open Book Project site (and we would love it if you would ;-), email Jeff Elkner (jeff at

How to Make a Getting Down with Tutorial

Note: The following instructions assume you are on a Unix machine like Ubuntu or some other GNU/Linux flavor. They also assume you are making Getting Down with Basket Weaving as your new tutorial.

  1. Download gdw_template.tgz to your local machine.
  2. From a command prompt in the same location where you downloaded the file, run:
          $ tar xzvf gdw_template.tgz
    This will create a gdw_template directory with everything you need for your tutorial.
  3. Rename (using the unix mv command) gdw_tutorial to basketweaving (or whatever short directory name is appropriate for your tutorial):
          $ mv gdw_tutorial basketweaving
    Then change into your new directory with:
          $ cd basketweaving
  4. Edit the navigation.js file located inside the js subdirectory. You will be making changes to the beginning of the file, which looks like this:
        $(document).ready(function() {
            /* Tutorial creators should edit the title, author, and list of lesson
               name values appropriately. */
            var title = "Getting Down with Template";
            var author = "Free Software";
            var lessons = ["Lesson 1: The first lesson",
                           "Lesson 2: The second lesson",
                           "Lesson 3: The third lesson",
                           "Lesson 4: The fourth lesson",
                           "Lesson 5: The fifth lesson",
                           "Lesson 6: The sixth lesson",
                           "Lesson 7: The seventh lesson",
                           "Lesson 8: The eigth lesson",
                           "Lesson 9: The last lesson"];
    You should change the values (the characters inside quotes " " to the right of the = for the title, author and lessons. For the lessons, change the part of the text that occurs to the right of the colon (:) in each lesson name.
  5. Add your tutorial content inside the <section id="lesson"></section> element and your exercises inside the <section id="exercises"></section> element in each file from lesson1.html through lesson9.html.