I know what you are thinking what’s wrong with quotes right? Well it depends on which kind we are talking about. I do like famous quotes. The quote of the day, and when they are used to cite an excerpt from another article. Things like that I don’t have a problem with. Many of them I actually enjoy.
What I am talking about involves the use of quotation marks used in html and other code. When I read a tutorial that says just copy this code and paste it into somewhere. Great, no problem, easy enough right. Wrong! Well usually wrong anyway.
Generally what happens, at least in a large portion of the posts I read is the quotation marks get turned into curly quotes also known as (dumb quotes / pretty quotes / fancy quotes).
So what happens is you end up copying the fancy curly quotes and pasting the code into your website and then it won’t do what it is supposed to do. You start thinking that the site doesn’t know what they are talking about. Maybe you even spend an hour or more trying to figure out why it’s not working. You end up kicking yourself if or when you realize you need to replace the curly quotes with standard quotes.
This is also why you might have heard people say don’t copy code from a word processor. Use something like notepad instead. Word processors are notorious for using curly quotes. Scripts like WordPress usually do the same thing. It does look nice when quoting text, but it creates confusion if you post html or other code that has quotation marks in it.
For example if I were to post a simple image html code it might look something like this:
<img src=”http://www.somesite.com/google.jpg” alt=”Google”>
As you can see there is a quotation mark at the beginning and end of the actual link, and in the alt part of the code around Google. They need to be regular (strait) quotes. If the website’s script turns them into the fancy curly quotes then the code isn’t going to work.
On top of that if they were automatically turned into fancy quotes even if you copy and paste the code into notepad you usually end up copying the fancy ones. You would need to manually remove (back space) them, and add regular quotes.
Sometimes they look so similar that it is easy to overlook and not even notice. I don’t always notice myself.
The reason that I am writing this is that I recently spent a lot of time working on something that I couldn’t get working at first. I had copied code from a WordPress blog without realizing I had copied curly quotes. Just when I was about to give up I figured it out.
If you ever copy code from any website you should always remove quotation marks and replace them just to make sure.
There are some things you can do in WordPress to prevent the fancy quotes from being used. You can modify your functions.php to prevent them. The drawback is it will also use standard strait quotes when you use them for quoting text. Since these actually look pretty decent I would rather not replace all of them.
There are several different ways you can go about this, but in the case of WordPress it tends to strip (remove) a lot of raw html code.
Normal Strait Quotes in WordPress Instead of Curly Quotes
The only way I have been able to post html code without it being stripped, and to actually get strait quotes instead of dumb curly quotes is to do the following:
1. Paste you html code into the normal WordPress visual editor.
2. Once you are done switch to the html editor.
3. Highlight your code and select and click on the “code” button.
Example:
It doesn’t look extremely pretty, but at least you will end up with standard strait quotes, which will be beneficial if you are posting html and other code.
It will look something like this:
<img src="http://www.somesite.com/google.jpg" alt"Google">
If WordPress didn’t automatically strip some html code there would be a number of other ways to go about this. It is possible that there is other methods, but everything else I tried got stripped.
An example of curly quotes:
” – Small
“ – Big
An html example with standard and curly quotes:
<img src=”http://www.somesite.com/google.jpg” alt=”Google”>
<img src="http://www.somesite.com/google.jpg" alt="Google">
*The first one has curly quotes and the second has standard strait quotes.
If you do post code for your visitors it would be a good idea to use consider this so they don’t end up with fancy, pretty, dumb, curly quotes and wonder why they can’t get it working.
18 comments
Yeah, I noticed that. You know that’s a real pain in the a** to don’t see the quote site on its real shape. Definitely your post will help to fix that.
Usually they are so small that you can’t even see the difference. For text and type no big deal, but for programming they cause all kinds of problems.
No wonder my friend’s blogspot blog has no image title and alternate tags. He has added those image html codes on all the images manually but still the title and alternate tags just not showing up. I think I should tell him to go check out the quotes.
Peter Lee recently posted..4 Simple Ways to Cut Printing Costs
They may still work with some scripts, but a lot of computer and html coding they just won’t do anything. I spent more time than I should have trying to make a windows .bat file that I had copied curly quotes to. Once I removed the quotes and replaced them with strait normal ones boom it worked perfect. I know it happens a lot in various html programming codes. As for alt tags you wouldn’t see anything unless you viewed the page source or image properties. The title tag you would see when you hover your mouse over text and images.
The same has happened to 2 weeks ago… I just wanted to copy a code from my WordPress blog to an other editor and it didn’t work. Fortunately, my husband had already known that trap and helped me instantly. Good to know that there is somebody who shared this useful information;)
Upon reading the title of this post, I was thinking about quotes as in words from people when you mean coding for websites.
I agree with the idea that you should go the extra step of replacing each quotation mark manually to be sure.
Hi, That is amazing. What a difference such a small thing can make and they are so easily confused. And, with all the competition now you want you images to be a pristine and attractive as possible. Great heads-up, thanks.
I just wanted to copy a code from my WordPress blog to an other editor and it didn’t work. Thanks for letting me stopped by.
I feel the same way! It’s such a headache to work on the html codes for WordPress blogs with these quotes! You have to pay attention to every detail.
Yes, this has happened to me too and I got very angry when I finally realized it was curly quotes causing the problem. It would be nice if there were a way to have WP recognize where not to apply curly quotes.
-Jean
Interesting post, I’ve never heard about the two types of quote signs, but from now on I will use them with care. Thanks for sharing the useful information!
Hey Ray,
I’ve never given this much thought because I don’t use a lot of quotes in my blog. But the ones I do the quotes work fine for me.
I guess if you’re really particular about how you want them to look then I can see why you would want to go in search of the answer.
Sounds like others have had these same issues so they appreciate your help with this.
Adrienne recently posted..What Are You Afraid Of
I do like the nice looking curly type of quotes when I quote text or a reference. When someone posts html or other code WordPress and other CMS systems tend to automatically turn strait quotes into curly ones, which will cause problems. I spent an hour or more recently trying to get something to work, and when I realized it was as simple as replacing the curly quotes with strait quotes I kicked myself.
This reminds me of my writing a Java program and it wouldn’t compile and run because I copied the words to my computer. After about 10 minutes trying to figure it out myself, my teacher told me that I forgot to change the curly quote marks into strait ones. I took me a long time to figure that out. I do like curly quotes work well in quotes. But for the sake of convenience it might be easier to just leave everything in strait quotes.
I am also agree with sara.It’s really headache to work on the html codes.An it ‘ll make you annoyed too when you ‘ll get a quotes site which contains 100% copy paste.
I have unknowingly copied those fancy curly quotes and pasting the code into my website and then worked some time trying to figure out why the link did not work. Then I end up kicking myself when I realize I needed to replace the curly quotes with standard quotes.
great blog, very interesting read, I hate quotes. people don’t realise how much time you waste quoting and then not getting the job!
I understand the differences between quotes. I’ve never thought about it before. I don’t like writing articles directly in the site’s editor, I prefer to copy the text from Word and then paste in the editor with a special icon “Paste from Word”.