cancel
Showing results for 
Search instead for 
Did you mean: 

Canvas Release: New Rich Content Editor (2020-01-18)

Canvas Release: New Rich Content Editor (2020-01-18)

This document introduces the New Rich Content Editor as noted in the Canvas Release Notes (2020-01-18) 

For additional feature updates, please refer to the New Rich Content Editor User Group.

The New Rich Content Editor enhances the content creation experience in Canvas.

 

Feature/Integration Setup

Feature Options

The New Rich Content Editor involves the RCE Enhancements feature option, which can be allowed on a course-by-course basis or turned on for all courses across the entire account. By default, this feature option is set to Off. Canvas admins can manage this feature option in Account Settings.

Account Management

Permissions

The Rich Content Editor displays content inherent to each user role.

Users will view both course and user files in the Rich Content Editor if they have the Course Files - add / edit / delete permission enabled. 

Users without this permission only view their own user documents.

Course Setup

Feature Options

If the RCE Enhancements feature option is not already turned on for the entire account, instructors can enable the RCE Enhancements feature option in Course Settings.

Course-Level Features

Rich Content Editor UI Overview

The toolbar includes a condensed, more intuitive look. Toolbar menus are grouped by common icons and interactions.

The following enhancements are included with this feature update:

  • The Rich Content Editor expands to the full width of the browser
  • The toolbar includes a condensed, more intuitive look
  • Toolbar menus are grouped by common icons and interactions
  • The content sidebar only displays when linking to other parts of Canvas, accessing Canvas files, or accessing uploaded media
  • Image and media additions include drag and drop; images include an Unsplash search and content auto-scaling
  • The Keyboard shortcut, Accessibility Checker, and HTML Editor icons have moved to the bottom of the editor next to the word count. Additionally, the Rich Content Editor window can be resized using the Move handle below the window.

 

New Rich Content Editor

 

If the browser isn’t expanded to fit the full width of the toolbar, the toolbar displays an Options menu that includes the remaining toolbar items.

If you’ve selected an item within a menu, the menu displays an arrow indicating the location of the most recent active item.

326850_pastedImage_2.png

 

Paragraph Formatting

The font size and paragraph menus have been moved to the first section of the tool bar.

 

New Paragraph and Formatting Menu

 

Text Formatting

The text formatting options have been retained grouped together, in addition to the subscript and superscript options. When a subscript or superscript is selected, an arrow displays above the selected option.

 

New styling options in the Rich Content Editor

 

Page Formatting

The text alignment options have been consolidated into a single menu. Additionally, the Rich Content Editor includes a consolidated bullet and numbering menu with additional bullet display options. 

This toolbar section also includes options for increasing and decreasing indents and paragraph spaces.

 

New formatting options in the Rich Content Editor

 

Links

The Links menu includes link options for external links and links within a course.

 

326041_pastedImage_4.png

 

External links include an option for the name of the link and the link URL.

 

New Rich Content Editor Insert Link Window

 

Course links display from a sidebar and allow the user to select a link from a page, assignment, quiz, announcement, discussion, module, or course navigation link.

 

Sidebar links for pages

 

Images 

Images can be uploaded from a computer, added from course files (with permission), or added from images in the User Files folder.

 

Images Menu

 

Uploaded Images

Uploaded images can be uploaded via drag and drop or by browsing the computer. The option to select images via Flickr has been replaced with Unsplash. Additionally, images can be uploaded via URL.

Uploads and URL entries display previews in the upload window, which helps confirm if the correct image has been selected.

 

326043_pastedImage_8.png

 

Once the image has been inserted into the Rich Content Editor, the image also displays as a preview in the Rich Content Editor. Image options can be modified by clicking the image and selecting the Options button. The sidebar provides alt text options, display options, and allows the image size to be selected. By default, the Alt Text is the name of the image.

 

326044_pastedImage_10.png

 

Notes

  • In Display Options, images are embedded by default. If the image is changed to the Display Text Link option, the image cannot be changed back to being embedded unless the image is removed and re-added. 
  • Uploaded images via computer are added to the course folder by default; however, if a user doesn’t have access to the course files folder, uploaded images are added to the User Files folder. 
  • Uploaded images may take a few moments to fully render and display in the Rich Content Editor window.

 

Course Files/User Files

