As much as possible, I like to be in control of the HTML/CSS/JS output from my WordPress projects. Starting with WordPress 4.2, there’s an interesting block of stuff that shows up in <head> output:

<script type="text/javascript">
window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/72x72\/","ext":".png","source":{"concatemoji":"http:\/\/www.example.com\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.4.3"}};
			!function(a,b,c){function d(a){var c,d,e,f=b.createElement("canvas"),g=f.getContext&&f.getContext("2d"),h=String.fromCharCode;return g&&g.fillText?(g.textBaseline="top",g.font="600 32px Arial","flag"===a?(g.fillText(h(55356,56806,55356,56826),0,0),f.toDataURL().length>3e3):"diversity"===a?(g.fillText(h(55356,57221),0,0),c=g.getImageData(16,16,1,1).data,g.fillText(h(55356,57221,55356,57343),0,0),c=g.getImageData(16,16,1,1).data,e=c[0]+","+c[1]+","+c[2]+","+c[3],d!==e):("simple"===a?g.fillText(h(55357,56835),0,0):g.fillText(h(55356,57135),0,0),0!==g.getImageData(16,16,1,1).data[0])):!1}function e(a){var c=b.createElement("script");c.src=a,c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var f,g;c.supports={simple:d("simple"),flag:d("flag"),unicode8:d("unicode8"),diversity:d("diversity")},c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.simple&&c.supports.flag&&c.supports.unicode8&&c.supports.diversity||(g=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",g,!1),a.addEventListener("load",g,!1)):(a.attachEvent("onload",g),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),f=c.source||{},f.concatemoji?e(f.concatemoji):f.wpemoji&&f.twemoji&&(e(f.twemoji),e(f.wpemoji)))}(window,document,window._wpemojiSettings);
</script>
<style type="text/css">
img.wp-smiley,
img.emoji {
	display: inline !important;
	border: none !important;
	box-shadow: none !important;
	height: 1em !important;
	width: 1em !important;
	margin: 0 .07em !important;
	vertical-align: -0.1em !important;
	background: none !important;
	padding: 0 !important;
}
</style>

It’s an inline script, along with a corresponding CSS stylesheet, for parsing emoji text like :-) and turning it into graphical symbols like Emoji Smiley Face.

Sigh.

This is all well and good, but most of my WordPress projects don’t require emoji, and I don’t want any extra stuff in my HTML output unless it really needs to be there.

WordPress includes several built-in functions for emoji processing, and these are called at several different hooks. Depending on your situation, you may want to use all of these, or just some of them.

The Code

Add the following code to your theme’s functions.php file. The comments above each set of statements outlines what each is for. Feel free to remove any unneeded lines from the function body:

function wptb_disable_emoji_output() {
	//Removes emoji CSS and JS in the tag of your theme
	remove_action('wp_head', 'print_emoji_detection_script', 7);
	remove_action('wp_print_styles', 'print_emoji_styles');
	
	//Removes emoji CSS and JS when you're logged in to WordPress
	remove_action('admin_print_scripts', 'print_emoji_detection_script');
	remove_action('admin_print_styles', 'print_emoji_styles');
	
	//Removes emoji translation from feeds
	remove_filter('the_content_feed', 'wp_staticize_emoji');
	
	//Removes emoji translation from user-submitted comments in feeds
	remove_filter('comment_text_rss', 'wp_staticize_emoji');
	
	//Removes emoji translation from email messages sent by WordPress
	remove_filter('wp_mail', 'wp_staticize_emoji_for_email');
}
add_action('init', 'wp_tb_disable_emoji_output');

// Emoji and 'Smilies' are different, so we have
// to disable Smilies too. This prevents automatic
// conversion of text smilies into graphical symbols.
add_filter( 'option_use_smilies', '__return_false' );