Token导航 LogoToken导航TokenDH.com
研究检索需要联网github未标认证来源可访问许可证需确认审计通过

landing-page-generator登陆页面生成器

Agent Skill

landing-page-generator 用于查找、检索和筛选相关信息,适合在 Codex、Claude、Cursor、Gemini CLI 中需要根据关键词、任务场景或来源线索快速定位候选结果时使用。可结合来源仓库、安装命令和原始 README 继续核验具体用法。安装前建议确认权限范围、维护状态,以及是否会触发联网、命令执行或文件读写。

总安装

1,458

周安装

59

GitHub Stars

103

下载量

458
CodexClaudeCursorGemini CLI

安装说明

本站只整理中文说明和来源信息,不托管安装包,也不代用户安装。

GitHub

来源数

2

许可证

unknown

最后核验

2026-05-01

来源状态

来源可访问

安装方式

通过对话安装

复制提示词发给支持本地命令或 Skills 的 AI 助手,先确认命令和权限,再让它执行。

请帮我安装这个 Agent Skill:landing-page-generator(登陆页面生成器)
来源仓库:https://github.com/borghei/claude-skills
仓库路径:skills/landing-page-generator
安装命令:
npx skills add https://github.com/borghei/claude-skills --skill landing-page-generator
安装前请先检查当前环境是否支持对应 CLI,并向我确认将要执行的命令、安装目录、联网范围和文件读写权限;确认后再执行。

命令行安装

复制命令到本机终端执行。该命令会通过 npx skills 从第三方来源获取 Skill;本站只展示命令,不托管安装包,也不自动执行。

skills.shnpx skills
npx skills add https://github.com/borghei/claude-skills --skill landing-page-generator

简介

landing-page-generator 提供高转化着陆页设计框架,含文案模板、区块模式与 CTA 策略。

  • 适用于营销活动落地页与获客页面构建,可在指定宿主环境中调用。
  • 通过 npx skills add 从 GitHub 安装,具体组件与样式见仓库说明。
  • 安装前请确认权限范围与维护状态,注意是否涉及文件写入或外部资源加载。
  • 适用宿主包括 Codex、Claude、Cursor、Gemini CLI,接入前应确认版本、权限和运行环境要求。

SKILL.md

Landing Page Generator

Design and build high-converting landing pages using proven copy frameworks, section patterns, and conversion optimization techniques.


Table of Contents


Keywords

landing page, landing page design, conversion optimization, lead capture page, campaign page, marketing page, hero section, CTA strategy, landing page copy, landing page generator, promo page, conversion page, lead gen page, single-page site, landing page template, A/B testing, page layout, above the fold, social proof, pricing table, FAQ section, testimonial block


Quick Start

Generate a Landing Page

  1. Gather inputs: product, audience, pain point, key benefit, offer
  2. Select design style (dark-saas, clean-minimal, bold-startup, enterprise)
  3. Choose copy framework (PAS, AIDA, BAB) based on audience awareness
  4. Build sections in order: Hero > Problem > Solution > Social Proof > How It Works > CTA
  5. Run conversion optimization checklist before publishing
  6. Set up A/B test for headline and CTA variants

Landing Page Brief Template

## Landing Page Brief
- Product/Service: [Name]
- Value proposition: [One sentence]
- Target audience: [Who and what they need]
- Key pain point: [Primary problem you solve]
- Key benefit: [Primary outcome they get]
- Offer: [What you are offering — trial, demo, download, purchase]
- Traffic source: [Where visitors come from — ads, email, organic]
- Design style: [dark-saas / clean-minimal / bold-startup / enterprise]
- Copy framework: [PAS / AIDA / BAB]

Core Workflows

Workflow 1: Full Landing Page Build

Step 1: Define the Single Goal

Every landing page has one purpose and one CTA. Define it before anything else:

  • What action do you want the visitor to take?
  • What does the visitor get in return?
  • What is the traffic source (this determines headline matching)?

Step 2: Select Copy Framework

FrameworkBest WhenAudience Awareness Level
PAS (Problem > Agitate > Solve)Audience knows the problemProblem-aware
AIDA (Attention > Interest > Desire > Action)Audience needs educationUnaware to problem-aware
BAB (Before > After > Bridge)Audience wants transformationSolution-aware