Files can be added from course files (with permission) or the User Files folder. In both Course and User files, the Images folder is displayed by default. However, users can choose to view all files, which displays the complete files structure in the course.

Images previously uploaded to course files or the user’s files can be previewed in the sidebar before they are added to the Rich Content Editor.

 

Course Files view with Images and All Folder view with files tree

 

Media

Media can be uploaded from a computer or recorded, uploaded from course files (with permission), or uploaded from the My Files folder.

 

Media Menu

 

Uploaded Media

Uploaded media can be uploaded via drag and drop or by browsing the computer. Once selected, the video displays a preview in the upload window, which helps confirm if the correct video has been selected.

 

Media Upload window

Media Upload Preview

 

Subtitles

Subtitles can also be added to uploaded videos with the Add CC/Subtitles checkbox.

 

Subtitles checkbox in Rich Content Editor

 

When selected, the window includes the option to select the language for the subtitles and a button to select the subtitle file. Subtitle files must be created in advance, either through Amara or another subtitling tool.

Accepted file types include SRT and VTT files. Files can be deleted if needed and re-uploaded.

 

Uploading caption files in the Rich Content Editor

 

Once the media has been inserted into the Rich Content Editor and fully uploaded, media also displays as a preview in the Rich Content Editor.

Note: Uploaded media may take a few moments to fully render and display in the Rich Content Editor window. Until the video is uploaded, the Rich Content Editor displays a gray box as a placeholder.

 

326866_pastedImage_6.png

 

Video Options

Options for uploaded videos can be viewed by clicking the video and clicking the Options button. The Title field defaults to the name of the title.

The Options menu allows a user to update the title, display options, and size. By default, uploaded videos are embedded by default and set as a large video. Sizes are as follows:

  • Medium: 320x181px 
  • Large: 400x226px
  • Extra Large: 640x361px
  • Custom: aspect ratio is preserved 

 

Video Options

 

Note: The Display Text Link option will be available for testing in the beta environment on January 2.

 

Recorded Media

Media content can be recorded directly in the Rich Content Editor. Users must allow permission for their computer to access their microphone and webcam. If a user has more than one microphone and/or webcam, the intended microphone and/or webcam can be selected by clicking the button for the desired medium. Recorded media can be previewed before being saved to the Rich Content Editor.

 

326868_pastedImage_9.png

 

Once the media has been inserted into the Rich Content Editor and fully uploaded, media also displays as a preview in the Rich Content Editor.

Note: Recorded media may take a few moments to fully render and display in the Rich Content Editor window. Until the video is rendered, the Rich Content Editor displays a gray box as a placeholder.

 

326870_pastedImage_1.png

 

Embedded Media

Embedded media can be added via embed code. 

 

Embed Media Window

 

Once added, the embedded content displays as a preview in the Rich Content Editor.

 

Embedded video preview in the Rich Content Editor

 

Course Media/User Media

Media content can be added from course files (with permission) or the User Media Files folder. In both Course and User files, the Images folder is displayed by default. However, users can choose to view all files, which displays the complete files structure in the course.

Media files previously uploaded to course files or the user’s files can be previewed in the sidebar before they are added to the Rich Content Editor.

 

Course Files view with Media and All Folder view with files tree

 

Documents

Documents can be uploaded from a computer, added from course files (with permission), or added from the My Files folder. 

 

Documents Menu

 

Uploaded Documents

Uploaded document files can be uploaded via drag and drop or by browsing the computer. Selected documents cannot be previewed in the upload window. 

Uploaded files are added to the course folder by default; however, if a user doesn’t have access to the course files folder, uploaded files are added to the user’s My Files folder.

 

326049_pastedImage_20.png

 

Once the name of the file displays in the Rich Content Editor, file options can be modified by clicking the file name and selecting the Options button. The sidebar provides the file name field, link URL, and display options, which can default to collapsed or expanded.

 

326050_pastedImage_21.png

 

Course Documents/User Documents

Documents can be added from course files (with permission) or the User Documents Files folder. In both Course and User files, the Images folder is displayed by default. However, users can choose to view all files, which displays the complete files structure in the course.

Unlike other file types, documents cannot be previewed in the sidebar before being added to the Rich Content Editor.

 

Course Files view with Documents and All Folder view with files tree

 

Apps

