Learn AdminFlow Pro

Replace the default WordPress login screen with your own branded design — custom logo, colors, background image, or even a video background.

1. 1

   Go to AdminFlow Pro → Branding & Style tab. This is the first tab that opens by default.

2. 2

   Login Logo: Click "Upload Logo" to add your brand logo. This replaces the WordPress logo on the login screen. You can also choose to disable the logo link so it is not clickable.

3. 3

   Background Image: Click "Upload Image" to set a custom background photo for your login page. It will be displayed as a full-cover background behind the login form.

4. 4

   Background Video: Want something more dynamic? Click "Upload Video" to set an MP4 video as your login page background. The video plays on loop, muted, and auto-starts — creating a cinematic login experience.

5. 5

   Background Color Presets: Choose from 40+ professionally curated color presets — solid colors and multi-color gradients (2, 3, 4, and even 5-color gradients). Click any swatch to apply it instantly. Or use the "Custom" color picker for a completely unique shade.

6. 6

   Button Color Presets: Customize the "Log In" button with 30+ solid and gradient color presets. Match it to your brand identity for a seamless look.

7. 7

   Login Links Color: Change the color of "Back to Blog" and "Register" links to match your chosen background. 20+ presets are available.

8. 8

   Hide Login Page Links: Toggle this on to completely remove "Back to blog" and "Register" links — useful for client-facing websites where you want a clean login form.

9. 9

   Live Preview: At the bottom of this tab, you will see a live preview of your login page inside a Mac-style browser mockup. It updates as you change settings (click the green dot to refresh). You can also open it in a new tab.

10. 10

    Reset Defaults: Click the "Reset Defaults" button at the top-right of this section to restore all login styling to factory defaults.

AdminFlow Pro replaces the default WordPress sidebar menu with a clean, horizontal top navigation bar — just like premium SaaS platforms.

1. 1

   Once you toggle Modern Dashboard to ON, the default WordPress sidebar instantly disappears. In its place, a horizontal navigation bar appears at the very top of your admin area.

2. 2

   Logo & Site Name: Your site logo and name appear on the left side of the navigation. These are pulled from your WordPress site icon by default, or you can upload a custom navigation logo in the Menu Builder.

3. 3

   Core Menu Items: Dashboard, Pages, Posts, Media, and Users are displayed as top-level items with clean SVG icons. Each item expands into a dropdown submenu on hover, showing all its sub-pages.

4. 4

   WooCommerce Integration: If WooCommerce is active, "Products" and "Orders" items are automatically added to the navigation bar with their own custom icons — no configuration needed.

5. 5

   Smart Grouping: Admin items (Appearance, Plugins, Settings, Tools) are grouped under a "Manage" dropdown. Third-party plugin menus are grouped under "Other." This keeps the navigation bar clean and organized.

6. 6

   Right-Side Actions: The right side of the bar shows a notification bell, your user avatar and name, a screen options trigger, a gear icon for quick settings access, and a logout button.

7. 7

   Active State: The currently active page is highlighted in the navigation bar, so you always know where you are.

8. 8

   Mobile Responsive: On smaller screens, the navigation collapses into a hamburger menu button that toggles the full menu.

The Menu Builder gives you full control over the navigation bar — reorder items by dragging, rename them, and assign unique colors to each menu item.

1. 1

   Navigate to AdminFlow Pro → Customize tab, then scroll down to the Menu Builder section.

2. 2

   Drag to Reorder: Each menu item appears as a card. Grab the SVG icon and drag it left or right to reorder the items in the navigation bar. The order you set here is exactly the order that appears in the live navigation.

3. 3

   Rename Items: Click the gear icon (⚙️) on any menu item card to expand its settings panel. In the "Menu Name" field, type a new name. For example, rename "Posts" to "Blog" or "Media" to "Files."

4. 4

   Individual Menu Colors: Each item card has four color pickers: Normal Text Color, Normal Icon Color, Active Menu Color (background when selected), and Active Text Color. Each item starts with a unique default color (Dashboard = blue, Posts = green, Media = pink, etc.).

5. 5

   Site Name Card: The first card (dashed border) controls the site name displayed in the navigation. You can change the display name, its text color, and upload a custom icon/logo for the navigation bar.

