Documentation

StoryPress - Interactive Instagram Styled Stories For WordPress

Thank you so much for purchasing our item from codecanyon.

If you have any questions that are beyond the scope of this help file, Please feel free to email via Item Support Page.

Installation

Follow the simple steps below to download, install, and activate the StoryPress plugin on your WordPress website.

Step 1: Download the Plugin

After purchasing StoryPress, you can download the plugin files from your CodeCanyon/Envato Market account:

  1. Log in to your CodeCanyon / Envato Market account.
  2. Navigate to your Downloads page.
  3. Locate StoryPress, click the Download button, and choose "Installable WordPress file only" (this downloads the storypress.zip file).

Step 2: Install the Plugin

You can install the plugin using either of the two standard methods below:

Method A: Via WordPress Dashboard (Recommended)
  1. Log in to your WordPress admin dashboard (e.g., yourdomain.com/wp-admin).
  2. Go to Plugins > Add New Plugin.
  3. Click the Upload Plugin button at the top of the page.
  4. Click Choose File and select the storypress.zip file you downloaded in Step 1.
  5. Click Install Now.
  6. Once the installation is complete, click the Activate Plugin button.
Method B: Via FTP (Alternative)
  1. Unzip the downloaded storypress.zip file on your computer. This will extract a folder named storypress.
  2. Connect to your server using an FTP client (such as FileZilla).
  3. Navigate to the /wp-content/plugins/ directory of your WordPress site.
  4. Upload the unzipped storypress folder to this directory.
  5. Log in to your WordPress admin dashboard, navigate to Plugins > Installed Plugins, locate StoryPress, and click Activate.

Updating the Plugin

Keeping your StoryPress plugin up to date ensures compatibility with the latest WordPress versions, better security, and access to new features. You can update the plugin using either the automatic method or the manual method.

Method 1: Automatic Updates via Envato Market Plugin (Recommended)

To receive automatic update notifications and update StoryPress with a single click directly from your WordPress dashboard, we highly recommend using the official Envato Market plugin:

  1. Download the free Envato Market WordPress Plugin.
  2. Install and activate it on your WordPress website (go to Plugins > Add New > Upload Plugin).
  3. Once activated, click the new Envato Market menu item in your WordPress dashboard sidebar.
  4. Follow the on-screen instructions to generate an Envato API Personal Token and save it in the settings.
  5. Once connected, all your purchases will be synced. When a new version of StoryPress is released, you will see an update notification under Dashboard > Updates or on the Plugins page. Simply click "Update Now".

Method 2: Manual Update

If you prefer to update the plugin manually, you can easily do so by uploading the latest version over the existing installation:

  1. Log in to your CodeCanyon / Envato Market account and go to the Downloads page.
  2. Download the latest "Installable WordPress file only" for StoryPress.
  3. Log in to your WordPress dashboard and navigate to Plugins > Add New Plugin.
  4. Click Upload Plugin and choose the newly downloaded ZIP file.
  5. Click Install Now.
  6. WordPress will detect that the plugin is already installed and show a comparison screen. Click the "Replace current with uploaded" button.

Note: Manual updates will not overwrite your created stories, collections, or settings as they are safely stored in your WordPress database.

General Story Guides

StoryPress is designed to offer mobile-first, highly engaging Instagram-style stories right on your WordPress website. This section introduces the concept of stories, the format options, and how the user experience is built to keep visitors engaged.

Admin Stories

Admin Stories are highly curated, permanent or seasonal stories created directly by the website administrator from the WordPress backend.

Purpose & Use Cases

Use Admin Stories to highlight important company announcements, feature updates, special promotions, curated tutorials, testimonials, or permanent documentation sections. They give you complete editorial control over what content is pinned directly to the spotlight on your site.

How it Works

  • Native CPT: Admin stories are managed using WordPress custom post types (CPTs), giving you a familiar dashboard interface.
  • Organized in Collections: To display admin stories on the frontend, you group them into "Collections". Each collection represents a single cover item (card/avatar) in the slider. When a user clicks a collection, all stories assigned to it play sequentially.

User Stories

User Stories allow users to submit their own stories directly from the frontend of your site.

Purpose & Use Cases

Perfect for social communities, membership platforms, forum sites, and BuddyPress integrations. Giving users the power to share their daily moments keeps your site dynamic, fresh, and significantly increases community engagement and return rates.

Key Features

  • Frontend Upload Modal: A secure, beautiful frontend interface where users can upload image/video stories or write custom text stories without ever seeing the WordPress dashboard.
  • Story Expiration: Keep content fresh with automatic story expiry! Stories can be set to automatically disappear after a specific time (e.g., 24 hours). An optimized background script cleans up the attachments automatically to save server space.
  • Seen/Unseen Tracking: Remembers which stories a user has already watched, showing a colored ring around unviewed stories and graying out seen ones, mimicking premium social platforms.
  • Privacy Levels: Supports BuddyPress privacy levels (Public, Friends Only, or Private), allowing users to fully control who can view their updates.

