pasting quote marks adds “ and ”

[lglen2]

“ and ” are the HTML codes for the left and right quote marks, respectively (" and ").

When I copy from a plain text editor into Canvas' HTML editor (in an assignment page), initially, all seems well. But once I click to view the result in the WYSIWYG editor, I get a Canvas "error" page ("There's nothing here").

When I go back into HTML view, I notice the left/right quote codes have been added inside the " and " characters. In other words, it's not even replacing the characters; it's trying to duplicate them. Neither is good, because I get this error screen.

I used to be a web developer. I know from HTML. It's not that I'm typing something weird or that I don't know what I'm looking at when I use the HTML editor. Why is Canvas doing this, and more importantly, how do I make it stop? I need to paste a code snippet into something like 80 pages (over two courses), and possibly more in the future. I cannot stand the thought of having to go back and select and delete the “ and ” strings (twice each per page, by the way) every single time. Someone please save me!

[chriscas · Accepted solution]

Hi @lglen2,

Thanks for the video, it does help a bit to see wha you're doing.  It's a bit hard to see in the video for sure, but you did verbally say the quotes around the work "LINK" in the code you copy/pasted from what looks like Apple TextEdit over into the Canvas RCE are open/close quotes, which I'm interpreting as being "smart" quotes which TextEdit will create for you.  If that's the case, that's the fundamental problem, as HTML needs straight, not smart/curly quotes.  I think the reason you're getting the double quotes is that the Canvas RCE is trying to be helpful in adding quotes to what would otherwise be invalid html with the smart/curly quotes...

I'm not exactly sure where that code snippet in your TextEdit window came from, but it may help to put TextEdit into  "plain text" mode (format menu, "make plain text") before doing any coding there as in plain mode it shouldn't do anything to manipulate straight quotes into smart/curly ones.  I actually have TextEdit default to plain text (TextEdit -> settings, choose Plain text under format) because I do use it for code snippets too, and the rich text creates a lot of headaches like this in many other areas too.  Changing to plain text won't fix the smart/curly quotes that were already created, you will need to retype those if you attempt it, but when in plain text mode from the start, you likely won't have any of those to deal with anymore anyways.

I hope this helps a bit!

-Chris

[Chris_Hofer]

Hi there, @lglen2 ...

I was trying to follow your steps, but I couldn't duplicate exactly what you were seeing.  So, I wonder if you might be able to share a short screen recording of what you are seeing on your end?

The only other thing I can think of...which I don't even know if it is related...is that when I paste in “ and ” to the HTML side of the RCE (Rich Content Editor) and then switch back to the WYSIWYG side of the RCE, I notice that the quotation marks are curly in form compared to straight up and down.  I've increased the font size just to show you an example.  The top quotes are your HTML code, and the bottom ones are by typing the quotes on your keyboard in the WYSIWYG editor.

The HTML code (without the increase in font size) looks something like this:

<p>&ldquo; &rdquo;</p>
<p>" "</p>

Again, I really don't know if this helps to answer your question, but just thought I'd reply with this observation.  If you can share a short video of what you are seeing, I think that would be helpful.

Thanks!

[lglen2]

Thanks @Chris_Hofer. I did make a quick video, and I couldn't figure out (quickly) how to upload it, so I just put it on YouTube. Here's a link: https://youtu.be/pExmBfra9Ao

It looks like what's being introduced are the "curly" quotes, but (as you'll see in the video), even if I don't do a second "paste" those characters still get added.

[chriscas · Accepted solution]

Hi @lglen2,

Thanks for the video, it does help a bit to see wha you're doing.  It's a bit hard to see in the video for sure, but you did verbally say the quotes around the work "LINK" in the code you copy/pasted from what looks like Apple TextEdit over into the Canvas RCE are open/close quotes, which I'm interpreting as being "smart" quotes which TextEdit will create for you.  If that's the case, that's the fundamental problem, as HTML needs straight, not smart/curly quotes.  I think the reason you're getting the double quotes is that the Canvas RCE is trying to be helpful in adding quotes to what would otherwise be invalid html with the smart/curly quotes...

I'm not exactly sure where that code snippet in your TextEdit window came from, but it may help to put TextEdit into  "plain text" mode (format menu, "make plain text") before doing any coding there as in plain mode it shouldn't do anything to manipulate straight quotes into smart/curly ones.  I actually have TextEdit default to plain text (TextEdit -> settings, choose Plain text under format) because I do use it for code snippets too, and the rich text creates a lot of headaches like this in many other areas too.  Changing to plain text won't fix the smart/curly quotes that were already created, you will need to retype those if you attempt it, but when in plain text mode from the start, you likely won't have any of those to deal with anymore anyways.

I hope this helps a bit!

-Chris

[dbrace · Accepted solution]

Thanks for the video, @lglen2.

As someone that is primarily an Apple user, I was going to say something similar to @chriscas.

In short what could be happening when you are using TextEdit and in "rich text mode" and even if the file has not been saved, you are working in a file format that would result in being an RTF file and not a TXT file. Switching to "Make Plain Text" will remove any of that potential formatting that could have come from somewhere else.

Another option to try, and I use it by default on my Macs, is the free version (it will be in a trial mode for 30 days) of BBEdit. BBEdit is what I use on a regular basis, except for specific use-cases when I still use TextEdit in plain-text mode.

Two other things to try, and it might not be as easy or convenient but can help with troubleshooting, are to:

1. manually type the link instead of copying and pasting
2. does that same experience happen if you try to use another website that supports embedding

Please let us know how it goes.

-Doug

[chriscas]

Hi @lglen2,

Just to have a second opinion here, I also tried to replicate your issue but everything on my end worked as expected (no extra characters or any of the weirdness you're getting).  Maybe there is something else in the content that you're pasting that's affecting the quotes in a weird way, of maybe your Canvas instance has some kind of extra customization that's changing html.  As @Chris_Hofer said, a short screen recording or maybe attachment of the html code you're copy/pasting might help us replicate the issue.

Look forward to hearing back from you!

-Chris

[dbrace]

Hi @lglen2,

Have you reviewed https://community.canvaslms.com/t5/Canvas-Resource-Documents/Canvas-HTML-Editor-Allowlist/ta-p/38706...?

Are you trying to use something else that is not allowed?

What happens if you try to use the W3Schools Tryit Editor at https://www.w3schools.com/html/tryit.asp?filename=tryhtml_intro? 

-Doug