Step 3: Build Sections in Order

OrderSectionPurpose
1HeroCommunicate value in 5 seconds
2Social proof barBuild instant credibility
3Problem statementShow you understand their pain
4Solution / BenefitsPresent your answer
5How it worksReduce perceived complexity
6Features with benefitsDetail what they get
7TestimonialsProof from real customers
8Pricing (if applicable)Help them decide
9FAQHandle objections
10Final CTARepeat the ask with risk reversal

Step 4: Write Copy Per Section

Use the section-specific guidelines in the Page Section Library below.

Step 5: Optimize for Conversion

Run the Conversion Optimization Checklist before launching.

Workflow 2: Campaign Landing Page

For ad campaigns, email campaigns, or launch events:

Step 1: Message Match

The landing page headline MUST match the ad/email that drives traffic:

  • If ad says "Reduce churn by 30%," the landing page headline must say "Reduce churn by 30%"
  • Mismatched expectations cause immediate bounce

Step 2: Single Message Focus

Remove all navigation, sidebar links, and secondary CTAs:

  • No header navigation (removes exit paths)
  • No footer links except legal requirements
  • One CTA repeated 2-3 times on the page
  • Every section supports the single conversion goal

Step 3: Traffic Source Adaptation

Traffic SourcePage Adaptation
Paid search (Google)Lead with the searched keyword in H1
Paid social (Meta, LinkedIn)Lead with the ad's hook/benefit
Email campaignLead with the email's promise
Organic searchLead with the comprehensive answer
Referral/partnerLead with the referrer's context

Page Section Library

Hero Section

The most important section. Must communicate value in 5 seconds.

Components:

  • Headline (primary value proposition)
  • Subheadline (expand on headline, add specificity)
  • Primary CTA button
  • Secondary CTA (optional, lower commitment)
  • Supporting visual (product screenshot, illustration, or video)
  • Trust signal (social proof bar, customer count, or badge)

Hero Variants:

VariantLayoutBest For
CenteredText centered, CTA below, visual belowSimple offers, clear value props
SplitText left, visual right (or vice versa)Product with strong visual/screenshot
Video backgroundText overlay on ambient videoBrand-heavy, awareness pages
MinimalHeadline + CTA only, no visualHigh-intent traffic, direct offers
Social proof heroTestimonial as the headlineStrong customer story to lead with

Hero Copy Guidelines:

  • Headline: 6-12 words, includes the primary benefit
  • Subheadline: 1-2 sentences, adds specificity or addresses the "how"
  • CTA: Action verb + what they get ("Start my free trial")
  • Supporting text below CTA: reduce friction ("No credit card required")

Problem Section

Make the reader feel understood before pitching anything.

Structure:

  • 2-3 pain points in the reader's language
  • Each pain point is specific and recognizable
  • Optional: quantify the cost of the problem ("This costs teams an average of $X per month")

Solution / Benefits Section

Connect your product to the outcomes they want.

Structure:

  • 3-5 key benefits (not features)
  • Each benefit follows the pattern: [What it does] > [Why that matters] > [Specific outcome]
  • Visual support for each benefit (icon, screenshot, or illustration)

How It Works Section

Reduce perceived complexity to 3-4 simple steps.

Structure:

  • Step 1: [Action] (with brief description)
  • Step 2: [Action] (with brief description)
  • Step 3: [Action] (with brief description)
  • Optional Step 4: [Outcome] ("See results within [timeframe]")

Rules:

  • Never exceed 4 steps (complexity kills conversion)
  • Each step starts with an action verb
  • Each step can be understood independently

Social Proof Section

Types ranked by conversion impact:

TypeImpactExample
Named testimonial with metricsHighest"Reduced churn by 23% in 90 days" — Sarah Chen, VP Marketing
Customer logosHighRow of recognizable brand logos
Aggregate metricsHigh"2,847 teams, 40+ countries, 4.8/5 rating"
Star ratings / review scoresMedium"4.8 out of 5 on G2 (500+ reviews)"
Case study linkMedium"See how [Company] achieved [result]"
Generic testimonialLow"Great product!" — John D.

