How do I embed a tutorial into my Thimble project?
Revision Information
- Revision id: 48706
- Created:
- Creator: JakeMakes
- Comment: 1st
- Reviewed: Yes
- Reviewed:
- Reviewed by: JakeMakes
- Is approved? Yes
- Is current revision? No
- Ready for localization: No
Revision Source
Revision Content
Thimble allows you to embed a tutorial inside your project, which shows up when a viewer hits the remix button.
To embed a tutorial, simply add a tutorial-URL tag when you publish
The tutorial-URL tag is a project tag that contains the word tutorial- and the URL of the tutorial that you want to embed.
You can embed just about any webpage as tutorial, all you need is the URL from the address bar.
An example
@Artychan’s movie poster has a tutorial embedded inside of it - https://artychan.makes.org/thimble/movie-poster/remix
- Arty created her tutorial separately on this page https://artychan.makes.org/thimble/movie-poster-tutorial
- To embed it into her movie poster project, Arty simply added a tag that has the word tutorial- plus the URL to her tutorial page.
- the tag looks like this:
Starter template
Use this starter template which sets up special sections to break up your tutorial into paginated steps:
https://thimble.webmaker.org/projects/tutorial/remix
Modify anything that falls between the <section>
and <</!-- -->/section>
tags. You can include any HTML in these tags.
Control the pagination of your tutorial
You can copy and paste more sections or divs which will create new pages in the finished tutorial. That way you can segment your instructions into digestible steps that the user toggles through with the left and right arrow
Controls for the user
The tutorial panel itself has a few buttons that grants your remixer a few additional controls.
- The button hides the tutorial in order to save space while working.
- The expands a hidden tutorial back to normal state.
- The button expands the tutorial window to a larger size
- The button allows you to load another tutorial if the author has embedded more than one into the Thimble project.