External apps are located within the Apps icon and are displayed in alphabetical order. The App window includes a Search field, which allows a user to search for and add an app. The selected app displays its content from the page sidebar or a standalone window. 

 

App Window

 

Apps must be previously installed in the account or course to display in the Rich Content Editor Plugin page.

If Commons is installed as an LTI tool, Commons favorites can also be added from the Rich Content Editor.

 

Community Resources

Future Enhancements

This document outlines existing functionality included in the initial release of this feature. The Rich Content Editor will continue to receive additional feature enhancements over future releases as indicated in Canvas Release Notes. Please follow the release notes for future functionality updates.

Customer Feedback

Community feedback for the Rich Content Editor is welcome per Canvas Community Feedback Guidelines, which outlines general feedback, broken functionality, and feature enhancements.

User Group

Feedback is also welcome in the New RCE Users Group.

Labels (1)
Comments

Why should this be a new feature request, when it currently exists? I expect a new product to have feature parity and not to be told that some *existing* feature is now a special request that Canvas may or may not implement.

Hi, Martha,

I think I misunderstood what was being asked. You can get the complete tree structure as Stefanie pointed out.

With new versions of a feature, the same functionality may exist just in a different way, or previous functionality may not be included based on user feedback and research while testing the new designs. So if the latter has occurred for you, our product team needs to know your thoughts to consider future improvements. They check into the Ideas space quite regularly.

Thanks!

Erin

Terribly disappointed with the loss of the Insert Content box.  I am now unable to add multiple links without having to go through all of the steps for each link.  Also, for those that work in the HTML editor there is no access to the shortcuts for linking content. This is very frustrating for a course designer and builder.  We are putting off implementing the new RCE for as long as possible in the hopes that something is done about this...

I wish the Remove Link option had remained. I frequently repurpose prior content and change the files they point to. However, doing so would sometimes lead to a hidden link artifact that could only be seen in the HTML, and that's a pain to continually check and edit. The Remove Link button allowed me to avoid that by highlighting a larger section to remove the chance of any links remaining. Is there another way to do this? The new interface is less than intuitive and feels less helpful/robust than the previous iteration. 

Hi Sean, the remove link option can be found under the link icon: 

335906_pastedImage_1.png

I agree it feels less intuitive and everything seems to take an extra click to do, re-training our brains hopefully wont take long Smiley Happy

Cheers, Tina

Karen,

I assume you are talking about the insert/edit media button as show in the screenshot below.  I am also terribly disappointed this button is missing from the new RCE.  I can say that in virtually every training session I do I always show it as the preferred, easiest way to add embedded content such as YouTube videos or anything where have embed code, and refer to it as "my favorite button".  I know you can still add embed code by clicking the button to get to the html editor, but the beauty of the insert/edit media button is that you don't have to decipher the html to figure out where you are embedding something. I'm hoping that I'm just not finding this functionality in the new RCE.  If it's not there I certainly hope it gets added before the current RCE goes away.  

335912_pastedImage_1.png

Rick

Hi Rick,

I think Karen was talking about the old Insert panel on the right hand side (that now only appears when you choose to insert something).

You can still embed media by selecting the Record/Upload Media button:

335907_pastedImage_1.png

Then select the Embed tab.

335908_pastedImage_2.png

Took me a bit to find it and again it's an extra step but it does the trick without having to go into the html.

As mentioned above if you use the Alt+F9 trick it is also available in the Insert>Media option.

335915_pastedImage_3.png

I hope that helps.

Cheers

Tina

Thanks tina.busch@education.tas.gov.au‌.  I was hoping that I just wasn't finding it.  That will work well with embed code but is quite a few extra steps now for YouTube since I can't just paste the URL in anymore.  But, at least it's partially there.

Rick

Hi Tina, 

You are correct.  The Insert content box on the right was what I was referring to.  Inside of having a static box that can be accessed repeatedly, the sidebar closes after each selection, which means that you need to click Links -> Course Links -> choose submenu -> wait for submenu to load -> choose one item -> repeat all steps for each additional insertion.  

Karen

tina.busch@education.tas.gov.au...

That works for one link, but if you are trying to remove multiple links on a page all at one time (by highlighting a bunch of text which includes links), the "Remove Link" option changes to "Course Links".

