Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Camden Mounts
9,453 PointsEditing Text on the Webpage via DevTools
I watched a conference video a few months ago, and one of the speakers showed the audience some hidden tricks in Google DevTools. One of them was typing a command into the console, something like document.edit = 'true', and the user would be allowed to edit text on the webpage (until the page reloaded of course).
My question is - what is this command? I can't find the video, and I don't want to re-watch them all just to find that 30-second clip.
Users-do you remember/know this tip?
Admins-is there a way to see the videos I have watched to narrow down my search?
Thanks! <CM>
P.S. The command is not 'contentEditable'
2 Answers
Falk Schwiefert
8,706 PointsYou can just right click on the element (in the elements panel) and then select "edit as html" or "edit atribute" or whatever you would like to do. In the console you can just type but that is JavaScript that you are doing there. And if the element has text, you can also choose "edit text".
Nick is going through the dev tools in this class: https://teamtreehouse.com/library/website-optimization and you ccan find the documentation and api for the dev tools here: https://developers.google.com/web/tools/chrome-devtools/
Camden Mounts
9,453 PointsThanks, but after some more searching I found the video with the original tip: document.designMode = 'on'