Pricing Section

Guidelines:

  • 2-4 tiers maximum (3 is optimal)
  • Highlight the recommended tier visually
  • Feature comparison shows what is included in each tier
  • Enterprise tier with "Contact us" for custom needs
  • Annual vs. monthly toggle if offering both
  • Trust signals near pricing (guarantee, cancel anytime)

FAQ Section

Guidelines:

  • 5-8 questions maximum
  • Questions should address real buying objections
  • Answers should be direct (1-3 sentences)
  • Include FAQPage schema markup for SEO

Common FAQ questions to include:

  • How does pricing work?
  • Can I cancel anytime?
  • How long does setup take?
  • Do you offer a free trial?
  • Is my data secure?
  • What integrations do you support?
  • How is this different from [competitor]?

Final CTA Section

Structure:

  • Headline restating the core value
  • 1 sentence of supporting copy
  • Primary CTA button (same as hero)
  • Risk reversal statement (guarantee, no CC, cancel anytime)
  • Optional: customer count or testimonial snippet

Copy Framework Application

PAS Application to Landing Page

SectionPAS ElementCopy Approach
Hero headlineProblemName the pain directly
Problem sectionAgitateShow consequences of inaction
Solution sectionSolveIntroduce product as the answer
CTASolveClear action to access the solution

Example:

  • Hero: "Your team wastes 4 hours every week on manual reporting"
  • Problem: "That is 200 hours a year — the equivalent of losing a full-time employee to spreadsheets. Meanwhile, your competitors are shipping features."
  • Solution: "[Product] automates your reporting. Set it once, get reports every Monday morning."
  • CTA: "Automate my reports — start free trial"

AIDA Application to Landing Page

SectionAIDA ElementCopy Approach
Hero headlineAttentionBold, attention-grabbing statement
Benefits sectionInterestExpand with relevant details and benefits
Social proofDesireShow proof and paint the transformation
CTAActionClear, compelling call to action

BAB Application to Landing Page

SectionBAB ElementCopy Approach
Hero + ProblemBeforeCurrent painful state
Solution + BenefitsAfterDesired future state
How it worksBridgeHow the product gets them there

Conversion Optimization Checklist

Above the Fold

  • Headline communicates value in under 6 seconds
  • CTA is visible without scrolling on mobile (375px viewport)
  • No more than one navigation option (or no navigation at all)
  • Subheadline adds specificity to the headline
  • Visual supports the message (not decorative)

Page-Wide

  • Single conversion goal throughout the page
  • CTA appears 2-3 times (hero, mid-page, footer)
  • Social proof appears within the first two scrolls
  • Every feature has a corresponding benefit
  • Objections addressed before the final CTA
  • Risk reversal stated near every CTA
  • No external links that compete with the CTA
  • Form asks for minimum required information

Trust and Credibility

  • Customer testimonials are named and specific
  • Company logos used with permission
  • Security badges and certifications visible if relevant
  • Privacy policy linked from any data collection form
  • Physical address or company information available

Mobile

  • Page loads under 3 seconds on mobile
  • CTA button is thumb-friendly (minimum 48px height)
  • Text is readable without zooming (16px minimum)
  • No horizontal scrolling
  • Forms are usable on mobile keyboards

Design Style Reference

Style Options

StyleVisual ToneBest For
Dark SaaSDark backgrounds, vibrant accents, gradient effectsDeveloper tools, technical products, modern SaaS
Clean MinimalWhite backgrounds, subtle borders, clean typographyProfessional services, healthcare, education
Bold StartupLarge typography, bright colors, dynamic layoutsConsumer products, startups, creative tools
EnterpriseMuted tones, structured layouts, conservative designB2B enterprise, finance, government

Visual Hierarchy Rules

  1. Headline is the largest text element on the page
  2. CTA button is the most visually prominent element
  3. Supporting text is noticeably smaller than headlines
  4. White space separates sections and creates breathing room
  5. Color contrast meets WCAG AA standards (4.5:1 minimum for text)
  6. Recommended plan on pricing pages is visually distinguished

CTA Strategy

CTA Placement