So far I have found the new RCE to require far more steps and be less intuitive than the original RCE.  Some of the things (in addition to what others have mentioned, particluarTina E Busch) that will increase workflow and time spent creating courses are:

  • Cannot create a "new page" from the RCE area as you can currently. This is a huge time saver when setting up a home page or any other page that links out to additional pages. It allows you to set the structure without having to create the blank page shells first and then adding them to the original page. In fact, I would like to see the ability to add shell assignments and discussions from the RCE but would be happy with parody with what is currently available.
  • When pressing cntl+k or cmd+k currently, it brings up a menu that allows the user to chose to have the link open in a new tab. This is extremely helpful for those faculty who do not feel comfortable working in the HTML and need a way to have something open in a new tab/window. This is not available in the new RCE when using those same shortcut keys. 

Please consider up-voting this idea ~ https://community.canvaslms.com/ideas/15792-new-rce-pin-the-sidebar 

The idea to the have a mechanism that will pin the side bar panel. This would be useful if you have a bunch of links that you want to add at once. You shouldn't have to perform unnecessary clicks if you do not have to...

Please vote! 

We are seeing multiple instances of images not being visible to instructors or PDF files from instructors showing as not accessible. Yes, we already have a ticket in. Are we only ones having this issue? If you have had this issue, have you found a solution?

I would like to add that we are only seeing this behavior in discussions, as far as we can tell it's not happening elsewhere.

I haven't use the new editor much yet. I have only turned it on in practice courses for faculty and students. One glaring issue that bothers me is the editor automatically expanding and hiding the scroll bar. I find this extremely annoying. 

I submitted a case on this issue and did hear back from support. They are aware of the issue and working to fix it. I hope they have it fixed before the June update. 

Yeah, losing the tool bar at the top when the editing box auto sizes to full-height is a deal breaker for me. I can't start using the new RCE until the tool bar stays locked at the top of the screen.

We have some big issues moving between html and Rich Content Editor. 

When you first go into Edit Mode the window is small and the side to side scroll shows, I can adjust the size of the window in the lower right and work no problem 

336436_pastedImage_1.png

However, If I click to html and then back to the Rich content view.Then we get the entire page length and have to scroll to the bottom of the page to scroll side to side the bottom right resize does not allow us to fix this issue it causes very clunky to impossible to work in interfacing for course building. 

336458_pastedImage_2.png336459_pastedImage_3.png

Is there are reason that the resize is not working and why the window resize coming out of the html editor?

This also happens when you begin using the editor tools without every opening the HTML editor. For example, when you highlight a word you want to bold and then click bold in the toolbar, the window auto-sizes to full height.

That I think is not a big problem unless we have assets in the page that require the side to side scroll bar. However it is a show stopper for any that do have something wider than the normal window.

See for me it's a deal breaker because the toolbar doesn't lock to the top of the screen. For lengthier pages like the one in your screenshot, you're selecting text, then scrolling all the way to the top of the browser page to select your editing option. It basically leaves you blind because you can't see the section of text you're working with and the toolbar at the same time.

audra_agnelly@hcpss.org‌  I just put a question about the same thing. It is hard to scroll and guarantee where you are in the document.  We have some professors, including myself, very frustrated with the process.  

Is anyone else using the New Rich Content Editor having issues with the capability to sort files when trying to add.  When you change the selection from Date Added, Date Published, or Alphabetical nothing happens.  I had a professor that added a document with a similar name, tried to sort by date and couldn't find it.

We turned on the new RCE in my school district because we love to be uncomfortably on the bleeding edge. Overall, we like a lot of the changes. The one hang up I have it with how you upload images and files. We've instructed teachers to highlight text and link to documents. Often times they are uploading those documents from their computer. It would be nice if by default the text that was highlighted would be retained. Instead it is changed to the name of the file. 

If a teacher uploads an image, it displays it in-line by default even though it was uploaded as a file. In order to have it be a linked file, it requires a lot of clicks. Am I doing something wrong? Have a workaround for me? Thanks!

Upload Image GIF

We're finding the same thing.

We're also finding that occasionally the link doesn't work, especially in Discussion topics. It just shows File not Found or Blocks because of permissions. There doesn't seem to be a reason for the broken link.

My case got solved because the new editor is working as designed according to support. I found this feature idea. Please add your thoughts to this feature idea. 

