How to Add Code Into Your Instrucatable.

224

5

3

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

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

Supplies:

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.

Userscript:
http://puu.sh/snvFO/372df330d7.txt

Greasemonkey for Firefox:
https://addons.mozilla.org/nl/firefox/addon/grease...

Share

    Recommendations

    • Gardening Contest

      Gardening Contest
    • Arduino Contest 2019

      Arduino Contest 2019
    • Woodworking Contest

      Woodworking Contest

    3 Discussions

    0
    None
    Maker Saga

    2 years ago

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

    0
    None

    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.