PositionPurposeCopy Approach
HeroPrimary conversion pointAction + benefit: "Start my free trial"
After benefitsCapture interest momentumReinforce: "See it in action"
After social proofCapitalize on trustSocial: "Join 2,847 teams"
Page footerFinal catchUrgency: "Start today — free for 14 days"

CTA Copy Formulas

[Action Verb] + [What They Get]
  • "Start my free trial"
  • "Get the complete guide"
  • "See pricing for my team"
  • "Create my first dashboard"

Supporting CTA Text

Below the button, reduce friction:

  • "No credit card required"
  • "Set up in 2 minutes"
  • "Cancel anytime"
  • "Free for 14 days"
  • "Join 2,847 teams"

SEO and Performance

SEO Checklist

  • Title tag: primary keyword + brand, 50-60 characters
  • Meta description: benefit + CTA, 150-160 characters
  • H1: one per page, includes primary keyword
  • OG image: 1200x630px with product name and value proposition
  • Canonical URL set
  • Image alt text on all images
  • Structured data: FAQPage schema if FAQ section exists
  • Mobile viewport meta tag present

Performance Targets

MetricTargetHow to Achieve
Largest Contentful Paint (LCP)Under 2.5 secondsOptimize hero image, use modern formats (WebP/AVIF)
Cumulative Layout Shift (CLS)Under 0.1Set explicit dimensions on all images and embeds
First Input Delay (FID)Under 100msDefer non-critical JavaScript
Time to First Byte (TTFB)Under 600msUse CDN, server-side rendering, or static generation
Total page weightUnder 1MBCompress images, minimize JavaScript bundles

A/B Testing Framework

What to Test (Highest to Lowest Impact)

  1. Headline — The single highest-impact element. Test 2-3 variants.
  2. CTA copy and color — Test action text and visual prominence.
  3. Hero image/visual — Product screenshot vs. illustration vs. video.
  4. Social proof placement — Above fold vs. below benefits.
  5. Form length — Fewer fields vs. more qualified leads.
  6. Price display — Annual vs. monthly default, pricing anchor.

Testing Rules

  • Test one variable at a time
  • Run tests for minimum 14 days or 1,000 visitors per variant
  • Calculate statistical significance (95% confidence) before declaring winner
  • Document hypothesis, variants, and results for every test
  • Never end a test early based on early results

Test Documentation

## A/B Test: [Name]
- Page: [URL]
- Hypothesis: [If we change X, then Y improves because Z]
- Control: [Current version]
- Variant: [Changed version]
- Primary metric: [Conversion rate / Click rate / Signup rate]
- Duration: [Start - End]
- Traffic per variant: [Number]
- Result: [Winner + lift + confidence]
- Learning: [What we apply going forward]

Best Practices

  1. One page, one goal — Every element on the page must serve the single conversion objective. If it does not help convert, remove it.
  2. Match the message — The landing page headline must mirror the ad, email, or link that drove the visit. Mismatched expectations are the top bounce cause.
  3. Remove navigation — Landing pages should have no header navigation, no sidebar, and no footer links except legal requirements. Every exit path is a lost conversion.
  4. Mobile first — Design for 375px viewport first. The majority of ad traffic arrives on mobile devices.
  5. Above-the-fold CTA — The primary CTA must be visible without scrolling on both desktop and mobile.
  6. Social proof early — Place credibility signals within the first two scrolls. Trust is a prerequisite for conversion.
  7. Minimize form fields — Every additional field reduces conversion. Ask for the minimum needed to qualify the lead.
  8. Speed is conversion — Every second of load time reduces conversion rate by approximately 7%. Optimize aggressively.
  9. Test relentlessly — The headline alone can produce 20-50% conversion differences. A/B test every high-impact element.
  10. Risk reversal near every CTA — "No credit card required," "Money-back guarantee," "Cancel anytime." Remove the last objection at the moment of decision.

Integration Points

  • Copywriting — Use for the copy layer. Landing Page Generator handles structure and optimization. Copywriting handles the words.
  • Ad Creative — Use for the ads driving traffic to the landing page. Ensure message match between ad and page.
  • Marketing Psychology — Use psychological principles (anchoring, social proof, loss aversion) to strengthen page elements.
  • Campaign Analytics — Use to measure landing page performance and feed insights into optimization.
  • Brand Guidelines — Reference brand visual and voice standards for consistency.
  • Content Humanizer — Use if page copy sounds robotic or generic after initial drafting.