6. 6

   Right-Side Elements: After the main menu items, you will see additional cards for the notification bell, user avatar, screen options icon, settings gear, and logout button. Click their gear icons to customize colors — bell color, badge background, avatar border, gear color, button background, and more.

7. 7

   How to Save: Click the green "Refresh" dot in the Live Preview section below the builder to see your changes. Then click Save Changes to keep them permanently.

Control which menu items each user role can see. Perfect for agencies managing client sites or multi-author blogs where certain users should not access everything.

1. 1

   Go to AdminFlow Pro → Menu tab.

2. 2

   You will see a two-panel interface. On the left, all controllable menu items are listed: Dashboard, Home, Updates, Posts, Media, Pages, Users, Manage, Other, Settings, Tools, and (if WooCommerce is active) Products and Orders.

3. 3

   Click any menu item on the left panel. The right panel will show the available user roles (Administrator, Editor, Author, Shop Manager, etc.).

4. 4

   Toggle the switch next to a role to hide that menu item from users with that role. For example, toggle "Editor" under "Plugins" to hide the Plugins menu from all Editors.

5. 5

   A blue badge appears on the sidebar item showing how many roles it is hidden from. This lets you quickly see which items have active visibility rules.

6. 6

   Hidden items disappear from both the horizontal top navigation bar and the standard WordPress sidebar menu (if the modern dashboard is disabled for that role).

White-label the entire WordPress admin area with your brand colors — change the dashboard background, header bar, menu colors, and more.

1. 1

   Go to AdminFlow Pro → Customize tab.

2. 2

   Dashboard Background: Change the canvas color behind all admin panels. Choose from 8 solid color presets (whites, slates, tints) or 20+ gradient presets. Use the color picker for a completely custom shade. This is the base background color of your entire admin area.

3. 3

   Header Background: Customize the top navigation bar background separately. Choose from 9 solid presets + 12 gradient presets, or use the color picker. Want a dark header with a light background? A gradient header? It is all possible.

4. 4

   Header Text & Icon Colors: Set the default color for menu text, icons, and the site name in the navigation bar. These can be further overridden per-item in the Menu Builder.

5. 5

   Active & Hover States: Define what happens when a user hovers over a menu item (hover background + hover text color) and when a menu item is currently active (active background + active text color).

6. 6

   Primary Color: Set in the System Status sidebar card. This primary brand color is used as the accent color throughout the settings page itself and as the CSS variable --wpae-primary.

7. 7

   Live Preview: Just like the Login Branding tab, a live iframe preview of your actual dashboard is shown at the bottom. Click the green dot to refresh it after making changes.

8. 8

   Reset Defaults: Click the "Reset Defaults" button at the top-right of this section to restore all theme customizations to factory defaults.

Choose which user roles see the modern AdminFlow Pro dashboard, and which roles continue to see the default WordPress admin.

1. 1

   Go to AdminFlow Pro → Permissions tab.

2. 2

   You will see a list of all user roles (Administrator, Editor, Author, Contributor, Shop Manager, etc.).

3. 3

   Toggle each role ON or OFF. Roles with the toggle ON will see the AdminFlow Pro modern dashboard. Roles with the toggle OFF will see the stock WordPress admin.

4. 4

   By default, Administrator, Editor, and Author have the modern dashboard enabled. Subscriber and Customer roles are excluded from the list entirely.

Replace Gravatar with a locally-hosted profile picture. Your photo will appear in the navigation bar, comments, and everywhere WordPress uses avatars.

1. 1

   Go to Users → Your Profile (or click your name/avatar in the AdminFlow Pro navigation bar).

2. 2

   Scroll down to the Profile Picture section added by AdminFlow Pro.

3. 3

   Click Upload Image. The WordPress Media Library will open. Select an existing image or upload a new one, then click "Use this image."

4. 4

   Your custom avatar now appears everywhere in WordPress — in the admin navigation bar, user lists, comments, and any plugin that uses WordPress avatars.

5. 5

   To remove it, click the Remove Image button. WordPress will fall back to the default Gravatar.

AdminFlow Pro includes powerful admin tools that let you control WordPress core features — all toggleable from a single settings page, no code needed.

1. 1

   Go to AdminFlow Pro → Advanced tab.

2. 2

   Disable Gutenberg Editor: Toggle this ON to switch all posts and pages back to the Classic Editor. This also reverts the Widgets screen to the classic widget interface. Perfect if you prefer the old editor or use a page builder like Elementor.

