manifest / social / basic-inline-comments

Inline Comments Advanced

Allows users to highlight text within .entry-content and comment inline on that specific selection. Includes inline pop-ups, threaded replies, and scroll-to functionality from comment list.

by James LePage · github.com/jameswlepage/basic-inline-comments · website

★ 0stars

0forks

Install

No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:

wp plugin install https://github.com/jameswlepage/basic-inline-comments/archive/refs/heads/main.zip

Readme github.com/jameswlepage/basic-inline-comments ↗

A WordPress plugin that enables contextual commenting by allowing users to highlight text and attach comments directly to specific content selections.

Features

🔍 Text highlighting for comment targeting
💬 Inline comment popups with Tippy.js
🧵 Threaded comment replies
🔗 Automatic linking between comments and highlighted text
📜 Scroll-to-highlight functionality from comment list
🔄 REST API integration for comment handling
🎨 CSS-powered nested highlight colors

Installation

Download the plugin ZIP file
Go to WordPress Admin → Plugins → Add New → Upload Plugin
Activate the "Inline Comments Advanced" plugin

Requirements

WordPress 5.6+
PHP 7.4+
jQuery (included in WordPress)
Tippy.js (automatically loaded from CDN)

Configuration

Ensure comments are enabled for your post/page
Configure comment settings under Settings → Discussion
The plugin automatically works with standard WordPress comment functionality

Usage

Creating Inline Comments

Highlight text in any post/page content
Click the popup button that appears
Write your comment and submit

Viewing/Replying to Comments

Click any highlighted text to see associated comments
Use reply buttons to participate in threaded discussions
Click "link" in comment text to jump to highlighted content

Comment Moderation

Uses standard WordPress comment moderation system
Manage inline comments through the regular Comments admin screen

Customization

CSS Variables

Override these in your theme's CSS:

:root {
    --inline-comment-bg: rgba(255, 255, 0, 0.2);
    --inline-comment-hover-bg: rgba(255, 255, 0, 0.4);
    --inline-comment-active-bg: #ffeb3b;
}

JavaScript Hooks

Available custom events:

inlineCommentBeforeCreate
inlineCommentAfterCreate
inlineCommentBeforeReply
inlineCommentAfterReply

REST API Endpoints

Create Comment

POST /wp-json/inline-comments-advanced/v1/create

{
    "post_id": 123,
    "highlight_text": "selected text",
    "comment": "comment content",
    "parent_comment_id": 0
}

Get Comments

GET /wp-json/inline-comments-advanced/v1/comments Parameters:

post_id (required)
hash (highlight hash)

Compatibility

Tested with:

Classic Editor
Gutenberg Editor
Most major themes
WordPress multisite installations

License

GPLv2 or later. Includes modified versions of Tippy.js (MIT) and Popper.js (MIT).

Support

Please report issues on GitHub. For premium support, contact support@yourdomain.com.