End-of-Article CTA Designer skill

Designs end-of-article CTAs — copy, layout, placement, A/B test plan, accessibility — for blog posts, newsletters, and essays.

by samber·MIT license·GitHub ↗

★ 222 Stars on the repo·Checked

npx degit samber/cc-skills/skills/copywriting-cta#main ~/.claude/skills/copywriting-cta

SKILL.md · 12.4 KB · installs the whole folder to ~/.claude/skills/copywriting-cta

Files of End-of-Article CTA Designer

Files 1 file
Show the full text202 lines

Questions: Ask the user through the environment's question tool — never as plain-text prose. One question at a time, 2–4 tappable options, wait for the answer. If the environment has no question tool, ask in prose with the same options, one at a time.

End-of-Article CTA Designer

Designing an end-of-article CTA is a function of three inputs: the objective (what action), the audience (who reads it, in what relationship to the author), and the context (independent writing, newsletter, brand publication). Get those three right and the copy + form follow almost mechanically. Skip them and you get the universal failure mode: a generic "Subscribe for more" or "Learn More" that converts at the noise floor.

This skill runs a tight interview to capture those three inputs, then prescribes a CTA: copy (what it says), form (how it looks and sits on the page), mechanism (whether to use urgency, scarcity, curiosity, reciprocity, social proof, or none), an A/B test plan, and an accessibility check.


Workflow

Run the four steps below in order. Do not skip the interview. The user may have given partial context already; pull what's available from the conversation, then ask only for the missing pieces.

Step 1 — Interview

Ask one question at a time. Do not stack questions in prose. Each question must have 2-4 tappable options. Fall back to free text only if the answer genuinely cannot be enumerated.

Ask these in order, skipping any already answered:

Q1. Article context. Options: Personal / independent blog or essay · Newsletter / paid publication (Substack, beehiiv, Ghost, etc.) · Brand / company / content-marketing blog · Other (free text)

