Skip to main content
affpapa.org
RU EN
skill CX Codex

hyva-cms-custom-field — Claude Code skill: what it does

Generates custom inputs and modal handlers for Hyvä CMS components. Helps Magento developers extend editor controls without writing boilerplate by hand.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓ 
npx skills add hyva-themes/hyva-ai-tools --skill hyva-cms-custom-field -a claude-code
Open on GitHub

What hyva-cms-custom-field does

The skill outlines steps to implement bespoke field types for the Hyvä CMS editor. It covers basic inputs such as sliders or color pickers, as well as complex Alpine.js modal pickers that need separate dialogs.

During generation, the assistant sets up PHTML templates in view/adminhtml/templates/, wires events with Magewire, and configures etc/adminhtml/di.xml. For modal dialogs, it adds layout updates into liveview_editor.xml and produces component definitions for components.json.

This skill only works with Hyvä CMS and fails on standard Magento forms. Your module must declare dependencies on Hyva_CmsBase, Hyva_CmsLiveviewEditor, and hyva-themes/commerce-module-cms.

What it helps with

  • build PHTML templates for specialized Hyvä CMS input controls
  • wire Alpine.js modal dialogs for component asset selection
  • register custom field definitions in etc/adminhtml/di.xml
  • declare new input elements in components.json

Example prompts for the agent

  • Build a custom date range picker field for a Hyvä CMS promo block
  • Create an Alpine.js modal product picker for Hyvä CMS components
  • Register a custom color picker input in di.xml for the CMS editor

How to install hyva-cms-custom-field

1Skills CLI (Vercel)

npx skills add hyva-themes/hyva-ai-tools --skill hyva-cms-custom-field -a claude-code

2Manually: put the files in place

~/.claude/skills/hyva-cms-custom-field/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/hyva-cms-custom-field/

Step by step, with commands for each platform: How to install skills in Claude Code: five ways

Questions about hyva-cms-custom-field

How to install hyva-cms-custom-field in Claude Code?

Run npx skills add hyva-themes/hyva-ai-tools --skill hyva-cms-custom-field -a claude-code in your terminal. This creates ~/.claude/skills/hyva-cms-custom-field/SKILL.md.

What does hyva-cms-custom-field do?

It guides coding agents through creating custom field templates, Alpine.js handlers, and XML registrations for the Hyvä CMS Liveview editor.

What dependencies are required for this skill?

It requires the hyva-themes/commerce-module-cms package alongside Hyva_CmsBase and Hyva_CmsLiveviewEditor modules, plus companion skills hyva-create-module and hyva-exec-shell-cmd.

Similar skills

Everything for Frontend and UI →
magento-hyva-specialist maxnorm A skill for building Magento 2 storefronts on the Hyvä theme: Alpine.js components, Tailwind CSS, GraphQL and frontend performance work. CX Codex +1 857installs platform-custom-field-generate forcedotcom Generates and validates Salesforce CustomField metadata XML for SFDX projects. It prevents Metadata API deployment failures across relationship fields, picklists, and formulas. CX Codex +1 6,500installs ghost Mindrally Gives your agent working knowledge of Ghost CMS theme development: Handlebars templates, partials, Tailwind CSS and Alpine.js wiring, image and SEO work. CX Codex +1 828installs cms-development official Awesome Copilot Community This plugin brings CMS-focused skills for themes, admin tools, Markdown rendering, and static exports. Use it when a project involves content workflows or publishing. ★ 40,418repo stars contentful-custom-app-from-scratch contentful Walks an agent through building a Contentful App Framework custom app: brief, location choice, scaffold, local test, handoff. CX Codex +1 2,800installs cms-migration payloadcms Interactive guide for designing Payload CMS collections before migrating from WordPress, Strapi, or Contentful. It shapes schema configs prior to importing data. CX Codex +1 1,900installs

From the same set5

hyva-create-module Scaffolds a Magento 2 module in app/code/ with registration.php, composer.json and etc/module.xml. Useful when you need a new module without copying boilerplate by hand. CX Codex +1 1,300installs hyva-playwright-test Guides writing Playwright end-to-end tests for Hyvä Magento storefronts using Alpine.js. It resolves locator conflicts caused by hidden DOM elements. CX Codex +1 1,300installs hyva-compile-tailwind-css Builds Tailwind CSS stylesheets for Hyvä themes in Magento 2. It triggers production builds or watch mode when updated utility classes fail to render on the storefront. CX Codex +1 1,300installs hyva-exec-shell-cmd Identifies the Magento dev setup and selects the right command wrapper for containers or local execution. CX Codex +1 1,300installs

Project sponsors

Companies that keep this analytics open
Gold sponsor
Nutra.Club

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor