WordPress is a powerful content management system. However, you need to do some tweaking for WordPress to work in your way. The latest Gutenberg editor has a preformatted block for adding text content without formatting. But this does not work when you want to show straight or neutral quotes. In this article let us explain different ways to type straight single and double quotes in WordPress.
Smart Quotes Vs Straight Quotes
If you have noticed, there are many types of quotation marks available in punctuation. Straight and curly quotes are the two mostly used formats out of all. All programming and coding languages use single and double quotes in straight format. However, most of the word processing software like Word and Pages use smart quotes by default. In our earlier article, we have explained how to disable these smart quotes in Word and Pages.
|Quote||Single (apostrophe)||Double (quotation)|
Smart Quotes Problem in WordPress
Coming back to WordPress, this is an embarrassing issue that WordPress will automatically convert the straight quotes to smart quotes. The problem is annoying, as you will see the straight quotes in the editor. However, the converts will appear as smart quotes when you publish the content.
When you copy and paste the code with smart codes, the entire execution will be broken. Let us take an example of modifying functions.php file in WordPress. There are lot of websites that offer code snippet and filters to add or remove functionalities to your theme. Most of them are not aware that the code may look fine on the editor when they type but the quotes will be replaced with smart quotes on the browser display. When you copy and paste the code with smart quotes on your functions.php file, it will break the entire site and result in white screen of death.
Why Smart Quotes in WordPress?
WordPress uses ‘wptexturize’ filter to convert the straight quotes to curly quotes. As mentioned, this conversion happens only when you publish the content. So the display will simply look fine on the Gutenberg or classic editors. However, the browser display will only have curly quotes.
WordPress uses ‘wptexturize’ to replace straight quotes with curly quotes in the following filters.
4 Ways to Use Straight Quotes in WordPress
- By editing functions.php file
- Add custom plugin
- Use plugin from repository
- Try text editor with HTML entity
1. Modify functions.php File
Login to you WordPress dashboard and navigate to “Appearance > Editor” section. Choose your theme and go to “functions.php” file. Alternatively, you can login to your FTP client and navigate to “wp-content > your theme” location and edit the “functions.php” file. Add the following code at the end of the file and save your changes. If you use FTP, re-upload the file back to server.
/** Disable Curly Quotes */ remove_filter('the_content', 'wptexturize'); remove_filter('the_title', 'wptexturize'); remove_filter('the_excerpt', 'wptexturize');
Now that all your quotes will look the way you enter on the editor. You can use straight or smart quotes on the editor and they will look similar on the browser display.
Remember, this will help to remove the curly quotes from content, title and excerpt. You can simply add more filters for removing it from other places. For example, if you want to remove curly quotes from comments add the below line in addition to the above code.
2. Add it as a Custom Plugin
Problem with modifying functions.php file is that the changes will get wiped off when you change the theme or update the theme. So the best way is to add the above snippet as a separate functional plugin so that it stays intact forever.
Copy and paste the below content on a text editor and save the file with .php extension. For example, you can save the file as disable-smart-quote.php. Ensure to modify the commented section with your own content.
<?php /* Plugin Name: Disable Smart Quotes Plugin URI: Description: Disable curly smart quotes in post content, comment and title. Version: 1.0 Author: WebNots Author URI: https://www.webnots.com */ remove_filter('the_content', 'wptexturize'); remove_filter('comment_text', 'wptexturize'); remove_filter('the_title', 'wptexturize'); ?>
Now, login to your FTP client and upload the PHP file into “wp-content > Plugins” folder of your WordPress site’s installation. Go back to WordPress dashboard and navigate to Plugins section. You can activate the disable-smart-quotes plugin like any other plugin.
3. Use Plugin from Repository
If you are not interested in playing around with creating a new plugin then grab an existing one. Go to “Plugins > Add New” in your WordPress admin dashboard. Search for wpuntexturize and find the wpuntexturize plugin. Install the plugin and activate it.
This plugin really helps to remove single and double curly quotes from your content.
4. Use Text Editor with HTML Entity Code
You can use HTML entity code to represent straight single and double quotes in webpages (type the code without spaces, we have to add space so that it can be displayed on the browser).
|Quote||HTML Entity Decimal||HTML Entity Hexadecimal|
If you use classic editor then switch to Text editor when you type. On Gutenberg, click on the three dots settings icon on the top right corner and choose “Code Editor” option.
Here you can use either decimal or hexadecimal HTML entity codes to produce the straight quotes. It will look same on the browser display. However, you can’t do this on other places like title, comments, etc.
We hope you can use one of the above explained methods to get rid of curly quotes from your WordPress site. Ensure to use appropriate filters to disable from posts, title comments or excerpt.
HEY, hey, hey. You typed the strings to ad in functions.php SO BADLY that a half of it is wrong. You must write in the end of the functions.php THIS instead:
If the quotes in this comment will appear curly, replace them with straight ones!
The code looks correct in the article as well. We have wrapped the code inside preformated code, so the quotes look proper.
I’m using the HTML entity code for an apostrophe in a title, but it converts it upon save. Is there anything I can do to stop this on a per-page basis? I know I can turn it off in titles entirely, but normally I want a curly apostrophe. I tried the Raw HTML plugin, but it’s not helping.
Inserting function will affect the entire site, we do not see it is possible to apply a function unless you have a custom built solution.
The irony of this article is that your code snippet is outputting using the curly quotes, which doesn’t work when copying+pasting.
I’d also add: remove_filter(“comment_text”, “wptexturize”);
I thought about this as well. The irony…
It seems the code wrapper was changed to a paragraph. We have updated the content by using proper preformatted text. Now, it should work fine for copy pasting.