What's WP
Find Everything Related to WordPress - Best Tutoriasl on WordPress!
How to Add the Inline Comments Capability to WordPress?

How to Add the Inline Comments Capability to WordPress?

WordPress already comes with a decent discussion system for users to exchange ideas over the web. However, instead of having everything at the very end of your website, have you ever thought about giving your visitors the ability to comment on a specific paragraph or other section of a post?

Similar to commenting in Microsoft Word, enabling inline comments makes it possible for users to comment on certain parts of your posts during the reading process. Therefore, we will introduce a simple method to help your add the inline comments capability to your WordPress site in this beginners’ guide.

The method here is utilizing the Inline Comments plugin. Designed right for the job, the plugin can help you add inline comments to any paragraph, headline, image, etc of a post while retaining all the color schemes and layouts of your native commenting system. Now, refer to the steps below to see how we will configure the plugin to our taste.

Install and Activate the Inline Comments Plugin

First of all, you need to enable the Inline Comments plugin through the “Plugins” > “Add New” menu in WordPress. Follow our in-depth guide on installing WordPress plugins if you have come across any problems during the installation process.

Install the Inline Comments Plugin

Change the Basic Settings of the Plugin

On the admin area of your dashboard, locate “Settings” > “Inline Comments” and click on it to enter the plugin settings page. As you can see from the following screen capture, the plugin allows you to decide where to load and display the inline comments.

By default, the plugin loads inline comments on both posts and pages. You can change this setting according to your actual needs. Also, you can define where the inline comments should be displayed by inserting sectors like h1, span, image, etc.

Define the Status and Selectors

In regular cases, visitors have to wait for the page to reload at each time they have posted a comment, which certainly breaks their browsing momentum. To fix this, you can integrate Inline Comments neatly with the WP Ajaxify Comments plugin through the simple configuration option as below.

By ticking the checkbox, the Ajax functionality of the latter plugin will be added to stop your page from reloading whenever a comment is submitted.

Empower the WP Ajaxify Comments Plugin

Moreover, the plugin makes it possible for you to add a reply link below every single inline comment, via which users can reply to the comment directly. The next option – “Slide Site” Selector is offered to define which content should slid left or right when a user clicks on a inline comment bubble. You can change the default HTML to any other selectors if there is a need.

Save Changes

After finishing the configurations above, do not forget to click the “Save Changes” button on the page’s footer to store all your settings.

Style the Inline Comments

In the next, navigate your mouse to the “Styling” tab and you will see multiple options provided for you to style the inline comments. Firstly, you can add additional CSS in the corresponding box as below. The plugin offers a detailed tutorial to help your create and use your custom CSS in case that you are not familiar with these processes.

Add Additional CSS

Secondly, you can decide whether the inline comments should be presented on the left or right side of a certain paragraph. Also, you can choose to display an avatar next to each inline comment and define the avatar size.

Position and Avatar

Thirdly, there are multiple options available for customizing how the inline comment bubbles will look like on your website. You can set the bubble style, background color, background opacity here. In addition, you can hide static bubbles and show them only when users hover over a specific paragraph.

Style Inline Comment Bubbles

Modify the Advanced Settings of the Plugin

The last section – “Advanced Settings” begins with an option for inserting the HTML that you want to show above the list of inline comments.

Insert HTML

With the next two options, you can define how the inline comments will fade in and out. Choose between “No animation” and “Basic animation” on the basis of your preference.

Define the Animation Effect

The following options allow you to remove certain items from inline comments. You can remove the “x” at the right top of the comments wrapper and the “Cancel” link at its left bottom. Also, you are able to remove the filed “Website” from the comments wrapper. By doing so, users cannot submit an URL when they comment inline, which is helpful for preventing WordPress comment spam.

Remove Certain Items

At last, it is possible to display permalinks next to every inline comment and position links to referenced comments that you have submitted using the plugin. You can also choose to always display the comment count bubbles or simply let them fade out.

Display Permalinks

After you have finished with the above configurations and saved changes, you can now visit your site to see the inline comments functioning as below.

Inline Comments in Action

On the Bottom

To sum up, the method introduced above can help your visitors contribute their comments in an easy and efficient manner. Apparently, there is no absolute guarantee that you will get more comments by using this method, but it is indeed worth a try.


Zoe is a freelance writer who has a deep knowledge about WordPress. She loves everything related to website building and loves to share her experience with people all over all the world. In the daily life, Zoe loves detective novels as it can train her logical thinking and creativity.