Troubleshooting

SymptomLikely CauseFix
High bounce rate from paid trafficHeadline doesn't match the adEnsure exact message match between ad copy and landing page H1.
CTA below fold on mobileHero section too tall or CTA not prioritizedTest on 375px viewport. CTA must be visible without scrolling.
Good traffic but zero conversionsConversion tracking brokenVerify pixel fires on thank-you page. Test with a real conversion.
Slow page load (>3s mobile)Unoptimized images, heavy JSRun page_speed_estimator.py. Convert images to WebP, defer non-critical JS.
Form submissions but no leads in CRMForm-to-CRM integration brokenTest form submission end-to-end. Check webhook/API connection.
Multiple CTAs confusing visitorsToo many conversion pathsSingle goal per landing page. All CTAs drive the same action.
Low conversion despite good copyNo social proof or risk reversalRun conversion_checklist.py. Add testimonials and "no credit card" near CTAs.

Success Criteria

  • Conversion rate above 6.6% (2025 median across industries) for primary CTA
  • Page loads under 3 seconds on mobile (LCP under 2.5s, CLS under 0.1)
  • CTA visible above fold on both desktop (1440px) and mobile (375px)
  • Single conversion goal with no competing navigation or exit paths
  • Message match: landing page headline mirrors the traffic source (ad, email, link)
  • Social proof visible within first two scrolls
  • A/B test running on headline or CTA at all times for high-traffic pages

Scope & Limitations

In Scope: Landing page structure, section patterns, copy framework application, conversion optimization, CTA strategy, SEO meta tags, A/B testing framework, design style guidance.

Out of Scope: Page copy writing (use copywriting), paid ad campaigns driving traffic (use paid-ads), CMS/website builder administration, analytics platform setup.

Limitations: Conversion benchmarks vary significantly by industry, traffic source, and offer type. The 6.6% median is across all industries; SaaS trials may see 10-25% while e-commerce may see 2-3%.


Python Automation Tools

1. Page Speed Estimator (scripts/page_speed_estimator.py)

Estimates Core Web Vitals from HTML source: LCP, CLS risk, script/image analysis, and conversion impact.

python scripts/page_speed_estimator.py page.html
python scripts/page_speed_estimator.py page.html --json

2. CTA Analyzer (scripts/cta_analyzer.py)

Analyzes CTA placement, copy strength, friction level, and consistency across the landing page.

python scripts/cta_analyzer.py page.html
python scripts/cta_analyzer.py page.html --json

3. Conversion Checklist (scripts/conversion_checklist.py)

Runs a comprehensive 20+ point conversion optimization audit against 2025-2026 best practices and benchmarks.

python scripts/conversion_checklist.py page.html
python scripts/conversion_checklist.py page.html --json

适合场景

01

用户想查找某类 Agent Skill 时

02

需要根据任务场景推荐可安装能力包时

03

需要对比不同来源的安装命令和来源信息时

能力概览

能力 1

按任务关键词查找相关 Skills

能力 2

展示可复制的安装命令

能力 3

保留来源站点、仓库和原始说明,方便继续核验

能力 4

展示第三方安全扫描或审计结果

安装后应在对应宿主中按原始 README 的触发条件使用;具体调用方式请以来源页面和 README 为准。

平台分布

Codex

35.72%
按下载量换算164

Claude

33.97%
按下载量换算156

Cursor

17.84%
按下载量换算82

Gemini CLI

8.89%
按下载量换算41

安全审计

Gen Agent Trust Hub

通过

Socket

通过

Snyk

通过

权限和风险

需要联网

该 Skill 可能需要联网访问来源站点、仓库或外部 API;具体网络访问范围需要结合源码和 README 复核。

安装前确认

本站仅展示第三方公开信息,不托管安装包,不提供自动安装或运行环境。安装前应自行审查源码、依赖和命令行为。当前只有一个来源,正式发布前建议补源仓库或其他目录站核验。

来源信息

继续浏览同类 Skills