Q2. Primary objective. (Pick the one outcome you most want from a reader who finishes the article. If they say "all of them," push back: multiple objectives is the #1 cause of CTA failure.)

Options:

  • Newsletter / email subscription
  • Social follow / personal branding
  • Lead generation (download / gated asset)
  • Product or service signup / free trial
  • Demo or sales call booking
  • Direct purchase
  • Community join (Discord / Slack / forum)
  • Engagement (reply / comment / share / restack)
  • Reader support (paid subscription / tip / sponsorship)
  • Try-it / direct action (use the code, run the tool, fork the template, open the calculator)
  • Other (free text)

If the user lists more than one, ask which is primary. You can offer 1-2 secondaries later, but the primary must be singular.

Q3. Audience and relationship. Options: First-time visitor (organic search / social) · Returning reader, not subscribed · Existing subscriber / customer · Mixed / unknown

Q4. Funnel stage. (Where is the reader mentally?) Options: TOFU: discovery, learning, no buying intent yet · MOFU: evaluating options, comparing · BOFU: ready to act, just needs a nudge · Not applicable (no buying funnel — e.g., personal blog, journalism, hobby content)

Q5. Mechanism preference. (Only ask if a mechanism could legitimately help. See references/mechanisms.md. For sophisticated, skeptical, or repeat-reader audiences, default to "None / value-only" without asking.) Options: None: value statement only · Curiosity gap ("Want to know more?") · Reciprocity (free asset first) · Discount / offer · Urgency (real deadline) · Scarcity / FOMO (limited spots) · Social proof (count / testimonial)

Capture any free-text constraints the user volunteers (length limit, brand voice, no popups, multi-language, etc.). Note them.

Step 2 — Diagnose

Map the inputs to a CTA archetype. The decision logic:

context = INDEPENDENT / PERSONAL
├── objective = newsletter / email      → Archetype A: Author-signature subscribe
├── objective = try-it / direct action  → Archetype B: Inline action + source link
├── objective = reader support / tip    → Archetype C: Reader-supported funding link
├── objective = community               → Archetype D: Proof-counted community invite
├── objective = social follow           → Archetype A (variant: lead with social links)
├── objective = engagement              → Archetype E: Specific reply prompt
└── objective = product / demo          → ⚠️ FLAG. Only valid on personal/professional
                                          blog where the author IS the product
                                          (consultants, coaches, solo founders, indie devs).
                                          Frame as "if you hit this, here's how I help"
                                          — never "Book a Demo" verbatim.

context = NEWSLETTER PUBLICATION
├── objective = growth / subs           → Archetype F: Share/restack + native widget
├── objective = engagement              → Archetype E: Specific reply prompt
├── objective = paid conversion         → Archetype G: Value-gap tease
├── objective = monetization / sponsor  → Archetype H: Inline sponsor block (not bottom)
├── objective = community               → Archetype D
└── objective = direct purchase         → Archetype K (rare on newsletters; use BOFU only)

context = BRAND / CONTENT MARKETING
├── stage = TOFU                        → Archetype I: Transitional asset (lead magnet)
├── stage = MOFU                        → Archetype J: Direct + Transitional pair
├── stage = BOFU                        → Archetype K: Direct CTA + risk reversal
├── objective = community               → Archetype D
└── objective = engagement              → Archetype E (rarely the right call here)

Read references/taxonomy.md for the full archetype catalog with copy templates, form specs, when each works, and verbatim examples from named publications.

Step 3 — Compose the recommendation

Output the recommendation in this exact structure. Do not deviate. Do not add filler.

## Recommended CTA

**Archetype:** [letter + name from decision tree] **Why this fits:** [1-2 sentences naming the input combination]

### Content (copy)

**Headline / value line:**

> [exact text]

**Body / proof line (1-2 lines):**

> [exact text]

**Button copy:**

> [exact text]

**Risk reversal / subtext (if applicable):**

> [exact text, or "Omit: would feel forced for this audience"]

### Form (structure)

- **Placement:** [end-only / end + sticky / end + mid-article repeat]
- **Visual weight:** [low / medium / high, with justification]
- **Layout:** [single button / button + text link / native widget cluster / one-line signature]
- **Proof to co-locate:** [subscriber count / star count / testimonial / named recommenders / logo wall / none]

### Mechanism

[Named mechanism + 1 sentence on why it is appropriate, OR "None: value statement carries it. Mechanisms would erode trust for this audience."]

### A/B test plan

- **First test:** [single variable, e.g., button copy A vs. B]
- **Why this one first:** [1 sentence]
- **Sample size needed:** [rough estimate based on baseline traffic, or "skip A/B for now — traffic too low" with the alternative recommendation]
- **Next 2 tests to queue:** [in priority order]

### Accessibility check

- **Color contrast:** [target ratio + concrete pairing if colors known]
- **Touch target:** [size requirement]
- **Semantic markup:** [<button> vs. <a> vs. form]
- **ARIA:** [only if non-obvious]
- **Keyboard / focus:** [requirement]
- **Color-independence:** [non-color affordance]

After printing the recommendation, list 2-3 anti-patterns the user is at risk of falling into given their inputs, directly, as a contrarian check. Pull these from references/anti-patterns.md.

If the user is writing in a non-English language, translate the content section into that language but keep the structure (headings, labels) in English. Honor formality cues (e.g., tu vs. vous in French, du vs. Sie in German) based on prior conversation context, and flag the choice explicitly.

Step 4 — Offer next moves

Suggest 2-3 follow-up directions:

  1. Steelman the opposite. Offer to design the CTA you would recommend against — e.g., the hard-sell version on a TOFU post — so the user can see why it fails.
  2. Variant for a different audience or platform. If the article will be cross-posted (own site + Medium + LinkedIn + a syndication network), offer to rewrite per platform.
  3. End-to-end review. Offer to audit the rest of the article for CTA-supporting signals: author bio, related-post links, in-line proof.

Style inheritance

The copy templates in references/taxonomy.md are starting points, not finished copy. Always adapt them to:

  • The user's stated brand voice or any <userPreferences> in scope (formality, language, em-dash avoidance, length limits).
  • The language of the article. Output copy in the article's language; never default to English.
  • The publication's existing voice. If the user has prior posts visible, mirror their cadence and vocabulary.
  • The reader's expected level of expertise. A CTA for a beginner-finance blog uses different vocabulary than one for a quant-trading newsletter.

Never output a template verbatim if it conflicts with the user's stated style preferences.


Reference files

Read these as needed during diagnosis and composition. Read the relevant file in full before composing the recommendation; do not paraphrase from memory.

  • references/taxonomy.md: All 11 archetypes (A through K) with copy templates, form specs, verbatim examples from named publications, and conversion expectations.
  • references/mechanisms.md: When to use urgency, scarcity, FOMO, discount, curiosity, reciprocity, social proof, authority, unity. When NOT to use them.
  • references/ab-testing.md: Priority order of variables to test, sample-size rules of thumb, common pitfalls, when to skip A/B testing entirely.
  • references/accessibility.md: WCAG 2.2 specifics for CTA blocks: contrast ratios, touch targets, ARIA patterns, focus states, keyboard support, motion preferences.
  • references/anti-patterns.md: 12 failure modes to call out by name when they apply to the user's inputs.

Operating principles

  • One primary CTA per post. Multiple competing CTAs is the dominant failure mode (single-CTA pages convert ~30%+ better than multi-CTA pages in repeated case studies).
  • Match the voice of the publication. A personal-essay footer that reads like a SaaS landing page collapses credibility. A SaaS footer that reads like a casual signature converts at noise.
  • Specificity beats cleverness. "Get one essay a week on indie filmmaking" beats "Subscribe to our awesome newsletter." Joanna Wiebe's "I want to ___" completion test is the cleanest filter for button copy.
  • Proof co-located with the ask. Subscriber count, testimonial, customer logos, star count, named recommenders — whichever signal is honest for the context, place it inside or adjacent to the CTA block.
  • Mechanisms are tools, not garnish. Most well-written value statements need no mechanism. Add urgency, scarcity, FOMO, or discount only when the context genuinely supports them; theatrical mechanisms erode trust faster than they lift conversion.
  • Push back on bad asks. If the user wants "Book a Demo" at the bottom of a beginner tutorial for first-time visitors, say so. Do not produce a polished version of a CTA that will fail. Propose the alternative, explain why, then if the user still wants the original, deliver it with the failure mode flagged.
1---
2name: copywriting-cta
3description: Designs end-of-article CTAs — copy, layout, placement, A/B test plan, accessibility — for blog posts, newsletters, and essays. Use whenever the user asks to write, review, or improve a CTA at the bottom of an article; mentions "end-of-post CTA", "call-to-action", "signup box", "newsletter CTA", "subscribe block", or "what should I put at the bottom"; or asks how to turn readers into subscribers, leads, customers, or paying supporters. Covers personal blogs, paid newsletters (Substack, beehiiv, Ghost), and brand content-marketing blogs. Do NOT use for opening hooks, ledes, or post titles — use samber/cc-skills@copywriting-hooks instead. Not for landing-page, ad, or email copy.
4user-invocable: true
5license: MIT
6compatibility: Designed for Claude or similar AI agents.
7metadata:
8 author: samber
9 version: "1.1.2"
10 openclaw:
11 emoji: "🎯"
12 homepage: https://github.com/samber/cc-skills
13allowed-tools: Read Edit Write Glob Grep Agent AskUserQuestion
14---
15 
16**Questions:** Ask the user through the environment's question tool — never as plain-text prose. One question at a time, 2–4 tappable options, wait for the answer. If the environment has no question tool, ask in prose with the same options, one at a time.
17 
18# End-of-Article CTA Designer
19 
20Designing an end-of-article CTA is a function of three inputs: the **objective** (what action), the **audience** (who reads it, in what relationship to the author), and the **context** (independent writing, newsletter, brand publication). Get those three right and the copy + form follow almost mechanically. Skip them and you get the universal failure mode: a generic "Subscribe for more" or "Learn More" that converts at the noise floor.
21 
22This skill runs a tight interview to capture those three inputs, then prescribes a CTA: copy (what it says), form (how it looks and sits on the page), mechanism (whether to use urgency, scarcity, curiosity, reciprocity, social proof, or none), an A/B test plan, and an accessibility check.
23 
24---
25 
26## Workflow
27 
28Run the four steps below in order. Do not skip the interview. The user may have given partial context already; pull what's available from the conversation, then ask only for the missing pieces.
29 
30### Step 1 — Interview
31 
32Ask one question at a time. Do not stack questions in prose. Each question must have 2-4 tappable options. Fall back to free text only if the answer genuinely cannot be enumerated.
33 
34Ask these in order, skipping any already answered:
35 
36**Q1. Article context.** Options: `Personal / independent blog or essay` · `Newsletter / paid publication (Substack, beehiiv, Ghost, etc.)` · `Brand / company / content-marketing blog` · `Other (free text)`
37 
38**Q2. Primary objective.** (Pick the one outcome you most want from a reader who finishes the article. If they say "all of them," push back: multiple objectives is the #1 cause of CTA failure.)
39 
40Options:
41 
42- `Newsletter / email subscription`
43- `Social follow / personal branding`
44- `Lead generation (download / gated asset)`
45- `Product or service signup / free trial`
46- `Demo or sales call booking`
47- `Direct purchase`
48- `Community join (Discord / Slack / forum)`
49- `Engagement (reply / comment / share / restack)`
50- `Reader support (paid subscription / tip / sponsorship)`
51- `Try-it / direct action (use the code, run the tool, fork the template, open the calculator)`
52- `Other (free text)`
53 
54If the user lists more than one, ask which is primary. You can offer 1-2 secondaries later, but the primary must be singular.
55 
56**Q3. Audience and relationship.** Options: `First-time visitor (organic search / social)` · `Returning reader, not subscribed` · `Existing subscriber / customer` · `Mixed / unknown`
57 
58**Q4. Funnel stage.** (Where is the reader mentally?) Options: `TOFU: discovery, learning, no buying intent yet` · `MOFU: evaluating options, comparing` · `BOFU: ready to act, just needs a nudge` · `Not applicable (no buying funnel — e.g., personal blog, journalism, hobby content)`
59 
60**Q5. Mechanism preference.** (Only ask if a mechanism could legitimately help. See `references/mechanisms.md`. For sophisticated, skeptical, or repeat-reader audiences, default to "None / value-only" without asking.) Options: `None: value statement only` · `Curiosity gap ("Want to know more?")` · `Reciprocity (free asset first)` · `Discount / offer` · `Urgency (real deadline)` · `Scarcity / FOMO (limited spots)` · `Social proof (count / testimonial)`
61 
62Capture any free-text constraints the user volunteers (length limit, brand voice, no popups, multi-language, etc.). Note them.
63 
64### Step 2 — Diagnose
65 
66Map the inputs to a CTA archetype. The decision logic:
67 
68```
69context = INDEPENDENT / PERSONAL
70├── objective = newsletter / email → Archetype A: Author-signature subscribe
71├── objective = try-it / direct action → Archetype B: Inline action + source link
72├── objective = reader support / tip → Archetype C: Reader-supported funding link
73├── objective = community → Archetype D: Proof-counted community invite
74├── objective = social follow → Archetype A (variant: lead with social links)
75├── objective = engagement → Archetype E: Specific reply prompt
76└── objective = product / demo → ⚠️ FLAG. Only valid on personal/professional
77 blog where the author IS the product
78 (consultants, coaches, solo founders, indie devs).
79 Frame as "if you hit this, here's how I help"
80 — never "Book a Demo" verbatim.
81 
82context = NEWSLETTER PUBLICATION
83├── objective = growth / subs → Archetype F: Share/restack + native widget
84├── objective = engagement → Archetype E: Specific reply prompt
85├── objective = paid conversion → Archetype G: Value-gap tease
86├── objective = monetization / sponsor → Archetype H: Inline sponsor block (not bottom)
87├── objective = community → Archetype D
88└── objective = direct purchase → Archetype K (rare on newsletters; use BOFU only)
89 
90context = BRAND / CONTENT MARKETING
91├── stage = TOFU → Archetype I: Transitional asset (lead magnet)
92├── stage = MOFU → Archetype J: Direct + Transitional pair
93├── stage = BOFU → Archetype K: Direct CTA + risk reversal
94├── objective = community → Archetype D
95└── objective = engagement → Archetype E (rarely the right call here)
96```
97 
98Read `references/taxonomy.md` for the full archetype catalog with copy templates, form specs, when each works, and verbatim examples from named publications.
99 
100### Step 3 — Compose the recommendation
101 
102Output the recommendation in this exact structure. Do not deviate. Do not add filler.
103 
104```markdown
105## Recommended CTA
106 
107**Archetype:** [letter + name from decision tree] **Why this fits:** [1-2 sentences naming the input combination]
108 
109### Content (copy)
110 
111**Headline / value line:**
112 
113> [exact text]
114 
115**Body / proof line (1-2 lines):**
116 
117> [exact text]
118 
119**Button copy:**
120 
121> [exact text]
122 
123**Risk reversal / subtext (if applicable):**
124 
125> [exact text, or "Omit: would feel forced for this audience"]
126 
127### Form (structure)
128 
129- **Placement:** [end-only / end + sticky / end + mid-article repeat]
130- **Visual weight:** [low / medium / high, with justification]
131- **Layout:** [single button / button + text link / native widget cluster / one-line signature]
132- **Proof to co-locate:** [subscriber count / star count / testimonial / named recommenders / logo wall / none]
133 
134### Mechanism
135 
136[Named mechanism + 1 sentence on why it is appropriate, OR "None: value statement carries it. Mechanisms would erode trust for this audience."]
137 
138### A/B test plan
139 
140- **First test:** [single variable, e.g., button copy A vs. B]
141- **Why this one first:** [1 sentence]
142- **Sample size needed:** [rough estimate based on baseline traffic, or "skip A/B for now — traffic too low" with the alternative recommendation]
143- **Next 2 tests to queue:** [in priority order]
144 
145### Accessibility check
146 
147- **Color contrast:** [target ratio + concrete pairing if colors known]
148- **Touch target:** [size requirement]
149- **Semantic markup:** [<button> vs. <a> vs. form]
150- **ARIA:** [only if non-obvious]
151- **Keyboard / focus:** [requirement]
152- **Color-independence:** [non-color affordance]
153```
154 
155After printing the recommendation, list 2-3 anti-patterns the user is at risk of falling into given their inputs, directly, as a contrarian check. Pull these from `references/anti-patterns.md`.
156 
157If the user is writing in a non-English language, translate the content section into that language but keep the structure (headings, labels) in English. Honor formality cues (e.g., `tu` vs. `vous` in French, `du` vs. `Sie` in German) based on prior conversation context, and flag the choice explicitly.
158 
159### Step 4 — Offer next moves
160 
161Suggest 2-3 follow-up directions:
162 
1631. **Steelman the opposite.** Offer to design the CTA you would recommend against — e.g., the hard-sell version on a TOFU post — so the user can see why it fails.
1642. **Variant for a different audience or platform.** If the article will be cross-posted (own site + Medium + LinkedIn + a syndication network), offer to rewrite per platform.
1653. **End-to-end review.** Offer to audit the rest of the article for CTA-supporting signals: author bio, related-post links, in-line proof.
166 
167---
168 
169## Style inheritance
170 
171The copy templates in `references/taxonomy.md` are starting points, not finished copy. Always adapt them to:
172 
173- The user's stated brand voice or any `<userPreferences>` in scope (formality, language, em-dash avoidance, length limits).
174- The language of the article. Output copy in the article's language; never default to English.
175- The publication's existing voice. If the user has prior posts visible, mirror their cadence and vocabulary.
176- The reader's expected level of expertise. A CTA for a beginner-finance blog uses different vocabulary than one for a quant-trading newsletter.
177 
178Never output a template verbatim if it conflicts with the user's stated style preferences.
179 
180---
181 
182## Reference files
183 
184Read these as needed during diagnosis and composition. Read the relevant file in full before composing the recommendation; do not paraphrase from memory.
185 
186- **`references/taxonomy.md`**: All 11 archetypes (A through K) with copy templates, form specs, verbatim examples from named publications, and conversion expectations.
187- **`references/mechanisms.md`**: When to use urgency, scarcity, FOMO, discount, curiosity, reciprocity, social proof, authority, unity. When NOT to use them.
188- **`references/ab-testing.md`**: Priority order of variables to test, sample-size rules of thumb, common pitfalls, when to skip A/B testing entirely.
189- **`references/accessibility.md`**: WCAG 2.2 specifics for CTA blocks: contrast ratios, touch targets, ARIA patterns, focus states, keyboard support, motion preferences.
190- **`references/anti-patterns.md`**: 12 failure modes to call out by name when they apply to the user's inputs.
191 
192---
193 
194## Operating principles
195 
196- **One primary CTA per post.** Multiple competing CTAs is the dominant failure mode (single-CTA pages convert ~30%+ better than multi-CTA pages in repeated case studies).
197- **Match the voice of the publication.** A personal-essay footer that reads like a SaaS landing page collapses credibility. A SaaS footer that reads like a casual signature converts at noise.
198- **Specificity beats cleverness.** "Get one essay a week on indie filmmaking" beats "Subscribe to our awesome newsletter." Joanna Wiebe's "I want to \_\_\_" completion test is the cleanest filter for button copy.
199- **Proof co-located with the ask.** Subscriber count, testimonial, customer logos, star count, named recommenders — whichever signal is honest for the context, place it inside or adjacent to the CTA block.
200- **Mechanisms are tools, not garnish.** Most well-written value statements need no mechanism. Add urgency, scarcity, FOMO, or discount only when the context genuinely supports them; theatrical mechanisms erode trust faster than they lift conversion.
201- **Push back on bad asks.** If the user wants "Book a Demo" at the bottom of a beginner tutorial for first-time visitors, say so. Do not produce a polished version of a CTA that will fail. Propose the alternative, explain why, then if the user still wants the original, deliver it with the failure mode flagged.
202 

Discussion

Alternatives

Also in Blog & articlesSee all 325 in Content creator →