Home Experience & Tips Sharing Standard Post

Standard Post

Plugins and Code for Adding Emojis to WordPress Comment Box (2020 New Edition)

How to add emoji icons to WordPress comment boxes? Naiba used to add them via code in the early years, but now that I'm involved in foreign trade website building, I pay less attention to site comments. Some novice webmasters asked this question, so Naiba will summarize the WordPress comment box emoji plugins and code that can still be used. WP Comment Box Emoji Plugins For beginners…

Updated on September 21, 2020 About 3 minutes reading
WordPress评论框添加表情的插件和代码分享(2020新版)

How to add smiley and other emoji icons to the WordPress comment box?Naiba added them via code many years ago, but now, after getting intoForeign Trade Website Buildingthe focus on website comments has become less. Since some novice webmasters asked about this, Naiba has summarized for everyonethe still usable WordPress comment box emoji plugins and code.

WP Comment Box Emoji Plugin

For beginners, modifying code to add emoji images is quite troublesome, so you can consider using these plugins. Just install and activate them.

Emoji in comments

WordPress评论框表情

The 'Emoji in comments' plugin is very simple. It displays a button in your comment box for inserting emojis.

Download Link

Kama WP Smiles

 

Kama WP Smiles评论表情插件

The emoji icons in Kama WP Smiles are not as rich as those in Emoji in comments introduced above, but the advantage is that you can control which emojis are displayed in the front-end comment area.

A little trick is to replace the emoji icons in the plugin folder with your own favorite emoji images.

Download Link

WordPress Aru Emoji Plugin

wp-alu WordPress评论表情图标插件

wp-alu is a plugin made by a Chinese developer. Download it from GitHub and upload it to use. There is no settings interface. If your theme uses the comment_form form, it works directly. If not, you need to insert code to call it yourself.

<p class="comment-form-smilies"><?php echo alu_get_wpsmiliestrans();?></p>

Similarly, you can consider replacing the image content yourself.

Download Link

WordPress Comment Code Version

WordPress评论表情

The code version essentially uses a similar method to the plugins, but it's not very beginner-friendly. The following method is only suitable for those with some coding foundation.

Implementation Method:

1. Download the required files from below.

Download Link

2. After decompressing the downloaded archive, there are 3 sets of emojis in three folders: smilies1, smilies2, and smilies3. Choose a set you like (or replace them with your own emoji icons), and rename the folder to smilies.

3. Upload the entire modified smilies folder to the images folder under your website's theme folder (if there is no images folder, create one; I'm afraid beginners won't know how to modify the code).

4. Upload the smiley.php file from the archive to your website's theme directory.

5. Edit the theme's comments.php file and add the following code in an appropriate location.

<?php include(TEMPLATEPATH . '/smiley.php'); ?>

6. Add the following code to the theme's functions file.

//自定义表情路径
function custom_smilies_src($src, $img){return get_bloginfo('template_directory').'/images/smilies/' . $img;}
add_filter('smilies_src', 'custom_smilies_src', 10, 2);

Finally, it's done. It can be seen that it is much more cumbersome than using a plugin.

Reference source for the code method:

  1. Method for Adding Custom Comment Emoji Packs in WordPress (with Download Links for Three Emoji Packs)
  2. WordPress Comment Emoji Optimization

If the above code doesn't work well, you can search online yourself. There are many articles about adding emoji icons to the WordPress comment box. However, in general, if a plugin can achieve the function, consider using the plugin directly. After all, the domestic WP blogosphere discussing technology is very small now, and many codes might be outdated and ineffective due to lack of maintenance.

3.8/5 - (16 votes)
Previous How to Change the Default Add to Cart Button Text in WooCommerce Continue reading content around the same timeline. Next WordPress 5.4.2 Update Log View the next related tutorial or experience.

AI Website Building Assistant

🤖
Hello! I am the Naibabiji AI Assistant. How can I help you?
Quick Consultation: