Author Options:

Create Instructables in the New Editor Answered

Here at Instructables HQ, we're always looking for new ways to make it easier than ever to share the things that you've made.  Today we are very excited to announce the first public beta release of the new Instructables editor!  The new editor allows you to create, edit, and publish Instructables.  You can even use it to make changes to Instructables that you've already started or published.

Some of the new features include:

Drag and drop interface  - add, remove, and reorder photos and steps, all with drag and drop. (those of you who are already familiar with the Instructables iOS and Android mobile apps will love this feature)
View All Steps - the landing page of the new editor gives you an overview of all the steps and images in your Instructable
Continuous Editing Experience - edit, upload, save, preview, and publish... all without a single page reload
New Uploader - rotate images and see the status of your upload
Easy Embed - embed video and media from a variety of sites
Pixlr Image Editing - crop and retouch uploaded images in just a few clicks with Pixlr photo editor integration
Easy Preview - preview your Instructable without ever leaving the editor
Cover Image Selector - select and crop your Instructable's cover image, so it looks great on the site and on your phone
New Publish Page - add keywords, select a category and channel, and enter your Instructable in contests, now in a clean, new interface

So poke around, edit, and publish, and let us know what you think.  Please leave any comments, questions, or feature requests in the comments below.  Definitely let us know if there are any bugs we still need to work out!

How do I find the New Editor?

To create a new Instructable from scratch, follow this link:


To edit a draft or published Instructable (note: you can only edit Step by Step Instructables in the new editor, you will be redirected if you try to edit photo or video instructables):

1.  Login and navigate to one of your drafts in the current editor (Go to https://www.instructables.com/you?show=UNPUBLISHED and click the edit link next to any of your drafts).
2.  Click the big orange button at the top of the page that says "Try the New Editor".  You will get redirected to the new editor, with all your Instructable's data loaded and ready to go.  The url looks like this:



yes , you can but a problem is you can't add links in mobile app editor

Can i edit instructables on mobile app?

You sure can! Go to your instructables, choose the draft section and the instructable you want to work on, and click on the pencil icon to edit.

What is the best way to add C++ or Java code to a code block?

I'm trying to add plain text to code blocks in the editor, and whenever I save and return to the editor (or the preview) the editor has automatically added HTML tags to my C++ code. What am I doing wrong, or what steps should I take to add computer code to my Instructables?

figured it out. For anyone who has the same problem, you have to create a code block and then paste your text into it. It won't work properly if you select text and then try to create a code block from the selection.

I'm on an iPad, but I can't edit the keywords of any of my instructables. I don't have a computer to do this, so what do I do?

go to the bottom of the mobile site and it should say "full site" and if you press on that it will take you to the desktop site

Phil B

3 years ago

I composed an Instructable on an iPad II using the New Editor, but key parts of it were missing when it was uploaded, including the whole Introduction. Finally, I replicated what was missing on my laptop and copied over what was as intended to a new Instructable. Then I deleted the flawed Instructable and published the corrected Instructable as if it were a new Instructable. This is a puzzle because I composed and successfully published another Instructable on my iPad a few weeks ago.

Also, there should be a channel for Shooting under the Outdoors section. There is a section for weapons, but not real guns and there is a section for paintball.

Other people have mentioned similar issues - I think it would be worth posting this as a fresh bug report.

How can I get to, I guess a standalone preview of a draft instructable - preferably one with a link I could send to others for ideas/grammar checking before publishing?

You can enable "Collaboration" and add your friends or any member you wish to edit the instructable for ideas or grammar checking.

To enable Collaboration,

1. Click on your drafts and click edit on the instructable you want collaboration

2. Click on the down-pointed arrow on the radio buttons on top, which will bring you a drop down menu. (When you move your mouse pointer over it, it says edit)

3. The top most item on the drop down menu is collaborate. Click on that which will bring you a box saying "Enable Collaboration"

4. Click "Enable collaboration" and add your friends who can be able to view and edit your instructable

Please refer to screenshots attached if you have any doubts


One question: When I try to PUBLISH my instructable, the error "Missing Key words. Add key words". pops up. When I add key words, the same message keeps coming back. How do I convince the program that I've actually added the keywords?

Feel free to private-message me directly if you have issues. You'll need to hit "enter" or "," after each keyword to submit it. Each added keyword should appear with a colored background, see the attached screenshot. Is this what you're seeing?

Screen Shot 2015-04-21 at 12.09.22 PM.png

Inserting code is still a gods-end

How do you save notes onto the images? Also, how do you resize the note box thing? I can add the notes and delete them, but I can't save them (save button won't work) or resize the white box...

I like it, but it would be really cool if the setup were similar to the Weebly site editor, where you can drag and drop ALL components into place per page (or in this case, per step). You can add text boxes, photos, embed code, add videos, documents, sound clips, etc... I realize this would require a LOT of coding, so it's just a suggestion.

I'm unable to find the HTML editor button in the new editor. I think it was there a few months ago but can't find it any longer. Working with formatting options(code/quote) without HTML editing option is really hard.

I am liking the new editor, it's very easy to use and navigate, especially for someone like me, who just joined as a Pro member, very nice.


4 years ago

The new editor is cool

Hey I like it nice job on fixing the preview! I can't seem to reorder or delete embedded videos. every time I click on them it just starts playing the video. I have to go into the old editor to reorder them and delete them. That would be great to be fixed!

