Compare Revisions

Thimble allows you to embed a tutorial inside your project, which shows up when a viewer hits the remix button. Here’s how you do it.

Thimble allows you to embed a tutorial inside your project, which shows up when a viewer hits the [[You can remix anything made with Popcorn Maker - here's how|remix button]]. == To embed a tutorial, simply add a '''tutorial-URL''' tag when you publish == [[Image:Thimble tutorial tag]] The tutorial-URL tag is a [https://support.mozilla.org/en-US/kb/how-to-get-your-make-featured#w_give-your-content-some-relevant-tags-so-others-can-find-it-better project tag] that contains the word '''tutorial-''' and the [https://en.wikipedia.org/wiki/Uniform_resource_locator 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 = [http://artychan.makes.org @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 [https://support.mozilla.org/en-US/kb/how-to-get-your-make-featured#w_give-your-content-some-relevant-tags-so-others-can-find-it-better tag] that has the word '''tutorial-''' plus the URL to her tutorial page. ** the tag looks like this: {button tutorial-https://artychan.makes.org/thimble/movie-poster-tutorial} = Starter template = Use this starter template which sets up special sections to break up your tutorial into paginated steps: https://thimble.webmaker.org/project/24523/remix Modify anything that falls between the <code><<!-- -->section<!-- -->></code> and <code><</!-- -->/section<!-- -->></code> tags. You can include any HTML in these tags. == Control the pagination of your tutorial == [[Image:thimble-tutorial-pagination]] 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 [[Image:thimble-tutorial-hide-button]] button hides the tutorial in order to save space while working. * The [[Image:thimble-tutorial-show-button]] expands a hidden tutorial back to normal state. * The [[Image:thimble-tutorial-expand-button]] button expands the tutorial window to a larger size * The [[Image:thimble-tutorial-menu-button]] button allows you to load another tutorial if the author has embedded more than one into the Thimble project.