How to Add Code Into Your Instrucatable.

Introduction: How to Add Code Into Your Instrucatable.

In this instructable I will show you how to add code like this:

<DOCTYPE html>
    <title>A webpage</title>
    <h1>A webpage</h1>
    <p>Lorem ipsum</p>

Teacher Notes

Teachers! Did you use this instructable in your classroom?
Add a Teacher Note to share how you incorporated it into your lesson.

Step 1: Using DevTools

To add code using devTools, create a temporally (empty) line, press F12, click the Inspector and target the line. Change the "p" to an "pre" and you are done!

Step 2: Via Tempermonkey or Greasemonkey

If you are using Chrome or Firefox as your browser, you can add the following userscript to add an code button to the WYSIWYG editor.


Greasemonkey for Firefox:

Be the First to Share


    • Backyard Contest

      Backyard Contest
    • Silly Hats Speed Challenge

      Silly Hats Speed Challenge
    • Arduino Contest 2020

      Arduino Contest 2020

    3 Discussions

    Maker Saga
    Maker Saga

    3 years ago

    The userscript just says "this puush can't be found"


    Reply 3 years ago

    I agree with that, the only downside is that the WYSIWYG editor of instructables is really limited to what is can do with it's build in buttons.