User Guide

Get Started

WP Stories is a WordPress plugin that lets you create Instagram-style stories directly on your website. Users can upload images or videos, apply filters and edits, and share their stories with the community. Stories can be displayed in multiple layouts, set to auto-expire, and even integrated with BuddyPress, PeepSo, or BuddyBoss for enhanced social functionality.

👉 With version 2.0, WP Stories introduces a mobile-first redesign, improved performance, and seamless integration with community plugins.

Features

Core Features

Story Creation

  • Easy Upload: Drag-and-drop interface for images and videos.

  • Multiple Media: Supports JPG, PNG, GIF, MP4, and MOV formats.

  • Batch Upload: Add multiple items to a story at once.

  • Mobile-Ready: Create and edit stories from any device.

Powerful Image Editor

  • Professional Tools: Crop, rotate, flip, and resize.

  • Text Overlay: Add text with custom fonts, colors, and styles.

  • Drawing Tools: Free draw, shapes, and lines.

  • Filters & Effects: 20+ effects (vintage, blur, sharpen, etc.).

  • Stickers & Icons: Built-in icon library.

  • Color Adjustments: Brightness, contrast, saturation controls.

Display Options

  • Multiple Layouts: Circle, square, or list view.

  • Customizable Appearance: Colors, sizes, spacing.

  • Responsive Design: Looks great on all devices.

  • Animation Effects: Smooth transitions and hover effects.

  • Dark Mode Support: Automatically adapts to site theme.

Advanced Features

  • Auto-Expiry: Set stories to expire after 24 hours or never.

  • Privacy Controls: Public, friends-only, or private.

  • View Tracking: See who viewed your stories.

  • Notifications: Beautiful success/error popups.

  • Keyboard Shortcuts: Navigate stories with arrow keys.

  • Touch Gestures: Swipe, pinch-to-zoom, double-tap on mobile.

New in Version 2.0

  • ✨ Mobile-first redesign for touch screens.

  • 🎯 Fixed all image editor bugs.

  • 🚀 Improved performance & faster loading.

  • 💫 New notification system with animations.

  • 🎮 Enhanced story viewer with keyboard + touch controls.

  • 🌐 Better integration with BuddyPress, PeepSo, and BuddyBoss.

Requirements

  • WordPress: 4.6 or higher

  • PHP: 7.2 or higher

  • MySQL: 5.6 or higher

  • Browser: Chrome 90+, Firefox 88+, Safari 14+, Edge 90+

Optional (for social features):

  • BuddyPress 5.0+

  • PeepSo 3.0+

  • BuddyBoss Platform 1.0+

Installation

From WordPress Admin

  1. Navigate to Plugins > Add New.

  2. Search for WP Stories.

  3. Click Install Now.

  4. Click Activate.

Manual Installation

  1. Download the plugin ZIP file.

  2. Go to Plugins > Add New > Upload Plugin.

  3. Choose the ZIP file → Install Now.

  4. Activate the plugin.

Via FTP

  1. Extract the ZIP file.

  2. Upload the wp-stories folder to /wp-content/plugins/.

  3. Activate via WordPress Admin > Plugins.

Getting Started

Quick Setup

  1. Activate the Plugin

    • Go to Plugins → Installed Plugins → WP Stories → Activate.

  2. Configure Basic Settings

    • Navigate to WP Stories → Settings.

    • Set story duration (default 24 hours).

    • Choose layout (circle, square, list).

    • Configure default privacy.

  1. Create Your First Story

    • Click Add Story.

    • Upload images/videos.

    • Enhance with editor tools.

    • Add text, filters, stickers.

    • Click Publish.

  1. Add Stories to Your Site

    • Use shortcode [wp-stories] in a post/page.

    • Add WP Stories Widget to sidebar/footer.

    • If BuddyPress/PeepSo/BuddyBoss is active, stories appear in feeds.

Usage Guide

For Site Admins

Backend Story Creation

  1. Go to WP Stories → Add New.

  2. Upload media.

  3. Add title & description.

  4. Choose visibility.

  5. Click Publish.

Bulk Import

  • Prepare media files in a folder.

  • Use bulk upload feature.

  • Stories auto-created.

