Éditeur de pages

L'éditeur de pages est l'endroit où vous construisez les pages de votre publication - son accueil, une page À propos, une page Par où commencer

• avec des blocs : un hero, du texte, une galerie, vos derniers articles, vos liens. Ce que vous voyez en éditant, c'est ce que vos lecteurs reçoivent.

Ouvrir une page dans l'éditeur

Dans le Studio, ouvrez l'onglet Website et choisissez une page dans sa liste Pages. La page s'ouvre dans l'éditeur, telle que vos lecteurs la verront, avec vos outils par-dessus.

Une page ouverte dans l'éditeur.

Comment une page est construite

Une page est une pile de rangées. Une rangée contient un bloc, ou plusieurs côte à côte : une image à côté d'un texte, trois cartes sur une ligne. Certains blocs prennent toute la rangée, comme Image or video ou un hero pleine image ; d'autres acceptent des voisins. Sur un téléphone, les blocs côte à côte s'empilent les uns sous les autres.

En haut de la page se trouvent son titre, sa description et sa couverture : tapez-les directement. Le titre nomme la page dans la navigation de votre site et dans les résultats de recherche ; la description et la couverture sont ce qu'affiche un lien vers la page quand il est partagé.

Le nom et l'adresse de votre page

Avant les blocs, l'éditeur demande le nom de la page et son adresse. L'adresse est la partie qui suit celle de votre publication : à côté de « votrepublication.peakub.com/ », vous tapez par exemple « about-us ».