3. 3

   Disable XML-RPC: Toggle this ON to disable XML-RPC completely. XML-RPC is a legacy remote access protocol that is frequently targeted by brute-force attacks. Unless you specifically need it (some mobile apps or remote publishing tools use it), disabling it is a strong security measure.

4. 4

   Cleanup Admin Interface: Toggle this ON to remove unnecessary meta boxes from the Post and Page editors — including Author, Comments Status, Trackbacks, Revisions, and Excerpts. It also removes the Site Health widget from the Dashboard and the Site Health submenu from Tools. This gives you a cleaner, focused editing experience.

5. 5

   Hide Admin Toolbar on Frontend: Toggle this ON to hide the admin bar that appears at the top of your website when you are logged in. This is useful when you want to see your site exactly as visitors see it while previewing changes.

AdminFlow Pro replaces ugly WordPress admin success notices with elegant toast notifications that slide in from the top — and adds a notification bell to your navigation bar.

1. 1

   Toast Notifications: When you save settings, update a post, or perform any action that normally shows a green success notice, AdminFlow Pro intercepts it and displays a sleek animated toast notification instead. The toast appears with a smooth slide-in animation, a green checkmark icon, a progress bar, and auto-dismisses after a few seconds.

2. 2

   Notification Bell: The bell icon in the top-right of the navigation bar shows pending notifications. It includes a red badge counter when you have unread notifications. Click the bell to open a dropdown showing your notification list.

3. 3

   URL Cleanup: AdminFlow Pro also automatically cleans the URL after a settings save — removing the ?settings-updated=true parameter. This prevents duplicate notices if you refresh the page and keeps your URLs clean.

4. 4

   WooCommerce Coming Soon Badge: If WooCommerce is in Coming Soon mode, an orange bell icon appears in the navigation bar as a quick reminder. Clicking it takes you directly to the Site Visibility settings.

AdminFlow Pro is built to work alongside popular WordPress plugins. Special compatibility features ensure a smooth experience.

1. 1

   Elementor Smart Discovery: When you visit the Elementor Template Library inside WordPress, AdminFlow Pro automatically detects it and adjusts spacing so the AdminFlow navigation bar does not overlap Elementor headers and toolbars.

2. 2

   Block Editor (Gutenberg) Detection: AdminFlow Pro detects when you are editing a post or page with the Block Editor and avoids applying aggressive restyling that could interfere with the full-screen editing experience.

3. 3

   Elementor Notice Suppression: Toggle Hide Elementor AI Notices in the Advanced tab to suppress Elementor promotional AI buttons, toast messages, and admin notices. This keeps your admin area clean and focused.

4. 4

   WooCommerce: Products and Orders are automatically detected and added to the navigation bar. The "Coming Soon" badge and all WooCommerce-related admin pages work seamlessly with the horizontal navigation.

5. 5

   Third-Party Plugins: Any plugin that adds a menu item to WordPress will have its menu item automatically placed in the "Other" dropdown group, keeping your main navigation tidy.

AdminFlow Pro was designed with agencies and freelancers in mind. Completely transform the WordPress admin to look like your own custom platform.

1. 1

   Custom Site Name: In the Menu Builder, the first card lets you override the WordPress site name shown in the navigation bar. Change it to your agency name or your client business name.

2. 2

   Custom Navigation Logo: Upload a small logo or icon in the Menu Builder first card. This replaces the WordPress site icon in the navigation bar, reinforcing your brand.

3. 3

   Branded Login Page: Use the Branding & Style tab to upload your agency logo, set your brand colors, and add a background image or video. Your client will never see the WordPress logo again.

4. 4

   Custom Footer: On the AdminFlow Pro settings page, the footer displays "Designed & Developed with ❤️ by EsLaM Hamed" instead of WordPress branding. The WordPress logo is also removed from the admin bar globally.

5. 5

   Hide WordPress Hints: Use the Menu Visibility feature to hide Dashboard, Plugins, Appearance, Tools, and Settings from client roles. Combined with the branded login and navigation, your client will think they are using a custom-built CMS — not WordPress.

Still Have Questions?

Our support team is available to help you with any setup questions, customization requests, or technical issues. We typically respond within 24 hours.