One-page

O template one-page gera um site institucional de uma página só, com menu de âncoras, do topo ao rodapé. Ele não tem modelos: o projeto sai com o conteúdo de exemplo do template, e o contato é sempre o WhatsApp.

Criar o projeto

Rode slash create <pasta> --template one-page na pasta onde o projeto deve ficar. A saída é esta:

Projeto criado em <projeto>.
Próximos passos, dentro da pasta:
  slash check                     confere conteúdo, contraste e SEO
  slash approve                   libera o conteúdo fictício aprovado
  bun run dev                     servidor local
  slash verify --update-baseline  grava as bases visuais e verifica tudo
[saída: 0]

Como o template não tem modelos, --model é recusado com a mensagem que começa com «o template one-page não tem modelos; rode sem —model».

Seções da página

A página tem as seções abaixo, de cima para baixo. Cada uma tem uma página de referência em Criar › Seções.

1. Cabeçalho com o menu: Cabeçalho.
2. Hero, com fotos de fundo: Hero.
3. Sobre: Sobre.
4. Serviços, em cartões: Cartões.
5. Galeria de fotos: Galeria de fotos.
6. Depoimentos: Depoimentos.
7. Perguntas frequentes: Perguntas frequentes.
8. Contato, com endereço, horário e mapa: Localização.
9. Chamada final: Chamada final.

Depois da última seção vêm o rodapé (Rodapé), o botão flutuante do WhatsApp (Botão do WhatsApp) e o aviso de cookies (Aviso de cookies).

Diferença para a landing

A landing é uma página de venda, com modelo padrão vendas. No modelo vendas ela não tem menu, então a página abre direto no Hero. A sequência do modelo vendas é Hero, Features, FeatureSplit, Sobre, Depoimentos, Preços, Perguntas frequentes e Chamada final. Não tem galeria, cartões de serviço nem a seção de localização. O formulário de lead aparece só no modelo captura.

O que editar

• src/data/content.ts: textos e props de cada seção. Valores marcados com claude(...), fictitious(...) ou pending(...) ainda precisam da sua revisão. Troque pelo texto real e tire o marcador.
• src/data/site.ts: nome, endereço, horário, WhatsApp, GTM e SEO.
• src/theme.ts: cores, fontes e raio. É o único arquivo de cores.
• src/pages/home.ts: a ordem das seções e a variante de cada uma. Para trocar a ordem, mova a linha da seção. Variante inexistente ou prop faltando é erro de compilação (bun run typecheck).
• public/placeholder/: imagens de exemplo. Troque pelas reais.

src/pages/home.ts do template, com as seções na ordem da página:

src/pages/home.ts

import type { SafeHtml } from "@_bashell/slash/ssr";
import { content } from "../data/content";
import { plain } from "../data/origin";
import { site } from "../data/site";
import {
  About,
  Cards,
  ConsentBanner,
  CtaSection,
  Faq,
  Footer,
  type FooterProps,
  faqSchema,
  footerSchema,
  gtmBody,
  Header,
  Hero,
  html,
  jsonLd,
  Locations,
  locationsSchema,
  PhotoGallery,
  sitePage,
  Testimonials,
  trackMarker,
  utmMarker,
  WhatsappFab,
  whatsappHref,
} from "../ui";
import { uiHost } from "../ui-host";

const c = plain(content);
const s = plain(site);

const footer: FooterProps = { ...c.footer, business: s.business };

/** Id of the GTM container, shared with the head (routes.ts). */
export const gtm = { id: s.gtmId } as const;

/** JSON-LD graph of the page, built from the same content the sections render. */
export const structuredData = jsonLd(
  faqSchema(c.faq),
  locationsSchema(c.locations, s.name),
  footerSchema(footer, s.baseUrl),
);

/** The one-page site, sections in the spec order; each one has the id the anchors of the header point at. */
export function home(): SafeHtml {
  return sitePage({
    before: [gtmBody(gtm)],
    header: Header(c.header, uiHost),
    main: html`${[
      Hero(c.hero, uiHost),
      About(c.about, uiHost),
      Cards(c.services, uiHost),
      PhotoGallery(c.gallery, uiHost),
      Testimonials(c.testimonials, uiHost),
      Faq(c.faq, uiHost),
      Locations(c.locations, uiHost),
      CtaSection(c.cta, uiHost),
    ]}`,
    footer: Footer(footer, uiHost),
    fab: WhatsappFab({ href: whatsappHref(s.whatsapp.number, s.whatsapp.message), label: "Falar no WhatsApp" }, uiHost),
    after: [ConsentBanner(c.consent, uiHost), utmMarker(uiHost), trackMarker(uiHost)],
  });
}

Não edite src/ui/: é a cópia dos componentes, com a versão em src/ui/VERSION. Para uma seção nova ou uma mudança nos componentes, peça ao fornecedor.

Menu e âncoras

O menu do topo rola até as seções da página. Cada seção tem um id em src/data/content.ts (sobre, servicos, galeria, depoimentos, duvidas, contato), e cada link de header.links aponta para um deles, como #sobre. Ao renomear ou mover uma seção, mantenha o id e o link iguais. O teste E2E do template confere que cada âncora leva à sua seção.

WhatsApp

O número e a mensagem ficam em whatsapp, em src/data/site.ts. O menu, o topo, a seção de contato, a chamada final e o botão flutuante usam o mesmo link. Para outro canal, peça ao fornecedor.

Conferir antes de publicar

slash check confere conteúdo, contraste e SEO. slash approve libera o conteúdo fictício que você aprovou. slash verify roda a verificação completa.