Disable Emojis in WordPress: Improve Your Site’s Loading Speed and Performance

In this article, I will show you how to disable emojis in WordPress easily and improve your blog loading speed.

By default, WordPress loads the emoji scripts and stylesheets to show emojis on the website. However, you can easily block the loading of these scripts and still allow users to see the default browser emojis.

This will reduce the total number of requests and the page size of the webpage, which is important for core web vitals, which is now a ranking factor. There are various ways to block the loading of emoji scripts on WordPress, either using custom PHP code snippets or using your existing performance plugin.

How to Disable Emojis in WordPress without a plugin?

First, check out how you can disable emojis on WordPress without a plugin.

To block emoji you need to use the below code in your theme’s function.php file. Alternatively, you can also use a code manager plugin to manage these codes.

function disable_emojis() {
 remove_action( 'wp_head', 'print_emoji_detection_script', 7 );
 remove_action( 'admin_print_scripts', 'print_emoji_detection_script' );
 remove_action( 'wp_print_styles', 'print_emoji_styles' );
 remove_action( 'admin_print_styles', 'print_emoji_styles' ); 
 remove_filter( 'the_content_feed', 'wp_staticize_emoji' );
 remove_filter( 'comment_text_rss', 'wp_staticize_emoji' ); 
 remove_filter( 'wp_mail', 'wp_staticize_emoji_for_email' );
 add_filter( 'tiny_mce_plugins', 'disable_emojis_tinymce' );
 add_filter( 'wp_resource_hints', 'disable_emojis_remove_dns_prefetch', 10, 2 );
}
add_action( 'init', 'disable_emojis' );
 
function disable_emojis_tinymce( $plugins ) {
 if ( is_array( $plugins ) ) {
 return array_diff( $plugins, array( 'wpemoji' ) );
 } else {
 return array();
 }
}

function disable_emojis_remove_dns_prefetch( $urls, $relation_type ) {
 if ( 'dns-prefetch' == $relation_type ) {
 $emoji_svg_url = apply_filters( 'emoji_svg_url', ' );
 
$urls = array_diff( $urls, array( $emoji_svg_url ) );
 }
 
return $urls;
}

How to disable Emojis in WordPress using the Litespeed cache plugin?

If you are using the LiteSpeed Cache plugin, you can disable emojis with a single toggle switch. To do this, go to the LiteSpeed Page Optimization option and click on HTML Settings. Scroll down to find the option “Remove WordPress Emoji” and enable it. Then, click Save Changes.

You have now successfully disabled the emoji script from loading in your WordPress website.

How to disable Emojis in WordPress using the Perfmatters plugin?

If you are using the Perfmatters plugin, you can disable emojis in WordPress with just one click. The option is at the very beginning of the Perfmatters settings page, called “Disable Emojis.”

Just Enable the settings and you are good to go.

How do I remove emojis from WordPress CSS?

To remove emojis from WordPress CSS, you can follow these steps:

1. Open the functions.php file of your theme.
2. Add the following code to the file:

PHP

function disable_emoji_css() {
  // Remove the emoji CSS stylesheet.
  remove_action( 'wp_print_styles', 'print_emoji_styles' );
}

add_action( 'init', 'disable_emoji_css' );

3. Save the file.

This code will remove the emoji CSS stylesheet from being loaded, which will prevent emojis from being displayed on your website.

If you are using a caching plugin, such as WP Rocket or LiteSpeed Cache, you may need to clear your cache after adding this code in order for the changes to take effect.

You can also remove emojis from WordPress CSS by manually editing your theme’s CSS files. However, this is not recommended unless you are familiar with CSS and know where to look for the emoji CSS rules.

Here is an example of how to remove emojis from WordPress CSS manually:

CSS

/* Remove emoji CSS rules */

.wp-smiley,
.wp-emoji,
.emoji {
  display: none !important;
}

Add this code to your theme’s main CSS file, such as style.css.

Once you have added the code, save the CSS file and clear your cache (if you are using a caching plugin).

Your WordPress website will now be emoji-free!

How do I turn on emojis in WordPress?

To turn on emojis in WordPress, you can follow these steps:

1. Go to Settings > Writing.
2. Scroll down to the Emojis section.
3. Check the box next to Display emoticons as images.
4. Click Save Changes.

WordPress will now display emojis in your posts, pages, and comments.

If you are using a caching plugin, such as WP Rocket or LiteSpeed Cache, you may need to clear your cache after making this change in order for the changes to take effect.

You can also turn on emojis in WordPress by manually editing your theme’s functions.php file. However, this is not recommended unless you are familiar with PHP and know where to add the code.

Here is an example of how to turn on emojis in WordPress manually:

PHP

// Enable emojis.
add_action( 'init', 'enable_emojis' );

function enable_emojis() {
  // Enable the emoji detection script.
  add_action( 'wp_head', 'print_emoji_detection_script', 7 );
  // Enable the emoji stylesheet.
  add_action( 'wp_print_styles', 'print_emoji_styles' );
  // Enable the emoji filter from the_content feeds.
  add_filter( 'the_content_feed', 'wp_staticize_emoji' );
  // Enable the emoji filter from comment text RSS feeds.
  add_filter( 'comment_text_rss', 'wp_staticize_emoji' );
}

Add this code to your theme’s functions.php file, such as style.css.

Once you have added the code, save the file and clear your cache (if you are using a caching plugin).

Your WordPress website will now support emojis!

Conclusion

In this article, you have learned how to disable emojis on your WordPress site. If you have any questions, please feel free to ask me in the comments section.