playbooks

home / skills / jeremylongshore / claude-code-plugins-plus-skills / seo-meta-generator

seo-meta-generator skill

/skills/05-frontend-dev/seo-meta-generator

This skill helps you implement and validate seo meta generator patterns with production-ready code and best practices.

npx playbooks add skill jeremylongshore/claude-code-plugins-plus-skills --skill seo-meta-generator

Review the files below or copy the command above to add this skill to your agents.

Files (1)
SKILL.md
2.1 KB
---
name: "seo-meta-generator"
description: |
  Generate seo meta generator operations. Auto-activating skill for Frontend Development.
  Triggers on: seo meta generator, seo meta generator
  Part of the Frontend Development skill category. Use when working with seo meta generator functionality. Trigger with phrases like "seo meta generator", "seo generator", "seo".
allowed-tools: "Read, Write, Edit, Bash(cmd:*), Grep"
version: 1.0.0
license: MIT
author: "Jeremy Longshore <[email protected]>"
---

# Seo Meta Generator

## Overview

This skill provides automated assistance for seo meta generator tasks within the Frontend Development domain.

## When to Use

This skill activates automatically when you:
- Mention "seo meta generator" in your request
- Ask about seo meta generator patterns or best practices
- Need help with frontend skills covering react, vue, css, accessibility, performance optimization, and modern web development patterns.

## Instructions

1. Provides step-by-step guidance for seo meta generator
2. Follows industry best practices and patterns
3. Generates production-ready code and configurations
4. Validates outputs against common standards

## Examples

**Example: Basic Usage**
Request: "Help me with seo meta generator"
Result: Provides step-by-step guidance and generates appropriate configurations


## Prerequisites

- Relevant development environment configured
- Access to necessary tools and services
- Basic understanding of frontend development concepts


## Output

- Generated configurations and code
- Best practice recommendations
- Validation results


## Error Handling

| Error | Cause | Solution |
|-------|-------|----------|
| Configuration invalid | Missing required fields | Check documentation for required parameters |
| Tool not found | Dependency not installed | Install required tools per prerequisites |
| Permission denied | Insufficient access | Verify credentials and permissions |


## Resources

- Official documentation for related tools
- Best practices guides
- Community examples and tutorials

## Related Skills

Part of the **Frontend Development** skill category.
Tags: react, vue, css, accessibility, web

Overview

This skill automates generation and validation of SEO meta tags and related configuration for frontend projects. It produces production-ready meta tag templates, structured data snippets, and suggestions tailored to frameworks like React and Vue. The goal is faster, consistent SEO metadata that follows current best practices.

How this skill works

The skill inspects page context, route information, and provided content to generate meta title, description, canonical tags, open graph and Twitter card data, and JSON-LD structured data. It validates outputs against common standards, suggests accessibility and performance-friendly improvements, and emits framework-specific snippets or config for server-side rendering and client hydration. Outputs include sample code, config files, and recommended checks for crawling and indexability.

When to use it

  • Adding or updating SEO metadata across a site or single page
  • Implementing framework-specific meta handling (React/Vue/SSR/SSG)
  • Generating JSON-LD structured data for rich results
  • Creating consistent Open Graph and Twitter card tags for social sharing
  • Validating meta outputs and canonicalization strategies

Best practices

  • Keep title tags unique, 50–60 characters and front-load keywords where natural
  • Write clear meta descriptions ~120–160 characters that describe page intent and call to action
  • Include canonical tags to prevent duplicate content and ensure a single indexed URL
  • Provide complete Open Graph and Twitter Card metadata for reliable social previews
  • Use JSON-LD for structured data and validate with rich result testing tools

Example use cases

  • Generate meta templates for a new product listing page with schema.org Product JSON-LD
  • Create server-rendered meta injection for a React SSR app with per-route dynamic titles and descriptions
  • Audit an existing site’s meta tags and produce a prioritized fix list to improve search and social previews
  • Produce SEO-friendly defaults for a blog engine and override rules for author, tag, and post pages
  • Output a validation report showing missing or malformed meta elements and suggested code fixes

FAQ

Can it generate framework-specific code?

Yes. It emits snippets and integration guidance for React, Vue, SSR, and SSG setups.

Does it validate structured data?

Yes. The skill checks JSON-LD for common schema types and flags syntax or required-property issues.

Will it handle multi-language sites?

It can generate language-specific meta and hreflang suggestions when provided with per-locale content and URL mappings.