AgentSkillsCN

wp-frontend

在编写WordPress前端/客户端代码时使用此功能——包括CSS样式、JavaScript交互性、HTML模板、主题开发、Gutenberg区块、响应式设计、无障碍性、浏览器兼容性、资产优化，以及现代化前端工作流（Webpack、npm、构建工具）。

SKILL.md
--- frontmatter
name: wp-frontend
description: Use when writing WordPress frontend/client-side code - CSS styling, JavaScript interactivity, HTML templates, theme development, Gutenberg blocks, responsive design, accessibility, browser compatibility, asset optimization, and modern frontend workflows (webpack, npm, build tools)

WordPress Frontend Development

Frontend/client-side WordPress development including CSS, JavaScript, HTML coding standards and best practices.

Available Resources

Frontend Coding Standards

When to Use

Use this skill when working on:

  • •CSS Files: Writing or reviewing .css, .scss files
  • •JavaScript Files: Writing or reviewing .js files
  • •HTML Templates: Theme templates, template parts
  • •Gutenberg Blocks: Block editor development
  • •Theme Development: Custom themes, child themes
  • •Responsive Design: Media queries, mobile-first approach
  • •Accessibility: ARIA attributes, semantic HTML, keyboard navigation
  • •Asset Optimization: Minification, concatenation, lazy loading
  • •Build Tools: webpack, npm scripts, Gulp, Grunt

Quick Reference

Common Frontend Tasks

  • •Styling components → CSS Coding Standards
  • •Adding interactivity → JavaScript Coding Standards
  • •Creating templates → HTML Coding Standards
  • •Building Gutenberg blocks → JavaScript + HTML Coding Standards
  • •Theme customization → CSS + HTML Coding Standards
  • •Responsive design → CSS Coding Standards (Media Queries)
  • •Accessibility improvements → HTML Coding Standards (ARIA, Semantic HTML)