CommentsSection brings real, persistent comments to any Framer page. Comments sync across browsers via Firebase Realtime Database, or fall back to localStorage for single-device use. Every colour, font, and behaviour is customizable from the property panel — no code required.
Comments sync live across every browser and device using Firebase Realtime Database. Just paste your database URL into the property panel. No backend or code required. Falls back to localStorage automatically if no URL is set. Takes 5 minutes to set up, and I am here to help feel free to reach out if needed.
The compose box expands on click and supports bold, italic formatting and inline image uploads. Images display inline in the comment thread. Image upload can be toggled off from the panel.
Every comment supports nested replies with their own like counts. Choose between a heart or thumbs-up icon from the panel.
The most-liked comment is automatically surfaced at the top in a highlighted card. It updates in real time as likes change and only appears once there is a clear leader with at least one like.
Users can report comments via the ··· overflow menu. Once reports reach the configurable threshold, the comment is auto-hidden from public view. Admins can review, restore, or permanently delete flagged comments using Admin-Mode in the panel.
Built-in per-author daily post limits prevent spam without requiring login. Long threads paginate automatically with a "See all responses" button. Both limits are configurable from the property panel.
Upload a set of avatar images from the panel. Each commenter is assigned one consistently based on their name. If no avatars are uploaded, the component falls back to auto-generated initials with unique hashed colours.
Every visual detail is exposed in the property panel — 18 colour tokens, font picker, corner radius, padding, dividers, and more. Designed to match any design system from light minimal to dark editorial.
*Note: Component Preview is currently in admin-mode. Comment remove or report as you test.
Need more features with this component? Feel free to reach out anytime — I'm here to assist you!
Blue Jackson
