Tidyfactor Styler
TidyFactor/Styler
Production framework styler and surgical RTL UI polish engine with Contextual Decision Layer (CDL).
Expert skill for converting any codebase (React/HTML/Next.js) into a pixel-perfect, SEO-optimized, and dynamic WordPress theme.
Install Codebase To Wordpress Converter
$ npx skills add sickn33/agentic-awesome-skills --skill codebase-to-wordpress-converter -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install sickn33/agentic-awesome-skills codebase-to-wordpress-converter --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/sickn33/agentic-awesome-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/codebase-to-wordpress-converter .claude/skills/codebase-to-wordpress-converter && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "codebase-to-wordpress-converter" agent skill from https://github.com/sickn33/agentic-awesome-skills/tree/main/skills/codebase-to-wordpress-converter into .claude/skills/codebase-to-wordpress-converter/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "codebase-to-wordpress-converter", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/sickn33/agentic-awesome-skills/tree/main/skills/codebase-to-wordpress-converterType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add sickn33/agentic-awesome-skills --skill codebase-to-wordpress-converter -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install sickn33/agentic-awesome-skills codebase-to-wordpress-converter --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/sickn33/agentic-awesome-skills.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/codebase-to-wordpress-converter .agents/skills/codebase-to-wordpress-converter && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "codebase-to-wordpress-converter" agent skill from https://github.com/sickn33/agentic-awesome-skills/tree/main/skills/codebase-to-wordpress-converter into .agents/skills/codebase-to-wordpress-converter/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "codebase-to-wordpress-converter", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add sickn33/agentic-awesome-skills --skill codebase-to-wordpress-converter -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install sickn33/agentic-awesome-skills codebase-to-wordpress-converter --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/sickn33/agentic-awesome-skills.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/codebase-to-wordpress-converter .cursor/skills/codebase-to-wordpress-converter && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "codebase-to-wordpress-converter" agent skill from https://github.com/sickn33/agentic-awesome-skills/tree/main/skills/codebase-to-wordpress-converter into .cursor/skills/codebase-to-wordpress-converter/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "codebase-to-wordpress-converter", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/sickn33/agentic-awesome-skills.git --path skills/codebase-to-wordpress-converter--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add sickn33/agentic-awesome-skills --skill codebase-to-wordpress-converter -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install sickn33/agentic-awesome-skills codebase-to-wordpress-converter --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/sickn33/agentic-awesome-skills.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/codebase-to-wordpress-converter .gemini/skills/codebase-to-wordpress-converter && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "codebase-to-wordpress-converter" agent skill from https://github.com/sickn33/agentic-awesome-skills/tree/main/skills/codebase-to-wordpress-converter into .gemini/skills/codebase-to-wordpress-converter/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "codebase-to-wordpress-converter", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install sickn33/agentic-awesome-skills codebase-to-wordpress-converterInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add sickn33/agentic-awesome-skills --skill codebase-to-wordpress-converter -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/sickn33/agentic-awesome-skills.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/codebase-to-wordpress-converter .github/skills/codebase-to-wordpress-converter && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "codebase-to-wordpress-converter" agent skill from https://github.com/sickn33/agentic-awesome-skills/tree/main/skills/codebase-to-wordpress-converter into .github/skills/codebase-to-wordpress-converter/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "codebase-to-wordpress-converter", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add sickn33/agentic-awesome-skills --skill codebase-to-wordpress-converter -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install sickn33/agentic-awesome-skills codebase-to-wordpress-converter --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/sickn33/agentic-awesome-skills.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/codebase-to-wordpress-converter .opencode/skills/codebase-to-wordpress-converter && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "codebase-to-wordpress-converter" agent skill from https://github.com/sickn33/agentic-awesome-skills/tree/main/skills/codebase-to-wordpress-converter into .opencode/skills/codebase-to-wordpress-converter/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "codebase-to-wordpress-converter", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
codebase-to-wordpress-converter- GitHub stars
- 47k
- Used in
- 1 other repo
- Token cost
- ~1.1k tokens
- SKILL.md length
- 488 words
- Files
- 1
- Skills in repo
- 1,394
- Repo updated
- First seen
- Licence
- MIT
At a glance
Expert skill for converting any codebase (React/HTML/Next.js) into a pixel-perfect, SEO-optimized, and dynamic WordPress theme.
- Works in 4 steps: Discovery & Forensic Audit → Strategic Field Mapping → Implementation of Core Hooks → …
- Tasks that involve Design to code
- SKILL.md covers Overview, When to Use This Skill, Core Capabilities and Step-by-Step Guide, plus 4 more sections
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
What it does
Codebase To Wordpress Converter is an agent skill from sickn33/agentic-awesome-skills. Expert skill for converting any codebase (React/HTML/Next.js) into a pixel-perfect, SEO-optimized, and dynamic WordPress theme.
Its SKILL.md is about 1.1k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
It sits in Frontend & Design, covering Design to code. It works with WordPress, React and Next.js. The repository describes itself as: AAS Core is the local, agent-first control plane for complete catalog discovery, agent-owned selection, stack validation, and planning, backed by 2,400+ agentic skills. Includes… The licence is MIT.
When your agent uses it
- Tasks that involve Design to code
Example prompts
- “/codebase-to-wordpress-converter”
Workflow steps
4 steps, taken from the step headings in SKILL.md.
What it can do on your machine
Read from SKILL.md and the folder at commit 1e53ce2. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md (its code samples are php).
From the folder's file list and the shell code blocks in SKILL.md.
Network
Links to these hosts (documentation or services it may open):
advancedcustomfields.comtailwindcss.comdeveloper.wordpress.org
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
Codebase To Wordpress Converter loads about 1.1k tokens when it runs. Until then it costs about 40 tokens; SKILL.md has 488 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
The full file from sickn33/agentic-awesome-skills at commit 1e53ce2, republished under its MIT licence (© sickn33). 488 words, ~1,144 tokens.
Download SKILL.mdSave it as
.claude/skills/codebase-to-wordpress-converter/SKILL.md (or your agent's skills folder).- name
- codebase-to-wordpress-converter
- description
- Expert skill for converting any codebase (React/HTML/Next.js) into a pixel-perfect, SEO-optimized, and dynamic WordPress theme.
- risk
- safe
- source
- community
- date_added
- 2026-04-12
- author
- WHOISABHISHEKADHIKARI
Codebase to WordPress Converter
Overview
This skill is designed for the high-fidelity conversion of static or React-based frontends into fully functional, CMS-driven WordPress themes. It acts as a Senior WordPress Architect, React Expert, and QA Engineer to ensure a 100% pixel-perfect match while integrating deep WordPress functionality like ACF, dynamic menus, and technical SEO preservation.
When to Use This Skill
- Use when converting a React (CRA/Vite/Next.js) or HTML project into a WordPress theme.
- Use when the client demands a 100% pixel-perfect match with the original source.
- Use when auditing an existing WordPress conversion for structural or SEO flaws.
- Use when you need to ensure technical SEO (Schema, Meta tags, Heading hierarchy) is preserved exactly.
Core Capabilities
Phased Conversion & Audit
The skill follows a strict 4-phase forensic process:
- Phase 1: Forensic UI Comparison: Side-by-side table audit of React components vs. WordPress templates to find discrepancies.
- Phase 2: Full Audit: Deep dive into UI, SEO, CMS Editability, Navigation, Functionality, and Performance.
- Phase 3: Action Plan: Tasks classified as SAFE, RISKY, or BLOCKED to prevent breaking the UI.
- Phase 4: Iterative Fixing: Executing one safe task at a time with validation after each step.
Absolute UI Lock
Strict enforcement of non-negotiable rules:
- No alterations to layout, spacing, typography, or colors.
- Exact preservation of Tailwind or CSS class names.
- Zero changes to DOM structure or HTML nesting.
Step-by-Step Guide
1. Discovery & Forensic Audit
Start by identifying all components in the source code. Create a UI Comparison table comparing the original source output against the target WordPress output.
- Rule: No fixes are allowed during this phase; only detection.
2. Strategic Field Mapping
Map static React/HTML content to dynamic WordPress functions:
- Replace static text with
the_title(),get_field(), orthe_content(). - Replace static paths with
get_template_directory_uri().
Show full SKILL.md (196 more words)Show less
3. Implementation of Core Hooks
Ensure every theme includes the foundational WordPress hooks correctly:
- Layout Files (
header.php/footer.php): Must includewp_head()before</head>andwp_footer()before</body>. - Page Templates: Must call
get_header()andget_footer(). register_nav_menus()for dynamic navigation without breaking original HTML structure.
4. Validation & Live Tracker
Maintain a live tracker of Total Issues, Fixed, and Remaining. Every fix must be followed by a confirmation:
- ✅ No UI change
- ✅ No DOM change
- ✅ No class change
Examples
Example 1: Navigation Conversion
// WRONG: Static replacement that adds wrappers
wp_nav_menu(['theme_location' => 'primary']);
// CORRECT: Preserving original Tailwind classes and structure
wp_nav_menu([
'theme_location' => 'primary',
'container' => false,
'items_wrap' => '<ul class="flex space-x-8">%3$s</ul>',
'walker' => new Custom_Tailwind_Walker()
]);Example 2: Asset Pathing
// Source: <img src="/images/logo.png" />
// WP Conversion:
<img src="<?php echo get_template_directory_uri(); ?>/assets/images/logo.png" alt="Logo" />Best Practices
- ✅ Do: Use
get_page_by_path()for robust internal linking. - ✅ Do: Implement ACF (Advanced Custom Fields) fallbacks in
functions.php. - ✅ Do: Keep the Tailwind configuration in the
header.phpto ensure global styles are active. - ❌ Don't: Add "div" wrappers or rename classes to "clean up" the code.
- ❌ Don't: Use standard WordPress default styles if they conflict with the original design.
Additional Resources
Limitations
- Use this skill only when the task clearly matches the scope described above.
- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.
- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.
© sickn33, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
Just SKILL.md in skills/codebase-to-wordpress-converter of sickn33/agentic-awesome-skills.
Open the folder on GitHubat commit 1e53ce2
Used in 1 other repository
We found 5 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in sickn33/agentic-awesome-skills, which our catalogue first saw on October 7, 2026.
Compare with similar skills
Codebase To Wordpress Converter next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Codebase To Wordpress Converter this skillsickn33/agentic-awesome-skills | 47k | 1 repos | ~1.1k | Automated safety check: Pass | MIT | |
| Tidyfactor StylerTidyFactor/Styler | 118 | — | ~1.7k | Automated safety check: Pass | Apache-2.0 | |
| Design Code for Any Frameworkplugin87/ux-ui-agent-skills | 1.5k | — | ~1.7k | Automated safety check: Pass | MIT | |
| Figma To Codemajiayu000/spellbook | 286 | — | ~2.1k | Automated safety check: Pass | MIT | |
| Website ClonerJCodesMore/ai-website-cloner-template | 36k | — | ~1.7k | Automated safety check: Pass | MIT | |
| Vercel React Best Practicesgambitph/Stackable | 350 | — | ~2k | Automated safety check: Pass | MIT |
Similar skills
Design Code for Any Framework
plugin87/ux-ui-agent-skills
Generates complete, accessible, token-driven UI component code for a chosen framework such as React with Tailwind, SwiftUI, Vue, Flutter or Jetpack Compose.
Figma To Code
majiayu000/spellbook
Extract Figma designs and generate production-ready React/Next.js components with TypeScript, Tailwind CSS, and pixel-perfect accuracy.
Website Cloner
JCodesMore/ai-website-cloner-template
Rebuilds existing web pages as editable local code that matches their content, assets, responsive layout and interactions, including Framer sites and animated pages.
Vercel React Best Practices
gambitph/Stackable
React performance optimization guidelines from Vercel Engineering.
Wcag Audit Patterns
vmDeshpande/ai-agent-automation
Conduct WCAG 2.2 accessibility audits with automated testing, manual verification, and remediation guidance.
More from sickn33/agentic-awesome-skills
All 1,394 skills in this repoLiuguang Banlan UI
sickn33/agentic-awesome-skills
Implements an interface in one of two named color modes, iridescent white or colorful black, from a parameterized starter that reports measured color intensity.
User Thoughts Memory
sickn33/agentic-awesome-skills
Saves a user's project decisions, rules and preferences into a project-local mdbase so later sessions and other agents can recover the intent.
Using LWC Memory and Graphs
sickn33/agentic-awesome-skills
Keeps project decisions, research and verified results available across coding-agent sessions through LWC memory, a document Wiki graph and a CodeGraph code index.
Find Complementary Founders
sickn33/agentic-awesome-skills
Guides an agent through assessing its own owner for cofounder fit, publishing an approved profile, and ranking complementary profiles other agents published for their owners.
Whatsapp Cloud API
sickn33/agentic-awesome-skills
Integracao com WhatsApp Business Cloud API (Meta). An agent skill from sickn33/agentic-awesome-skills.
Cline Pilot
sickn33/agentic-awesome-skills
Acts as a proxy for the Cline CLI, dispatching coding tasks one at a time, monitoring runs by hard evidence, relaying decisions to you and learning per-project preferences.
Related
Categories
Questions about Codebase To Wordpress Converter
What does Codebase To Wordpress Converter do?
Expert skill for converting any codebase (React/HTML/Next.js) into a pixel-perfect, SEO-optimized, and dynamic WordPress theme. Codebase To Wordpress Converter is an agent skill from sickn33/agentic-awesome-skills.js) into a pixel-perfect, SEO-optimized, and dynamic WordPress theme.
When should I use Codebase To Wordpress Converter?
Codebase To Wordpress Converter fits situations like: tasks that involve Design to code.
How do I install Codebase To Wordpress Converter in Claude Code?
Run `npx skills add sickn33/agentic-awesome-skills --skill codebase-to-wordpress-converter -a claude-code`. Or copy the skill folder (skills/codebase-to-wordpress-converter in sickn33/agentic-awesome-skills) into .claude/skills/codebase-to-wordpress-converter in your project. Claude Code loads it when a task matches its description.
How do I install Codebase To Wordpress Converter in Codex?
Run `npx skills add sickn33/agentic-awesome-skills --skill codebase-to-wordpress-converter -a codex`. Or copy the skill folder (skills/codebase-to-wordpress-converter in sickn33/agentic-awesome-skills) into .agents/skills/codebase-to-wordpress-converter in your project. Codex loads it when a task matches its description.
Can I use Codebase To Wordpress Converter in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add sickn33/agentic-awesome-skills --skill codebase-to-wordpress-converter -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/codebase-to-wordpress-converter, .gemini/skills/codebase-to-wordpress-converter, .github/skills/codebase-to-wordpress-converter and .opencode/skills/codebase-to-wordpress-converter in your project.
What does Codebase To Wordpress Converter need to run?
SKILL.md names no scripts, command-line tools or credentials: Codebase To Wordpress Converter is instructions for the agent only.
Does Codebase To Wordpress Converter access the network?
SKILL.md names 3 domains. As links in the text: advancedcustomfields.com, tailwindcss.com and developer.wordpress.org. This is read from the text; nothing was executed.
Is Codebase To Wordpress Converter safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does Codebase To Wordpress Converter use?
Codebase To Wordpress Converter is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does Codebase To Wordpress Converter use?
About 1.1k tokens (SKILL.md is roughly 4.6k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
What are the alternatives to Codebase To Wordpress Converter?
Skills that share tags, products or a category with Codebase To Wordpress Converter: Tidyfactor Styler (TidyFactor/Styler, 118 stars), Design Code for Any Framework (plugin87/ux-ui-agent-skills, 1.5k stars), Figma To Code (majiayu000/spellbook, 286 stars) and Website Cloner (JCodesMore/ai-website-cloner-template, 36k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Codebase To Wordpress Converter?
sickn33 (a GitHub user) maintains it in sickn33/agentic-awesome-skills, which has 47,304 GitHub stars. The repository holds 1,394 skills in this directory. The repository was last updated on October 6, 2026.
Source: sickn33/agentic-awesome-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.