Page d’offre.

01

Le gabarit.

Sept blocs, dans cet ordre, pour les six fiches. Le nom, le titre et la phrase viennent de la copie de l’accueil ; le corps, le profil, la durée, les outils, les références et les questions viennent de la fiche markdown ; les libellés de pages-v3. La page n’écrit rien d’elle-même.

Les six pages sont construites sur ce gabarit. Ce qui reste en attente est la copie : celle des cartes et celle des pages, tenues par la session sémantique, en attente de validation.

02

L’en-tête avec scène.

Le fil d’Ariane, le titre, le chapô, les deux boutons ; à droite, la scène de l’offre dans sa cellule pâle, annotée de ses outils. Dès 900 px, le texte et la scène se partagent la grille en 1,1fr / 1fr.

Un site qui transforme les visites en demandes.

Trouvé sur Google, et simple à mettre à jour vous-même.

Démarrer un projet ↗ Voir les autres offres ↗

AstroWordPressStoryblok

<EnTetePage
  fil={[{ href: '/offres/', libelle: 'Offres' }, { href: '/offres/site-internet/', libelle: 'Site internet' }]}
  titre="Un site qui fait sonner votre téléphone."
  lead="Pour qu’on vous trouve sur Google, et qu’on vous appelle."
  scene="site-internet"
  principal={{ href: '#contact', libelle: V3.cta }}
  secondaire={{ href: '/offres/', libelle: 'Voir les autres offres' }}
>
  <Fragment slot="puces">
    {d.technos.slice(0, 3).map((t, k) => {
      const a = ancree(offre.id, ANCRES_OFFRES[offre.id]?.[k], 'entete')
      return a && <Puce {...a} vert={k === 1} n={k}>{t}</Puce>
    })}
  </Fragment>
</EnTetePage>

03

Les preuves.

Les réalisations que la fiche cite, dans la grille des cas : l’offre en étiquette, le client en titre, une phrase quand la fiche en a une, et la photo du produit en service, ou sa réserve. Ici, les deux premières références de la fiche Site internet.

<Tete variante="ligne" etiquette="Réalisations" titre="Ils nous ont confié ce type de projet.">
  <Bouton href="/realisations/" variante="trait">Voir les réalisations</Bouton>
</Tete>
<Grille classe="tr-cas">
  <Cas photo="mes-jardiniers" nom="Mes Jardiniers" etiquette="Site internet et outil de gestion" statut="à obtenir" />
</Grille>

04

Le suivi et les questions.

Les trois colonnes du suivi, les mêmes que sur l’accueil, puis les questions de la fiche, une cellule chacune, qui s’ouvrent sans script.

<Tarifs colonnes={ V3.suivi.colonnes } />
<Faq questions={ d.faq } />

RègleUne page d’offre ne dit rien que sa fiche et la copie ne disent : ce qui manque s’affiche en attente, jamais inventé.