1. Introduction

VideoHub360 is a complete video management and livestreaming solution for WordPress. It provides:

• A custom post type for videos
• Flexible grid and list layouts
• Elementor widgets for videos and hero sections
• Hero banner layouts for featured content
• Built-in live chat for livestream events
• Video quality presets and configuration
• A shortcode builder for non-technical users
• An analytics-focused admin dashboard

No coding is required. VideoHub360 is designed to work with modern themes and page builders.

2. Requirements

WordPress Requirements

• WordPress 5.8 or higher
• PHP 7.4 or higher (recommended: 8.0+)
• MySQL 5.6+ or MariaDB 10.1+
• A modern WordPress theme (Astra, Hello Elementor, Kadence, etc.)

Optional (for full feature set)

• Elementor — required for the Elementor widgets
• An Agora.io account — required for livestreaming integration

3. Installation

VideoHub360 installs like any other WordPress plugin.

Method A: Install via WordPress Admin (Recommended)

1. Log into your WordPress admin dashboard.
2. Navigate to Plugins → Add New → Upload Plugin.
3. Click Choose File and select videohub360.zip.
4. Click Install Now.
5. After the installation finishes, click Activate Plugin.

Method B: Install via FTP

1. Unzip videohub360.zip on your computer.
2. Using an FTP client, upload the videohub360 folder to /wp-content/plugins/.
3. In WordPress admin, go to Plugins.
4. Find VideoHub360 and click Activate.

4. Initial Setup

4.1 Set Permalinks

1. Go to Settings → Permalinks.
2. Without changing anything, click Save Changes.

This flushes WordPress rewrite rules and ensures VideoHub360 URLs work correctly.

4.2 Locate the VideoHub360 Menu

After activation, you will see a new menu in the WordPress sidebar:

VideoHub360

From here you can access:

• Dashboard
• All Videos
• Add New Video
• Categories
• Series
• Locations
• Settings
• Shortcodes
• Documentation

5. Creating Your First Video

1. Go to VideoHub360 → Add New Video.
2. Enter a title and description.
3. Set a Featured Image for the video.
4. In the Video settings panel, choose your Video Source:
   • Direct MP4 URL
   • YouTube URL
   • Vimeo URL
   • HLS (.m3u8) stream
   • Livestream channel/key (Agora)
5. Optionally assign:
   • Categories (VideoHub360 category taxonomy)
   • Series
   • Locations
6. Click Publish.

Your video will be available at a URL similar to:

https://yourwebsite.com/videohub360/video-title/

6. Displaying Videos on Pages

VideoHub360 provides both shortcodes and Elementor widgets.

6.1 Shortcode: Video Grid/List

Basic shortcode:

[videohub360_videos]

Supported attributes:

Example:

[videohub360_videos display="grid" posts="12" category="tutorials" columns="3"]

6.2 Shortcode: Hero Section

The hero shortcode displays a large hero banner for highlighted videos:

[videohub360_hero]

6.3 Elementor Widgets

VideoHub360 includes two Elementor widgets:

• VideoHub360 – Video List / Grid
• VideoHub360 – Hero Banner

1. Open a page with Elementor.
2. Search for “VideoHub360”.
3. Drag the widget onto your page.
4. Configure filters, layout, columns, and hero options.
5. Click Update to save.

7. Livestreaming Setup (Agora)

7.1 Create an Agora Account

1. Visit https://www.agora.io.
2. Create an account and log into the Agora console.
3. Create a project and copy your App ID and App Certificate.

7.2 Configure VideoHub360 Livestream Settings

1. In WordPress, go to VideoHub360 → Settings → Livestream.
2. Enter your Agora App ID and App Certificate.
3. Configure default channel or token options as needed.
4. Save changes.

7.3 Mark a Video as Live

1. Edit a VideoHub360 video post.
2. Enable the option “This video is a livestream”.
3. Enter the channel name / stream key that matches your Agora setup.
4. Update the post.

On the front end, a LIVE badge appears and the live chat is enabled.

8. Live Chat System

VideoHub360 includes a real-time chat system for your livestreams.

8.1 Features

• Guest or logged-in user chat (configurable)
• Server-side validation and message length limits
• Rate limiting to reduce spam
• Moderation actions like kick and ban

8.2 Configuration

1. Go to VideoHub360 → Settings → Chat.
2. Enable or disable chat, configure guest access, message length, and rate limits.
3. Save your settings.

9. Shortcode Builder

The shortcode builder helps you generate shortcodes without typing attributes manually.

1. Go to VideoHub360 → Shortcodes.
2. Choose filters: category, series, location, display type, columns, etc.
3. Copy the generated shortcode.
4. Paste it into any page or post.

10. Admin Dashboard

The VideoHub360 Dashboard gives you an overview of your video library:

• Video views and top-performing videos
• Live viewer statistics (where applicable)
• Chat activity and engagement
• System and status information

11. Customizing Templates

VideoHub360 ships with templates for single and archive video pages:

• single-videohub360.php
• archive-videohub360.php

Override Templates in Your Theme

1. Copy the template files from:
   /wp-content/plugins/videohub360/templates/
2. Paste them into:
   /wp-content/themes/your-theme/videohub360/
3. Edit the copied templates as needed.

WordPress will use your theme overrides instead of the default plugin templates.

12. Custom CSS

You can customize the appearance of VideoHub360 elements with CSS.

1. Go to Appearance → Customize → Additional CSS.
2. Add your CSS rules.
3. Click Publish.

Examples:

.videohub360-grid .videohub360-item {
  border-radius: 12px;
}

.videohub360-hero-title {
  color: #ffffff;
}

13. Troubleshooting

13.1 Videos Not Showing

• Make sure permalinks have been saved after activating the plugin.
• Verify that the video URL is valid and publicly accessible.
• If using HTTPS, ensure that all video URLs also use HTTPS.

13.2 Elementor Widgets Missing

• Confirm that Elementor is installed and activated.
• Regenerate Elementor CSS in Elementor → Tools.
• Ensure the page you’re editing supports Elementor.

13.3 Livestream Not Working

• Double-check your Agora App ID and App Certificate.
• Confirm the channel name/stream key matches your streaming configuration.
• Check for firewall or hosting restrictions that may block the stream.

13.4 Chat Not Working

• Verify that chat is enabled in Settings → Chat.
• Ensure the video is marked as a livestream.
• Look in the browser console for JavaScript errors from other plugins or themes.

14. Asset Credits

VideoHub360 uses a small set of third-party libraries. All are open-source and licensed for commercial use and redistribution.

15. Support Policy

Support Includes

• Installation and basic configuration assistance
• Bug fixes and issue investigation
• Help understanding existing features
• Regular plugin updates

Support Does Not Include

• Custom feature development
• Complex theme or layout customization
• Server or hosting configuration
• Integrations with third-party services not officially supported