kagadmodyaa

Newsletter 01

New
Contact 04Newsletter 02

An inline newsletter band with a heading, one line, an email field and button, a privacy line, validation and a confirmation.

Installation

pnpm dlx shadcn@latest add https://kagadmodyaa.vercel.app/r/newsletter-01.json

Needs a React + Tailwind project set up with shadcn. Copies the block's files into your project, along with the components it uses, so you can edit all of it.

Usage

This block is a section, not a page. Import it where you want it, alongside your other sections.

import { Newsletter01 } from '@/components/newsletter-01/newsletter-01'

export default function Page() {
  return (
    <main>
      <Newsletter01 />
    </main>
  )
}

Files

What the command adds to your project, and where.

  • components/newsletter-01/newsletter-01.tsx

    The section. Import it into any page and render it; it fills the width of its parent.

It also installs the components it is built from, unless you already have them: Button, Input, Label, Spinner.

Links, copy and the product name are placeholders; swap in your own. Where a block has a form, its submit handler is a stub for your own request.

More in Newsletter

See all 3 Newsletter blocks