Static Toolbar for New Rich Content Editor

I am just so happy that the <code> option is still a part of the Alt+F9 menu option. This is so helpful for courses that use programing terms within a sentence that they would like to call out. I wish it was a part of the regular text options (like bold or italic) but I will take that it is available at all. 

It used to be extremely easy to add multiple files to a page or an announcement.  It now is extremely time consuming.  I hope this is altered in the near future. 

erinhallmark

Issues with the New RCE:

1. When students are uploading images in discussions, assignments set to online submission; text entry, and quizzes the image is going into the user files and the teacher is not able to view the image. 

2. When teachers add an image from their user files into the course students are not able to view the file.

3. When the page has lots of text the RCE goes auto full and the toolbar is no longer on the screen at the edit point near the bottom of the page causing the user to scroll up and down to use the toolbar. 

I opened a ticket and this was the suggested procedure from Canvas. They called it an ongoing issue.

https://community.canvaslms.com/docs/DOC-10700-4212190965 

This is a huge problem as it impacts student learning, collaboration, and teacher feedback, hopefully it isn't ongoing for very long. 

This is still a pain point in production.

I tested issues 1 & 2 with my fake students and didn't have the same issue as you did. I was able to see the images they posted from user files and they were able to see my user files. I find issue 3 extremely frustrating. I hope they fix this issue before June.  

We turned of the new RCE today.  Just too many issues.   Many people can't record.  Haven't found out what makes the difference on being able to record.  Acts like it works but it does not show up when you save.  The inability to link files is a problem  In Quizzes, we can't get images to upload.   Just too many things that are stopping teachers from doing work or making it too difficult.  When it appears to be more robust we will try again.

The replacement of the text with the file name if you are uploading the document as you create is truly a pain.

It does not replace the text if the file is already present and you upload it by digging it out through the file tree (which takes way more time that the way it used to because of the structural organization). So, it *can* work if you load the document into files ahead of time and then dig it out. But, it wastes a lot more time.

This really is more than an inconvenience as it creates more steps.

I'd be willing to bet that many (maybe most) of us enter text onto the page and then go back and uplink the pieces we need as we complete sentences or header text. Sometimes I can't remember what the phrase I wanted to highlight originally said. Now, if I want to preserve it, I need to either upload the file in advance OR I need to upload the file next to the text I want associated with it and then cut or copy the text from the page and enter it into the new popup box for the link/linked info.

Either way you look at it, steps/time is being added to the process which is problematic.

Okay, so I'll admit that there is ONE reason keeping me from turning off the New RCE somewhat permanently, and that is the ability to select or enter any color code value in hex or RGB.  I got so tired of either manually entering custom colors in HTML OR highlighting in a color as a placeholder and then replacing it in the HTML. THANK YOU!

  • This is especially helpful for when I'm trying (current goal) to keep my colors contrast friendly. Makes precision using the webaim.org contrast checker much easier.

On the other hand, there are some glaring problems that make me keep turning it off, mostly involving things that cost me time instead of saving it:

  1. The lack of a fixed tool bar when editing (the instant expand window require constant scrolling to do anything involving the tool bar). This has already been mentioned by many.
    • HOLY COW--While I have been typing this comment this particular issue suddenly seems to be fixed. I am gobsmacked. I hope that Number 1 on my list is now an obsolete complaint. PLEASE let this be true, lol. I went to look at something in a page and my tool bar stayed still when I expanded the window. WOOHOO.
  2. Documents uploaded while editing replace highlighted text with file name requiring some sort of workaround OR uploading of file ahead of time (or in a separate tab with files open so that it will be available in the main tab, but still, EXTRA STEPS are required).
  3. Documents uploaded in New RCE are NOT available for inline preview (this could be an institutional issue, I'm pursuing locally first).
  4. Having to dig around in the file structure to find files.
  5. Not being able (that I have found) to set a preference for how "files" or "documents" arranges things so that digging around is easier. The default seems to be the completely unhelpful "date added"--I say unhelpful because it displays the files in order by OLDEST first. If I'm looking for something, it is far more likely to be the most recent thing I added if I am searching by "date added."

Other stuff I can deal with. I find the different buttons for URL/Canvas Page links vs. file/media/document uploads annoying because I tend to categorize them all under the umbrella "link" in my own head, but that's really more of a preference issue that I just have to deal with (and eventually I will retrain my brain to remember that Canvas doesn't consider those all to be links).