For Users (Frontend)

  1. Click Add Story button.

  2. Upload/capture media.

  3. Edit with visual editor.

  4. Add captions/links.

  5. Share.

Using the Image Editor

Basic Editing: Crop, rotate, flip, resize.
Enhancements: Filters, brightness, contrast, saturation.
Creative Tools: Text, freehand drawing, stickers, frames.
Mobile Optimized: Swipe, pinch, double-tap editing.

WP Stories – Heart/Like Feature

The Heart/Like feature allows users to express appreciation for stories through a heart icon interaction, similar to Instagram and other social platforms. This feature is fully integrated with BuddyPress and PeepSo.

User Features

1. Liking Stories

  • Location: Heart icon appears in story lightbox viewer and profile story tabs
  • Interaction: Click the heart icon to like/unlike a story
  • Visual Feedback:
    • Unliked: Gray outline heart
    • Liked: Red filled heart with background
    • Animation on click for smooth transition
  • Permissions: Must be logged in to like stories

2. Like Counter

  • Displays total number of likes on each story
  • Updates in real-time via AJAX without page reload
  • Shows in both story modal and profile viewer tabs

3. Viewer List Integration

  • Heart indicator shows next to each viewer’s name
  • Red heart = viewer liked the story
  • Gray outline heart = viewer has not liked the story
  • Icons display inline with message button for clean layout

Viewing Stories

Desktop

  • Click story → Start viewing.

  • Arrow keys = navigate.

  • Space = pause/play.

  • M = mute/unmute.

  • F = fullscreen.

  • Esc = exit.

Mobile

  • Tap story to view.

  • Swipe left/right to navigate.

  • Double-tap = like.

  • Swipe up = details.

  • Swipe down = close.

  • Hold = pause.

Integrations

BuddyPress

  • Stories appear in activity feeds.

  • User profile story tab.

  • Friend-only story sharing.

  • Auto activity integration.

PeepSo

  • Profile integration.

  • Privacy synced with PeepSo settings.

  • Social stream support.

BuddyBoss

  • Stories in newsfeeds.

  • Member stories widget.

  • Full Boss theme styling.

  • Group stories support.

Shortcodes

  • Basic: [wp-stories]

  • Custom Parameters:

    [wp-stories style="circle" limit="10" columns="5"]

  • User Stories: [wp-stories-user id="123"]

  • Story Box: [wp-stories-box id="1"]

Widgets

  1. Stories Feed – recent stories.

  2. User Stories – logged-in user’s stories.

  3. Single Story – highlight a featured story.

Configuration

General Settings

  • Story duration.

  • Privacy defaults.

  • Permissions (which roles can post).

  • Upload limits.

  • Moderation (admin approval).

Display Options

  • Layout style (circle, square, list).

  • Items per row.

  • Circle size & border style.

  • Hover animations.

Style Customization

  • Colors (primary, border, background).

  • Typography (fonts, sizes, weights).

  • Spacing & padding.

User Publishing Options

  • Allowed roles.

  • Auto-approve toggle.

  • Edit/delete permissions.

Advanced Usage

Custom Styling (CSS Example)

/* Custom story circle style */
.story-circle {
border: 3px solid #ff00ff;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}/* Hover effect */ .story-circle:hover { transform: scale(1.1); transition: transform 0.3s ease; }/* Mobile adjustments */ @media (max-width: 768px) { .story-circle { width: 60px !important; height: 60px !important; } }

Template Overrides

Copy templates from:
/wp-stories/templates/ → /your-theme/wp-stories/

Available:

  • single-story.php

  • archive-stories.php

  • story-circle.php

  • story-viewer.php

FAQs

General

Q: Can guests create stories?
A: No, only logged-in users.

Q: Do stories disappear after 24 hours?
A: Yes, unless you change the expiry.

Q: Supported formats?
A: JPG, PNG, GIF, WebP, MP4, MOV, WebM.

Q: Can I moderate?
A: Yes, via moderation settings.

Technical

  • Works with Elementor, Gutenberg, Divi.

  • Compatible with caching plugins.

  • GDPR compliant.

Troubleshooting

  • Stories not showing? Ensure shortcode is placed.

  • Editor not loading? Clear cache, check JS enabled.

  • Upload errors? Increase PHP upload limits.

Support

Last updated: October 3, 2025