Also the copy as HTML in the arduino program no longer does anything in the new editor and finally. . .

I use this little handy box to put my code in. Because my code can be pages long I need to contain it, so I put it in this box that has a scroll bar. That way I can still post the code in my i'ble without having to have a pages full of code taking up room. What I used to post is

Now if you made a button that would automatically do this that would be great!
Link and unlink nested under the 'link' button gets difficult when posting many links.

So just the embedding videos problem (can't reorder, delete), and the area for code. The link thingy is just a suggestion to make things faster.

Otherwise I love the new editor! Good job!
Oops it actually did the box thingy. Here It's

I just used the new editor, and I really like it. i loved the layout, the easier drag and drop photos from library to instructable, and the positioning of the main image option. However, I did run into two issues. First, when I was uploading images by dragging them from the folder to the proper location (which I love, by the way), I had a lot there and this made it rather laggy. Not my computer so much, but rather that I couldn't scroll properly due to lag issues. After uploading, I began to type, and that was when I noticed the "Saving" image pop up every few seconds. It was out of the way and everything, so I now this sounds nit-picky, but it was slightly distracting. Perhaps some grey text that would state when it was last saved would be better?
Anyway, I enjoyed the new editor, despite my little complaints. It is very well made, and I think I will be using it from now on, so thanks for making it!

What's happening to the source! When I tried posting my Arduino code, it took away all the color and everything!

You know how in the IDE you can click "Copy for HTML". Well when I paste it in the new editor is messes it up.

you have color tags in your Arduino code? I'll try this out. Thanks for reporting!

Yes I do. Also there's the little thing I used to use.

That would put a little gray box on the screen with a scroll bar. I could paste my code inside of it and it would contain my code into a small area (631x700).
You can see what I'm talking about if you scroll down to the bottom of my i'ble. There are gray code boxes everywhere

Now it just puts a bunch of code and won't put in the boxes.

So, that and the color tags with the Arduino.

Love the new adjust the cover image! Zoom would be nice-

I like everything with the new editor except for the preview window- I think the window should be the size of the browser window. The new preview window's height is too small and I can't, 'Stand back and look over all my work with satisfaction'. Especially pictures you have to scroll to see the whole thing.

Well that's my input!

Yup. I can't even see on picture without scrolling. It would be nice if the popup window filled the whole browser window, with the X button a still in the top.

Why combine the link button into one button? Instead of being able to click on the link button and paste, you have to click on the menu first then select link.

after using it a bit, I think I agree with you, but at the same time we're trying not to make that top menu too cluttered. I'll see what we can do

The new editor is great.. Love the idea of uploading all the pictures, then dragging them into steps. But I was unable to get back to edit after full preview

thanks, I found out how to get back... will take some time to learn to create in the new editor

actually, the pop-up window covered my entire screen.. now I figured out to click on the visible edges of the edit window


4 years ago

Some minor points (I've barely used it). 
  1. The mouse-over preview picture could be bigger.
  2. Re-position the mouse-over preview picture so it's not right on top of the original.  I was looking over the pictures to make sure they are in the correct order and the preview covers the next picture which means I have to move the mouse, wait for the preview to drop, then move the mouse again.  It also makes repositioning a picture a bit tricky because you have to do it before the preview pops up.
Some more thoughts:
  • The bigger thumbnails are great and fix all the issues I mentioned above.  Thanks!
  • It would be nice to have more HTML controls in the editor, like tables.  Currently I have to edit the source HTML if I want to use tables in my text.  Ugh.  I have never used the Styles or Format options.
  • I find the image viewer (?) at the top awkward.  I can't figure out what images it is showing at the top (the last ones I inserted?).  My instructable has 30+ images but only two are shown at the top.  I can supply a screen shot if wanted.  Some of the confusion may be because I've used the old and new editor on the same Instructable.
  • Another vote for the "Image Tags" drop-down to be alphabetized and remembered.  Highly annoying to have to select it again and again.
  • It would be nice to have a way to see the full-sized picture in the image library.
  • The full preview is cool and helpful.
  • What are the hot-keys for the editor?  E.g. ctrl-B bolds the selected text.  Can the mouse-over include the hot-key (if there is one)?
  • Probably not what the engineers want to hear but I don't find the new editor appreciably easier to use than the old one except for the Full Preview.

I do all my editing in Firefox (rarely on Chrome) on a desktop or laptop with all three major OSs (Win, Linux, OS/X).

hotkeys: ctrl+S will save, option+drag will copy an image

Amanda, it looks like I can't add notes to pictures. To recreate:
  1. Edit an Instructable page (duh).
  2. Click on thumbnail for image.  This brings up the full-size picture.
  3. Click "Add Note".  The empty note appears in the upper left.
  4. However, I can't click on the note to move it or add text.
This is on Windows with Firefox 10.0.1.

I should probably write these down and put them all in one big post but that would require me being organized.

In Full Preview mode the embedded links don't work. They look like links but nothing happens when I click on them.

yes, we could have these links open in a new tab in preview mode. I'll add that to the list.

yeah, I've seen this in firefox too, we'll get that fixed asap. for now, try chrome.

I realized I never addressed your question - the images in the top tray are not attached to any steps. They're images that you uploaded on an Instructable, but have not yet dragged to a step. Hope that helps!

I can't make the html editor work (Win, Chrome) - it deletes my edits and moves the cursor to the end of the text after a few characters.