Based on an issue that we had previously with text linking and then inline box, I'm now suspicious that I'm not getting the file preview with files that are already uploaded that I link to through the file selector, only with the ones I upload on the spot. The ones that require me to retype a label over them because highlighting the text to which I want to link them erases the linked text (and this old lady then has to remember it, lol).

Found an issue which will be painful till the new student assignment workflows are released. As you can see from the screenshot below the "plugins" button is hidden under a menu for student assignment submissions.  This is needed for several tools such as Kaltura and some others as thats how they submit assignments (embedded in a content page).  This is a pretty bad experience for students.  The LTI plugin button should ALWAYS be visible as its probably more useful than most of the rest of the bar.  Alternatively reflow it to a second line would make sense.

336752_pastedImage_1.png

I spoke too soon.

The window is still resizing itself making editing a true annoyance.

KD

For the "Apps" button that lists the LTI apps that have been installed in an account or course, it is not really apparent where users are to click on to select the app that they want to use.  The gray text below the name of the app shows a ">" (to expand the text) along with the the description of the app.  To select the app, the mouse cursor changes to a text icon (as shown in my attached image). This is inconsistent with how a hand icon usually displays when clicking on a link on a web page.  This happens in both Firefox and Chrome.  Can this icon be changed?

New RCE - LTI Apps

If you hover your mouse over the gray descriptive text for any of the LTIs listed, the icon does change to the hand icon.  Not sure why the mouse icon changes to the text icon when hovering over the actual name of the LTI app.

Agreed...These are the details that are constantly overlooked in these new releases 😞

I found a video from the instructor's perspective that I plan on sharing with our staff.  Will there be a video created for students?  I need to send a global announcement explaining the differences and a video would be ideal.

thanks,

~G

Had the same issue, added a new document and could not find it until I sorted alphabetically. When viewing documents added in date order, my most recent documents did not show.

Katrina,

Warning Answer contains html coding -- I do not know html and this answer is based on observation and experimentation

In answer to your question 3:

The html coding that the file is given when it is inserted has changed to one of the following - depending if you are going into html before or after saving and attempting to preview (differences highlighted)

  • This if you look at the code prior to saving and testing the preview button
    • <p><a id="78209308" class="instructure_file_link instructure_scribd_file" title="Link" href="https://community.canvaslms.com/courses/989335/files/78209308/preview?wrap=1" target="_blank" rel="noopener noreferrer" data-canvas-previewable="true">Course COR.pdf</a></p>
  • This if you saved, tested the preview button then the code has been changed to 

Both of these are different from what is used in the old RCE. 

You can adjust the html coding (if you are comfortable doing so) to make it work. I don't know html, but through comparing the html code in the New RCE and the Old RCE and experimentation I did get it to work with minimal changes 

If you change preview?wrap=1 (prior to saving and testing preview) or preview (after saving and testing preview) (highlighted above - either option) to download?wrap=1 (highlignted below) the in-line preview option should work

If you want the in-line preview to auto-open you need to add auto_open (highlighted below) along with the change made above

Thanks for enumerating the clicks that it takes to create a file link in the new RCE, martha@wolseyhalloxford.org.uk‌. You may be interested in the Idea I posted to https://community.canvaslms.com/ideas/15966-show-entire-toolbar-in-new-rce?sr=search&searchId=dd16f8...‌. This could eliminate one click! Thanks.

I've found that if you edit a Course Link using "Edit Link" on the Link tool, it gives you the external tool dialog box asking for the URL. Since we don't know the URL of the page or discussion or whatever, It should give you the same list of course resources you get when you add a course link.  Workaround:  remove the link first, then you can choose Course Link and see all the course resources we used to see in the Content Selector, on the Links tab.

I just discovered this also.  This adds more clicks to the process of maintaining sites for our faculty.

Hi, all,

Our product manager is working on an update regarding the New RCE, and to help her compile all her thoughts, I am closing this document to comments. If you're finding contrary behavior in the New RCE, please submit the information to Canvas Support (or per your institution's support policy) so that we can be made aware and correct those issues.

Thanks so much!

Erin

Version history
Revision #:
2 of 2
Last update:
5 hours ago
Updated by: