wp-guided-tour
SolidUse when adding a guided onboarding or feature-discovery tour to a WordPress admin plugin using Driver.js v1 — setting up the IIFE bundle (window.driver.js.driver), PHP backend tour config arrays (autoStart, pages, steps, element, popover), JS scope detection from URL pathname + hash (getCurrentScope, hashchange listener), localStorage-based completion tracking, CSS selector rules for WP admin elements including Tailwind bracket-notation escaping, testing selectors in browser console, and generating/updating the POT file for tour strings. Triggers: "add a guided tour to my plugin", "onboarding walkthrough in WP admin", "Driver.js setup", "highlight this admin element", "step-by-step tutorial in WP admin", "tour not starting", "tour completion not saving", "scope detection for admin pages", "add tooltips to my settings page", "first-run wizard", "window.driver.js.driver", "getCurrentScope()", "hashchange listener for tour", "localStorage tour tracking", "Tailwind selector escaping in PHP", "Driver.js popover",
Install
Quality Score: 80/100
Skill Content
Details
- Author
- mralaminahamed
- Repository
- mralaminahamed/wp-dev-skills
- Created
- 1 months ago
- Last Updated
- 1 weeks ago
- Language
- PHP
- License
- MIT
Integrates with
Similar Skills
Semantically similar based on skill content — not just same category
wp-build-tools
Use when setting up, configuring, or debugging the JavaScript/CSS build pipeline for a WordPress plugin — @wordpress/scripts, webpack (webpack.config.js, entry points, externals), Vite, block editor asset compilation with block.json, enqueueing built assets with .asset.php dependency files, wp_enqueue_script / wp_localize_script, Sass/SCSS/PostCSS compilation, TypeScript support, register_block_type, or reusing a JS/CSS library already bundled by a host plugin (EDD, WooCommerce, Elementor). Triggers: "npm run build fails", "webpack config error", "my script is not loading", "set up @wordpress/scripts", "enqueue my block assets", "why is my CSS not compiling", ".asset.php not found", "how do I reuse this bundled library", "TypeScript in a WP plugin", "block.json attributes", "missing dependency in build", "wp_enqueue_script not loading", "externals in webpack", "Vite for WordPress", "Sass not compiling", "PostCSS setup", "build output is in the wrong folder", "npm ci vs npm install", "externalize React from my
guided-tour
Run a live, interactive guided tour of a codebase — you act as a hands-on tutor who leads the user through how the code actually works, one digestible piece at a time, pausing often so they can ask questions, go deeper, or redirect. This is a real-time conversation, NOT a document or HTML file you generate and hand off. Diagrams are used freely (ASCII, Mermaid, or rich widgets) wherever they make a concept click. TRIGGER this skill whenever the user wants to UNDERSTAND a codebase through conversation rather than receive a static artifact. Match phrases like: - "give me a guided tour", "walk me through this codebase interactively", "onboard me to this project", "teach me how this works", "help me understand this repo" - "explain how X works and let me ask questions", "I want to explore how X is built" - "I'm new to this codebase, where do I start", "trace how a request flows and stop so I can follow", "be my tour guide for this code" Also trigger when someone drops into an unfamiliar repo and expresses confusi
wp-admin-browser
Use when a WordPress admin panel needs real browser interaction via Chrome DevTools MCP — logging in, navigating admin menus, clicking buttons, filling and submitting forms, creating/editing/deleting content through the UI, creating a temporary test admin user, verifying JS state or localStorage, capturing screenshots, or obtaining a REST nonce via admin-ajax.php. Triggers: "open WP admin", "log in to WordPress", "navigate to Settings", "create a test user in admin", "click Save Changes", "fill in this form in the browser", "take a screenshot of the admin page", "upload media through the browser", "check the admin menu", "verify this in the browser", "use Chrome DevTools MCP", "fill_form in admin", "evaluate_script in admin", "admin panel is in maintenance mode", "get a REST nonce", "session expired re-login", "interact with the WP dashboard", "navigate to Plugins Add New", "test this in the actual admin UI", "create a temp admin account for testing", "check localStorage in admin". Not for: headless automated