Blog Stories

Blog Stories dynamically and automatically turn your standard WordPress blog posts into gorgeous interactive stories.

Purpose & Use Cases

Re-engage visitors with your existing blog content! Instead of forcing users to scroll through boring text-based archive pages, present your latest articles in a beautiful, mobile-friendly story format that boosts click-through-rates and post visits.

Key Features

  • Automated Generation: StoryPress automatically queries your latest posts, pulling their featured images and titles to display them in the slider.
  • Group by Category: Creates one collection card/avatar for each selected blog category. Clicking a category plays the latest posts inside it sequentially.
  • Group by Author: Creates one collection card/avatar for each blog author. Clicking an author plays the latest posts written by them.
  • Custom Category Cover Images: Admin can upload a dedicated cover image for any blog category to be used as the collection cover thumbnail in the frontend slider.

Product Stories

Product Stories automatically convert your WooCommerce store items into interactive story slides.

Purpose & Use Cases

Maximize your e-commerce conversion rates! Showcase your catalog dynamically in a story format, helping customers browse bestsellers, look through on-sale products, and check featured items in a mobile-first UI with a fast checkout CTA.

Key Features

  • Automated Synchronization: Automatically pulls WooCommerce product images, titles, and price ranges to generate attractive product story slides.
  • Advanced Product Filtering: Choose which products to spotlight using pre-built filters including Recent Products, Featured Products, Bestsellers, Top-Rated Products, or items currently On Sale.
  • Dynamic CTA links: Automatically appends direct "Shop Now" links to each product story slide to drive immediate add-to-cart conversions.

Admin Menus

StoryPress integrates seamlessly with the WordPress dashboard. The main administration is divided into three key menus: Stories List, Collections List, and Settings.

Stories List

The Stories List menu serves as the central hub for managing all individual story slides. It provides a familiar, clean WordPress list table format optimized for digital media.

Creating & Managing Stories

  1. Navigate to StoryPress > Stories in your WordPress admin sidebar.
  2. Here you can view all story items created on your website (both administrator-created stories and frontend user-submitted stories).
  3. The list table provides valuable columns:
    • Title: The name of the story.
    • Media Type: Visual indicator showing whether the story is an Image, Video, or Text story.
    • Author: The WordPress user who created the story.
    • Date: The exact date and time the story was published.
  4. Hover over any story item to access action links: Edit, Trash, or Quick Edit.

Story Details Metabox

When you create a new story slide or edit an existing one under StoryPress > Add New Story, you will use the custom Story Details metabox. This metabox dynamically updates based on your selections:

  • Story Context: Determines the context and ownership of the story. Choose Collection (Admin) for standard admin stories, User Story for user-submitted content, or Auto-generated for post or product sync.
  • Story Type: Choose the format of your story: Text, Image, or Video. Selecting a type dynamically reveals or hides the corresponding media fields below.
  • Description: A short text overlay, caption, or description displayed over the story slide in the player (limited to the maximum character length configured in settings).
  • Background Color: (Only shown when Type is Text) Select a solid or gradient backdrop color for text-only story slides.
  • Story Image: (Only shown when Type is Image) Upload or choose a graphic slide from the WordPress Media Library.
  • Story Video: (Only shown when Type is Video) Upload or select a video slide (MP4 or MOV).
  • Video Poster Image: (Only shown when Type is Video) Select an image to serve as the video thumbnail before it starts autoplaying.
  • Link URL: Add an optional external or internal web address to attach a Call-to-Action (CTA) link button overlaying the slide.

Collections List

The Collections List page is where you manage your stories' groupings. In StoryPress, collections represent the actual clickable bubbles or cards that display on your frontend pages.

How Collections Work

  • Groupings: A collection represents a group of story slides. Think of it like a folder.
  • Frontend Display: When a user visits your frontend and clicks a Collection Cover (either an avatar bubble or card), the fullscreen story player opens and plays all stories assigned to that specific collection sequentially.
  • Cover Images: You can assign a custom cover thumbnail image directly to each collection. If no cover image is uploaded, StoryPress will automatically fall back to using the thumbnail of the first story slide in that collection.

Creating & Managing Collections

  1. Navigate to StoryPress > Collections in your WordPress admin sidebar.
  2. On the left side, you can quickly create a new collection by filling out the Name, Slug, and uploading a Collection Cover Image.
  3. On the right side, you can view the active collections table, edit existing ones, or see how many stories are currently assigned to each collection.