• Lettres, chiffres et tirets. Ce que vous tapez est mis en forme au fur et à mesure : minuscules, accents retirés, tout le reste devient un tiret.
• Vérifiée pendant que vous tapez. Une roue d'attente, puis une coche verte quand l'adresse est libre, ou une marque rouge avec la raison quand elle ne l'est pas : une page de votre site l'a déjà, ou le site l'utilise déjà pour autre chose. Un bouton « Utiliser ... » propose alors l'adresse libre la plus proche. Une page ne peut pas rester sans adresse (« Une page a besoin d'une adresse. »).
• Appliquée à la publication. La nouvelle adresse est enregistrée avec la page, mais vos lecteurs gardent l'ancienne jusqu'à ce que vous publiiez : l'éditeur indique « Appliquée à la publication. D'ici là, les lecteurs gardent /ancienne-adresse. ». Ce changement compte parmi ceux à publier.
• L'ancienne adresse fonctionne toujours. Une fois la nouvelle en ligne, un lecteur ou un moteur de recherche qui arrive sur l'ancienne adresse est renvoyé vers la nouvelle : les liens existants ne se cassent pas.

Quand le modèle de la page a une nouvelle mise en page, un bandeau au-dessus du nom propose de l'adopter : voir Ajouter une page.

Enregistrer et publier vos changements

Tout ce que vous changez est enregistré au fur et à mesure : il n'y a pas de bouton Enregistrer. Si un changement ne peut pas être enregistré (vous avez perdu votre connexion, par exemple), l'éditeur vous le dit.

Enregistré ne veut pas dire publié : vos lecteurs voient la page telle qu'elle était jusqu'à ce que vous utilisiez Publier (Publier les modifications, pour une page déjà en ligne), en haut de l'éditeur.

Ajouter un bloc

Utilisez « Add a block here » dans la barre d'outils de l'éditeur, en bas de l'écran, ou le bouton d'ajout d'une rangée pour placer un bloc à côté de ceux qui y sont déjà. La fenêtre d'ajout s'ouvre :

• tapez dans « Search blocks » pour en trouver un par son nom, sa description ou son usage (« bannière », « vidéo », « liens »...)
• ou parcourez : All, Recent (ce que vous avez ajouté récemment), puis un onglet par sorte de bloc : Editorial, Media, Social, Layout, Publication, Content, Community, Book club, Coverages et Events
• chaque bloc montre un petit aperçu de son rendu, son nom et une ligne qui le décrit ; un badge « Blurb » signale les blocs dont le contenu est réutilisable partout (voir Écrire une seule fois, réutiliser partout)

Cliquez sur un bloc pour l'ajouter. Les blocs qui peuvent réutiliser ce que vous avez déjà fait ouvrent d'abord la liste de ce qui existe (voir « Réutiliser ce que vous avez déjà fait » plus bas).

La fenêtre d'ajout : recherche, catégories et aperçus.

Coller un lien ou du texte

Collez une adresse web pendant que vous éditez (Cmd+V ou Ctrl+V) : elle est ajoutée comme Link card, avec l'image, le titre et la description du site. Le lien est gardé dans vos Blurbs, et dans une Link card vous pouvez aussi choisir l'un de vos liens enregistrés (« Modifier le lien » les montre) au lieu de coller une adresse. Collez du texte : il devient un bloc Html. Quand il n'y a pas de place là où vous êtes pour ce bloc, ou qu'aucun bloc ne peut recevoir ce que vous avez collé, l'éditeur vous le dit.

Les commandes d'un bloc

Survolez un bloc (ou une rangée) pour afficher ses commandes :

• la poignée, pour le glisser ailleurs (voir plus bas), et les flèches, pour le monter ou le descendre - ou le déplacer à gauche et à droite dans sa rangée
• l'œil, pour le masquer aux lecteurs sans le supprimer
• dupliquer, pour en ajouter une copie juste après
• supprimer
• les réglages : les options propres au bloc (la mise en page d'une galerie, le trait d'un séparateur...) et, pour un bloc seul dans sa rangée, son ambiance (ci-dessous)

Le nom du bloc et sa commande de changement de mise en page se trouvent à gauche, sur la même ligne (voir « Savoir quel bloc est lequel »).

Donner une ambiance à un bloc

Un bloc seul dans sa rangée peut changer l'allure de toute la page pendant que votre lecteur s'y trouve. Dans ses réglages, sous Ambiance :

• Fond : aucun, une couleur de votre thème, ou votre propre couleur
• En-tête : tel quel, masqué, minimal, ou par-dessus la page, et s'il ne change qu'une fois que le lecteur fait défiler
• Défilement : avec la page, ou de côté, maintenu à l'écran (pour une rangée de cartes)
• Commence quand il atteint : un quart, la moitié ou les trois quarts de l'écran - jusqu'où le bloc doit entrer à l'écran avant que son ambiance prenne le relais

« Back to the block's own » annule vos changements. L'éditeur garde son allure habituelle : ce sont vos lecteurs qui voient l'ambiance.

Réorganiser les blocs d'une page

Survolez un bloc dans l'éditeur de page pour afficher ses commandes. Faites glisser la poignée pour déplacer le bloc n'importe où dans la page en une fois, ou utilisez les flèches haut et bas pour le déplacer d'une place à la fois. Les blocs placés côte à côte se déplacent de la même façon à l'intérieur de leur rangée.

Au clavier : placez le focus sur la poignée, appuyez sur Espace pour saisir le bloc, sur les flèches pour le déplacer, puis de nouveau sur Espace pour le déposer (Échap le remet à sa place). Un bloc verrouillé par le modèle de la page n'a pas de poignée, et rien ne peut être déplacé au-delà. Le nouvel ordre est enregistré automatiquement.

Ajouter une image, une vidéo ou un fichier en le déposant sur la page

Faites glisser un fichier depuis votre ordinateur sur l'éditeur de page. Pendant que vous le déplacez, les blocs s'écartent autour d'un espace en pointillés qui montre où il arrivera : avant ou après le bloc sous votre pointeur. Déposez-le, et l'éditeur choisit le bloc pour vous :

• une image ou une vidéo devient un bloc Image or video
• une adresse web glissée sur la page devient un bloc Link card, et un fichier texte devient un bloc Html
• tout autre fichier (un PDF, un tableur, une archive) devient un bloc File to download, jusqu'à 100 Mo

Vous pouvez ensuite remplacer ce bloc par un autre. Quand l'éditeur ne peut pas placer le bloc attendu à l'endroit où vous avez déposé le fichier (le bloc Image or video ne partage jamais sa rangée avec un autre bloc, par exemple), il vous demande de choisir et ne propose que les blocs capables d'afficher ce fichier :

• Hero (image and text) et Hero (full image) : une image jusqu'à 5 Mo ou une vidéo jusqu'à 50 Mo
• Image or video : une image jusqu'à 10 Mo ou une vidéo jusqu'à 50 Mo
• Gallery : des images jusqu'à 10 Mo ou des vidéos jusqu'à 50 Mo, la première d'une nouvelle galerie

Le nouveau bloc prend la place de l'espace en pointillés, la page défile jusqu'à lui et le fichier est envoyé aussitôt.

Un bloc qui contient déjà une image garde ses propres dépôts : au-dessus de lui, aucun espace ne s'ouvre, et y déposer le fichier remplace son image. Pour ajouter plutôt un nouveau bloc à côté, placez-vous sur le bord haut ou bas du bloc, ou sur le bloc voisin.

Dépôt d'un fichier sur la page : les blocs s'écartent autour d'un espace en pointillés.

Passer un bloc à une autre mise en page

Certains blocs présentent le même contenu dans des mises en page différentes. Hero (image and text) et Hero (full image) contiennent tous deux une image, un titre et une description. Survolez l'un d'eux et utilisez sa commande d'échange, juste après le nom du bloc, pour le transformer en l'autre : l'image et le texte restent tels quels. La commande d'échange n'apparaît que sur les blocs qui ont une autre mise en page possible.

Masquer un bloc à vos lecteurs

Utilisez l'œil dans les commandes d'un bloc pour le masquer à vos lecteurs sans le supprimer. Dans l'éditeur, il reste à sa place, atténué, avec la mention « Hidden from readers », et le même œil le fait réapparaître. Vos lecteurs ne le voient jamais, ni sur votre site ni ailleurs.

Vous repérer dans une longue page

Sur un grand écran, une colonne de petits traits apparaît dans la marge gauche d'une longue page, un trait par section, le plus foncé indiquant où vous êtes. Survolez-la pour voir la liste des sections et cliquez sur l'une d'elles pour vous y rendre. Elle est présente dans l'éditeur de page, sur vos pages publiées et sur vos articles, construite à partir de leurs intertitres. Dans l'éditeur, les blocs masqués sont aussi listés, en texte plus clair.

Savoir quel bloc est lequel

Pendant que vous modifiez, survolez un bloc : son nom apparaît dans une pastille en haut à gauche ("Hero", "Gallery", "File to download"), sur la même ligne que ses autres commandes. Si le bloc peut passer à une autre mise en page, la commande d'échange se place juste après le nom. Un bloc qui contient un blurb réutilisable porte aussi un badge "Blurb".

Étendre un bloc bord à bord

Par défaut, un bloc reste dans la largeur de votre page. Certains blocs peuvent à la place occuper toute la largeur de l'écran : Gallery, Hero (full image), Image or video et Divider, et, si vous le choisissez, Hero (image and text) et Announcement. Ouvrez les réglages du bloc et activez "Bord à bord".

• Gallery, Hero (full image) et Image or video sont bord à bord dès le départ. Vous pouvez le désactiver pour les ramener dans la page.
• Un bloc n'atteint les bords que s'il est seul dans sa rangée. Placez-le dans une rangée avec d'autres blocs, ou dans une colonne ou un conteneur, et il reste dans la page.

Présenter des photos dans une galerie

Le bloc Gallery contient des photos et des vidéos, chacune avec sa légende, sous un nom et une courte description de la galerie. Ouvrez ses réglages pour choisir une mise en page :

• Grille, sur 2, 3 ou 4 colonnes
• Mosaïque, où les photos gardent leurs proportions en colonnes
• Rangées justifiées (par défaut), où chaque rangée est remplie d'un bord à l'autre
• Reportage, avec une grande photo et des plus petites autour
• Rangée horizontale, une seule rangée que l'on fait défiler sur le côté
• Vitrine, où la galerie reste en vue et glisse sur le côté pendant que le lecteur fait défiler la page
• Carrousel, une photo à la fois

Les mises en page Rangée horizontale et Vitrine ont un réglage de hauteur : Plein écran (par défaut), Grand, Moyen ou Petit. Dans une Vitrine, le nom et la description de la galerie restent en place au-dessus des photos pendant qu'elles défilent.

Vous pouvez afficher les légendes sous les photos ou sur les photos, ou les masquer, et les montrer au survol (par défaut) ou en permanence. L'espace entre les photos se règle aussi, jusqu'à zéro.

Un clic sur une photo l'ouvre en plein écran : la photo grandit depuis sa vignette, vous passez d'une photo à l'autre avec les flèches, et Échap la ferme. L'étoile sur une photo, ou la commande de couverture de la galerie, définit la couverture que la galerie affiche dans le Studio et dans les aperçus de lien.

Une galerie et ses mises en page dans les réglages du bloc.

Proposer un fichier à télécharger

Le bloc File to download donne à vos lecteurs un PDF, un tableur, une archive ou n'importe quel autre fichier tel quel. Il s'affiche comme une carte en forme de feuille au coin replié, avec le nom du fichier, une légende, son type et sa taille. Les lecteurs le téléchargent, ils ne l'ouvrent pas dans la page.

Vous pouvez donner à la carte une couverture de votre choix. Sans couverture, elle montre l'image du fichier quand c'est une image, et sinon une grande icône du type de fichier. Pour en ajouter un, déposez-le sur la page : tout fichier qui n'est ni une image, ni une vidéo, ni un texte devient un bloc File to download.

Toute personne qui peut voir la page peut télécharger le fichier. Vous ne pouvez pas encore réserver un téléchargement aux abonnés.

Réutiliser ce que vous avez déjà fait

Quand vous ajoutez un hero, une galerie, une annonce ou un bloc Html, la fenêtre d'ajout commence par "Partir de zéro", suivie de ceux que votre publication possède déjà. Choisissez-en un pour partir de lui plutôt que de rien. Les blocs article, couverture et zine proposent de la même façon ceux qui existent déjà.

Ce que vous réutilisez est un blurb : le modifier change toutes les pages, tous les zines et toutes les listes qui l'utilisent, et l'éditeur du blurb vous dit où il sert d'autre part.

Séparer des sections avec un séparateur

Le bloc Divider trace une ligne sur la page. Ses styles sont Ligne, Tirets, Points, Zigzag et Vague. La Vague est une bande pleine à la houle lente, qui reste immobile pour les lecteurs dont l'appareil demande moins d'animations. Un séparateur peut aussi s'étendre bord à bord.

Mettre vos articles épinglés sur une page

Le bloc Pinned stories affiche les articles que vous avez épinglés sur votre publication, le premier aussi haut que l'écran et gardé en vue pendant que les autres défilent à côté. Voir Épingles pour choisir ce qui est épinglé.

Montrer votre publication en double page

Le bloc Publication spread présente votre publication comme la double page d'un magazine. Sur la page de gauche, sa couverture : votre bannière, votre icône, votre nom et votre description, avec un moyen de s'abonner. Sur la page de droite, qui est abonné, ce qu'elle contient (les fonctionnalités que vous avez activées : Articles, Club de lecture, Événements, Couvertures, Zines) et vos rubriques. Vos lecteurs cliquent dessus pour aller à votre publication.

Il prend la largeur de la page ou un peu moins, et n'a pas de voisins dans sa rangée. Vous pouvez l'utiliser sur une page ou dans un zine. Il n'a aucun réglage : il montre toujours votre propre publication.

Les blocs que vous pouvez ajouter

• Editorial : Hero (image and text), Hero (full image), Announcement, Html, Visual, Emphasized text
• Media : Image or video, Gallery, File to download, Link card, et des vidéos (Video, Avatar video, Story, Video full canvas)
• Social : Links (une liste de liens à la Linktree), Social (Auto), qui reconnaît la plateforme à partir de l'adresse donnée, et un bloc par plateforme (YouTube, Vimeo, Spotify, SoundCloud, Instagram, TikTok, Bluesky, Mastodon, Threads, Substack et d'autres)
• Layout : Divider, Horizontal showcase
• Content : vos articles, zines et visuels : un article ou un zine choisi, le dernier paru, une mise en avant, une grille, une liste, les plus lus, un fil
• Publication : les unes Home news, Pinned stories, Most popular, Top members-only exclusives, Publication excerpt, Contributors et Leaderboard, Recommendations, Socials, Publication spread, Rubric stories (une de vos rubriques) et Series parts (une de vos séries)
• Community : Comments
• Book club, Coverages, Events : les blocs de chacun (le livre en cours, les livres à venir et déjà lus, une couverture, la dernière couverture...)