HTML Formatter

On the "HTML Editor" side of content pages, I would like to be able to click on a button to format (indent) the HTML code so it displays properly rather than having everything left-aligned.  For example, in a Canvas page, HTML code looks like this:

76120_UnformattedHTML.jpgUnformattedHTML.jpg

However...using a program like Adobe Dreamweaver or a website like Format HTML for Free, the code is easier to decipher...as in this example:

76391_formattedHTML.jpgformattedHTML.jpg

As an added bonus, it would be awesome if the code could also be color-coded (as in this example).  This helps me easier figure out where I might have to add code to a page if the need arises.

This idea has been developed and deployed to Canvas

For more information, please read through the Canvas Release Notes (2021-02-20) 

61 Comments
ronmarx
Community Contributor

Thank you, James, I take your comments as a resounding AGREE.

None of us who develop/design courses are fans of linking to static "boring" documents because we know that experience as students ourselves. Our solutions engineer sent me a copy of the Canvas HTML Editor Whitelist a while back, but because it doesn't have an exclusion list (of what we can't do), standard features like this missing one are harder to identify from the get-go. Maybe the list was composed in the fashion it was was to avoid or delay feature requests like this one!

I'm not sure what a TinyMCE is, but I'm going to look it up now. And I'm going to see what has to be added to the css file of our Canvas to preserve comments since the only ones who will be commenting won't abuse the feature.

Thanks for chiming in!

iRon_Mrx

hensonj
Community Novice

If the TinyMCE HTML editor worked like the codepen editor.... think of the infinite possibilities!!!

mcsmith
Instructure Alumni
Instructure Alumni

Thank you for all your thoughts around this. We are planning on doing some polishing to the rich content editor which include word count, auto-save, and reworking the UI. Based on our analysis these features had a wider impact on our user base. Since this feature will not be developed over the next 6 months it will be archived. Keep in mind that all feature ideas that are archived are tracked and stored on our end so we can surface them for possible future development.

hensonj
Community Novice

If possible PLEASE consider breaking it out to the sub account level so that we may create our own white-lists. Currently this prevents us from easily creating truly engaging content.

Thank you,

James

ronmarx
Community Contributor

Although this idea for HTML formatting has been shelved for the time being, don't forget to VOTE UP on the idea that promotes Instructure to whitelist commenting in HTML at:

Enable Commenting in the HTML Editor

Renee_Carney
Community Team
Community Team
  Idea is currently in Product Radar Learn more about this stage...
Boekenoogen
Community Contributor

Even if Instructure could have https://www.10bestdesign.com/dirtymarkup/ somehow added to the system it would be nice for us programers.

jreisner
Community Novice

I don't know why this has been languishing on the vine for three years. It is sorely needed in this LMS.


I am a newcomer to Canvas (migrating from Blackboard); the ugly HTML code buried in the editor is one of the few painful, headache-inducing facets of using Canvas. It shouldn't take 5 minutes or more to make minor edits, but that's not uncommon when the Rich Text Editor isn't giving a true WYSIWYG picture and you need to muddle through the HTML weeds.

jreisner
Community Novice

I've only been using Canvas for a few months, but I've had to employ this workaround a handful of times.

It's a nice trick, insofar and tricks and hacks go, but what I would give for more neatly formatted HTML in lieu of my quintuple X's.

Renee_Carney
Community Team
Community Team

The Radar idea stage has been removed from the Feature Idea Process.  You can read more about why in the blog post Adaptation: Feature Idea Process Changes.

 

This change will only impact the stage sort of this idea and will not change how it is voted on or how it is considered during prioritization activities.  This change will streamline the list of ideas 'open for voting', making it easier for you to see the true top voted ideas in one sort, here.