Collection Metabox Fields

When you edit or add a collection, you will configure two essential custom metaboxes:

  • Collection Stories: Select which story slides are grouped into this collection. The field supports repeatability, allowing you to click + Add Another Story to add multiple slides and drag-and-drop the rows to arrange the exact playback sequence.
  • Collection Settings (Sidebar):
    • Status: Set to Active to show the collection in frontend sliders, or Inactive to hide it.
    • Display Order: A numeric value that dictates the sorting order of the collection bubble/card in the carousel (lower numbers display first).

Plugin Settings

The Settings page is powered by a robust options panel, allowing you to fine-tune story logic, frontend styling, seen/unseen tracking, and all general features.

Accessing the Settings Panel

Go to StoryPress > Settings in your WordPress dashboard. The settings are neatly structured into key tabs:

Control the core mechanics of StoryPress:

  • Global Upload Settings:
    • Story Duration: Set the default duration (in milliseconds, e.g., 5000ms = 5 seconds) for each slide in the story player.
    • Max File Size (MB): Set the global limit for uploaded story media files (between 1MB and 100MB).
  • Style Settings:
    • Primary Color: Select the primary brand color for StoryPress buttons, progress indicators, and active accents.

Customize the display options for admin-curated story collections:

  • Story Cards Per Load: Control how many collection covers are initially loaded in the frontend slider grid/carousel.
  • Slider Layout: Choose between circular Avatar Layout (Instagram bubble style) or rectangular Card Layout (Facebook story style).
  • Slides Per View: Specify how many story slides are visible at once in the carousel (separately configurable for Card and Avatar layouts).
  • Slide Gap (px): Define the spacing (in pixels) between slides for both layout variations.
  • Content Constraints: Set a strict maximum character limit for story Titles and Descriptions to ensure clean layouts.

Manage user-generated content submitted from the frontend of your site:

  • Enable User Stories: Global toggle to enable or disable user submissions.
  • BuddyPress Integration: Toggle showing user stories on the BuddyPress main activity page directory.
  • View Restrictions: Toggle requiring visitors to log in before viewing any user stories.
  • Slider Presentation: Choose Slider Layout (Card or Avatar), specify Slides Per View, and adjust Slide Gap spacing.
  • Content Constraints: Set allowed media formats (Text, Image, and/or Video) and enforce maximum character limits for frontend titles and descriptions.
  • Expiry and Privacy:
    • Enable Privacy Settings: Allow users to choose who sees their stories (Public, Friends Only, or Only Me).
    • Enable Story Expiry: Automatically hide and cleanup stories after a set number of hours (e.g., 24 hours).

Configure automated dynamic feeds generated from your site's blog posts:

  • Story Source: Choose whether to group dynamic blog stories by WordPress Categories or Authors.
  • Stories Per Card: Set the maximum number of recent articles queried per category or author.
  • Slider Presentation: Set Layout type (Card or Avatar), Slides Per View, and Slide Gap spacing.
  • Content Constraints: Enforce custom character limits for the dynamically pulled post titles and excerpt captions.

Fine-tune automated storefront galleries pulled from WooCommerce products:

  • Product Categories Per Load: Define how many product categories or filter categories load in the slider.
  • Stories Per Card: Set the maximum number of items queried per product category slide.
  • Slider Presentation: Set Layout type (Card or Avatar), Slides Per View, and Slide Gap spacing.

Display Stories

StoryPress makes it incredibly easy to showcase your interactive stories anywhere on your WordPress site. Whether you prefer using a universal WordPress shortcode or designing a custom landing page inside Elementor, we have you covered.

Universal Shortcode

The universal shortcode [storypress] is the easiest and most flexible way to display your stories on any page, post, widget, or template. By default, typing [storypress] will load your admin-curated story collections using your default settings, but you can fully customize the display using a rich set of optional attributes.

Supported Shortcode Attributes

Attribute Default Allowed Values Description
context collections collections, user, blog, product Determines the source type of stories to fetch and display in the slider.
layout From Settings card, avatar Overrides the global slider design. Use card for Facebook-style rectangular cards or avatar for Instagram-style circular bubbles.
limit From Settings Positive Integer Limits the total number of collection/story covers loaded in the initial viewport.
slides_per_view From Settings Positive Integer Specifies how many story cover cards/avatars are visible at once in the carousel.
slide_gap From Settings Integer (pixels) Defines the spacing in pixels between each story cover in the slider.
source From Settings category, author (Only for context="blog") Sets whether blog stories should be grouped by post category or post author.
product_filter From Settings recent, featured, best_selling, top_rated, sale (Only for context="product") Selects which WooCommerce products to dynamically fetch.
user_id 0 User ID (integer) (Only for context="user") Filters user stories to only show those submitted by a specific WordPress user ID.

