Contact page

Contact information page at /contact — a simple list of email addresses with no required components.

The contact sub-page renders contact information at /contact. The default implementation is a plain list of email addresses — replace it with a form or anything else your stack supports.

Route control

The route comes from src/pages/contact.astro, not a YAML page flag. pages.contact does not create or suppress it. See Pages for current route controls and limits.

Starter implementation

The company-site template scaffolds src/pages/contact.astro:

---
import BaseLayout from '@publier/shell/layouts/base-layout.astro';
---

<BaseLayout title="Contact — My Company" description="Sales, support, and general inquiries.">
  <main class="max-w-xl mx-auto my-12 px-6 prose">
    <h1>Contact</h1>
    <ul>
      <li><strong>Sales:</strong> <a href="mailto:sales@example.com">sales@example.com</a></li>
      <li><strong>Support:</strong> <a href="mailto:support@example.com">support@example.com</a></li>
      <li><strong>Press:</strong> <a href="mailto:press@example.com">press@example.com</a></li>
      <li><strong>Security:</strong> <a href="mailto:security@example.com">security@example.com</a></li>
    </ul>
    <p>We aim to respond within 1 business day.</p>
  </main>
</BaseLayout>

Adding a contact form

Replace the email list with a Qwik component$() form that posts to your backend or a form service:

---
import ContactForm from '../components/ContactForm';
import BaseLayout from '@publier/shell/layouts/base-layout.astro';
---

<BaseLayout title="Contact — My Company">
  <main class="max-w-xl mx-auto my-12 px-6">
    <h1>Contact</h1>
    <ContactForm />
  </main>
</BaseLayout>

Create src/components/ContactForm.tsx as a Qwik component$() with useSignal state for the form fields.