Getting Started

Learn the basics of MagicWP and configure your first module in just a few minutes. This guide will walk you through the essential features and help you get the most out of MagicWP.

1 Access the MagicWP Dashboard

After installing and activating MagicWP, you'll find the plugin dashboard in your WordPress admin area:

  1. Log in to your WordPress Admin Dashboard
  2. Look for "MagicWP Hub" in the left sidebar menu
  3. Click on it to open the MagicWP dashboard
First Time Setup
After activating MagicWP for the first time, you'll be automatically redirected to the dashboard. If not, simply find "MagicWP Hub" in the WordPress admin menu.

The MagicWP dashboard is built with React and provides a modern, intuitive interface for managing all your modules.

2 Understanding the Dashboard

The MagicWP dashboard is organized into four main sections accessible from the top navigation:

🏠
Dashboard
View all available modules, enable/disable them, and access quick settings
⚙️
Module Settings
Configure individual module settings with live previews
💡
Community
Suggest new features and see what others are requesting
🆘
Support
Access documentation, FAQs, and get help from the community

3 Enable Your First Module

Let's start by enabling a simple module. We'll use "Magic Back to Top" as an example:

Step 1: Find the Module
  1. On the Dashboard page, you'll see all 20+ available modules
  2. Scroll down to find the "Magic Back to Top" module card
  3. Each module card shows:
    • Module name and description
    • Current status (Enabled/Disabled)
    • Toggle switch to enable/disable
    • Settings button (gear icon)
Step 2: Enable the Module
  1. Find the toggle switch on the "Magic Back to Top" card
  2. Click the toggle to turn it on (it will turn blue)
  3. The module is now active on your website!
Step 3: Test the Module
  1. Open your website in a new tab
  2. Scroll down on any page
  3. You should see a "Back to Top" button appear in the bottom-right corner
  4. Click it to smoothly scroll back to the top
Congratulations!
You've successfully enabled your first MagicWP module! It's that simple. All modules follow this same easy pattern.

4 Configure Module Settings

Most modules come with customizable settings. Let's customize the "Magic Back to Top" button:

Access Module Settings
  1. On the Dashboard, find the "Magic Back to Top" module card
  2. Click the gear icon (⚙️) on the module card
  3. You'll be taken to the Module Settings page for that specific module
Customize Settings

The settings page shows all available options for the module. Common settings include:

  • Position: Choose where the button appears (bottom-right, bottom-left, etc.)
  • Colors: Customize button background and icon colors
  • Size: Adjust button size
  • Animation: Enable/disable animations
  • Scroll Offset: Set when the button appears (pixels scrolled)
Save Changes
  1. Make your desired changes to the settings
  2. Click the "Save Changes" button at the bottom
  3. You'll see a success message confirming your settings were saved
  4. Visit your website to see the changes in action
Live Preview
Some modules like "Magic Search" include a live preview in the settings page, so you can see your changes before saving!

5 Explore Popular Modules

Now that you know the basics, here are some popular modules to try next:

🎯 Magic Floating Icons

What it does: Adds floating social media buttons to your site

Perfect for: Increasing social engagement and followers

Quick setup: Enable, add your social media URLs, customize colors and position

🔍 Magic Search

What it does: Beautiful search overlay with live results and keyboard shortcuts

Perfect for: Blogs, documentation sites, content-heavy websites

Quick setup: Enable and press Ctrl+K (or Cmd+K on Mac) to test

📊 Magic Scroll Progress

What it does: Shows a reading progress bar at the top of pages

Perfect for: Blog posts, articles, long-form content

Quick setup: Enable, choose color and position, done!

🍪 Magic Cookie Consent

What it does: GDPR/CCPA compliant cookie consent banner

Perfect for: All websites (required by law in many regions)

Quick setup: Enable, customize text and colors, add privacy policy link

Tip
Check out the complete Module Guide for detailed documentation on all 20+ modules.

6 Best Practices

Follow these best practices to get the most out of MagicWP:

✅ Start Simple

  • Enable only the modules you actually need
  • Start with 2-3 modules and add more gradually
  • Too many features can overwhelm visitors

✅ Test on Different Devices

  • Check how modules look on mobile, tablet, and desktop
  • All modules are responsive, but positioning may need adjustment
  • Use browser dev tools or real devices for testing

✅ Maintain Consistent Branding

  • Use colors that match your website theme
  • Keep button styles and positions consistent
  • MagicWP modules are designed to blend with your design

✅ Monitor Performance

  • MagicWP is optimized for performance
  • Only enabled modules load assets (CSS/JS)
  • Use tools like GTmetrix or PageSpeed Insights to monitor

✅ Keep Updated

  • Check for updates regularly in WordPress → Updates
  • Updates include new features, bug fixes, and security improvements
  • Backup your site before major updates (best practice for all plugins)

7 Quick Tips & Shortcuts

  • Enable/Disable Multiple Modules: Use the toggles on the Dashboard to quickly enable/disable modules without entering settings
  • Reset to Defaults: Each module settings page has a "Reset to Defaults" button to restore original settings
  • Search Shortcut: If Magic Search is enabled, press Ctrl+K (Windows/Linux) or Cmd+K (Mac) to open search
  • Diagnostic Tool: Go to MagicWP → 🔧 Diagnostic to troubleshoot issues and view system info
  • Suggest Features: Visit the Community tab to suggest new modules or features

8 Next Steps

You're now familiar with the basics of MagicWP! Here's what to explore next:

  1. Read the Module Guide: Learn about all 20+ modules and their specific features
  2. Explore Customization: Discover advanced customization options and developer hooks
  3. Join the Community: Connect with other MagicWP users and get support
  4. Share Feedback: Help us improve by suggesting features or reporting bugs
Need Help?
If you run into any issues or have questions:
← Previous
Installation Guide
Next →
Module Guide