Copy-Paste Shortcode Examples

Use these pre-built shortcodes to quickly display specific story feeds on your website:

1. Admin Story Collections Slider

Display your hand-crafted administrator story collections in a beautiful circular avatar slider showing 8 bubbles at once with a 15px gap:

[storypress context="collections" layout="avatar" slides_per_view="8" slide_gap="15"]
2. User-Submitted Stories

Display frontend user-submitted stories in a Facebook-style card grid, limiting the load to the 10 most recent users:

[storypress context="user" layout="card" limit="10"]
3. Automated Blog Feed Carousel

Generate story bubbles dynamically from your blog's categories, displaying up to 6 slides per view:

[storypress context="blog" source="category" layout="avatar" slides_per_view="6"]
4. WooCommerce "On Sale" Product Stories

Increase conversions by showing currently discounted products as rectangular story cards in a swipeable widget:

[storypress context="product" product_filter="sale" layout="card"]

Elementor Integration

StoryPress is 100% compatible with the Elementor Page Builder. While you can construct complex multi-column grids or landing pages using Elementor, you can easily embed your interactive stories inside any Elementor layout without writing a single line of code.

Embedding Stories in Elementor Pages

  1. Open your desired page or landing page template in the Elementor Editor.
  2. In the left-hand Elementor widget search panel, search for the native Shortcode widget.
  3. Drag the Shortcode widget and drop it into any section, column, or container where you want the stories to display.
  4. In the widget content options panel, paste your custom [storypress] shortcode (with your chosen parameters, e.g. [storypress context="collections" layout="avatar"]) into the textarea.
  5. Click the Elementor Update button at the bottom of the editor.
  6. Preview the live page to see your interactive story circles or cards load instantly with smooth swipe gestures and hardware-accelerated tap actions!

Pro Tip: You can place the shortcode inside Elementor's Accordions, Tabs, Popups, Header/Footer builders, or Sidebar templates to offer a premium, unified story experience across your entire layout.

Translation & Localization

StoryPress is fully translation-ready and optimized for localization. Every single string visible on both the backend options panel and frontend story player is properly wrapped in WordPress localization hooks, using the standard text-domain 'storypress'.

Loco Translate Integration

The easiest and most recommended way to translate StoryPress into your website's native language is by using the popular, free Loco Translate WordPress plugin.

Step-by-Step Translation Guide

  1. Go to Plugins > Add New in your WordPress dashboard, search for Loco Translate, install, and activate it.
  2. Navigate to Loco Translate > Plugins in your sidebar menu.
  3. Click on StoryPress in your plugins list.
  4. Click the New Language button.
  5. Choose your website's active language from the dropdown menu (e.g., French, Spanish, German).
  6. Choose a Location: Select the System location (e.g., languages/plugins/storypress-es_ES.po) to ensure your custom translations are never overwritten during future plugin updates.
  7. Click the Start Translating button.
  8. A list of all translatable strings in StoryPress will load. Select any string (such as "See More", "Add Story", "Seen") and type your translation in the translation box at the bottom.
  9. Click the Save button at the top of the Loco Translate dashboard.

Success: Loco Translate will automatically compile your translated strings into standard WordPress .po and .mo files. The frontend story player will instantly render your localized translations!

Customer Support

We are dedicated to providing the best possible customer support. If you run into issues or have questions that aren't addressed in this help manual, please reach out to us through our official support channels.

How to Request Support

You can contact our support team directly via our Envato CodeCanyon profile page:

Contact Support Team

Support Hours and Response Times

  • Response Window: Maximum 24-48 hours on business days (Monday to Friday).
  • Time Zone: GMT +5:30.
  • Weekend support: Ticket responses may take longer during weekends and official public holidays.

What Our Support Covers

  • Fixing verified bugs or functionality errors in the StoryPress plugin.
  • Basic installation help and dashboard onboarding assistance.
  • Clarifying questions regarding plugin settings and built-in features.
  • Addressing compatibility conflicts with standard WordPress themes.

What Our Support Excludes

Important Terms: Standard customer support does not include:

  • Custom code edits, styling modifications, or custom feature development.
  • Styling adjustments or integration requests for third-party, non-standard plugins.
  • Server-side configurations, database optimization, or web hosting setups.
  • General WordPress dashboard, page builder, or site administration training.

Other products

Check Our Other Products

BeBuddy
BeBuddy - Multipurpose Community & Membership WordPress Theme
Beehive
Beehive - Social Network WordPress Theme
Friend Finder
Friend Finder - Social Network HTML5 Template

Our Portfolio

Changelog

See what's new added, changed, fixed, improved or updated in the latest versions.

Version 1.0

Initial Release