How Highlight & Note Works
When a reader selects text inside a post, a floating toolbar appears right below the selection with two choices: Highlight and Add note. Choose Highlight and the passage is wrapped in a familiar marker color. Choose Add note and a compact popover appears for the reader to write their thought — the textarea auto-focuses, cursor jumps to the end of existing content, smooth as a native app.
Once saved, the highlighted passage keeps its state. Clicking an existing highlight opens the popover to view, edit, or delete the note. The entire flow — from selection to saved note — takes under two seconds.
100% Client-Side Storage: Private, Fast, Server-Independent
The biggest strength of this feature lies in how data is stored. Highlights and notes are saved to the browser’s localStorage, keyed per individual post. This means:
- Zero data sent to the server — completely private, zero impact on your database or hosting performance
- No login required — anonymous readers use it out of the box
- Auto-restored on revisit — every time a reader returns to a post, their highlights and notes appear exactly as they left them
- Works offline — after the page loads, the feature keeps working even without a connection
This is the privacy-first approach that platforms like Medium have proven effective: readers own their own data, on their own device.
UI Consistent with the Theme Design System
The Highlight & Note toolbar and popover reuse the theme’s existing uk-button and uk-border-pill classes, ensuring a pill-style look consistent with other elements like category chips, tag chips, and the comment submit button. Nothing looks bolted-on — everything feels designed from day one.
The popover auto-positions to stay within the viewport, and auto-hides on scroll or outside click. The toolbar also vanishes when the reader clicks elsewhere, never getting in the way.
Flexible On/Off Toggle in Theme Settings
Admins stay in full control. Under Theme Settings → Post Settings, the init_press_enable_highlight_note option lets you enable or disable the entire feature. Default is on, but if you prefer a minimal interface or want to avoid conflicts with third-party plugins, one click is all it takes.
Performance Optimization: Load Only When Needed
Version 1.2.8 also brings a significant performance improvement: initPressData strings used exclusively by is_singular() — including series index, table of contents, reading progress, Highlight & Note — are now only printed on singular post pages instead of every page across the site. This cuts redundant data on the homepage, archive pages, and static pages, making your site noticeably faster.
Fully Internationalized, Ready to Translate
The entire Highlight & Note interface — from button labels to textarea placeholders — is fully internationalized following WordPress i18n standards. A ready-made Vietnamese translation ships with the theme; admins simply switch the site language and the UI adapts automatically.
Wrapping Up
Init Press 1.2.8 is not just adding a new feature — it elevates reading from passive to interactive. Readers no longer just read and leave; they leave personal marks on every post, turning your blog into a reading space that truly belongs to them.
Comments