Personnaliser l'apparence d'un site de documentation
Définissez le logo, la favicône, la couleur de la marque, les polices, les coins, le thème par défaut et l'en-tête de la page d'accueil d'un site de documentation, et choisissez si le badge « Powered by Clevera » doit s'afficher. Prévisualisez chaque modification avant d'enregistrer et de publier.
Apparence contrôle l'aspect de votre site de documentation pour les lecteurs : le logo et la favicône, une couleur de marque, les polices, la forme des coins, le thème clair ou sombre par défaut et l'en-tête de votre page d'accueil. Chaque modification apparaît dans un aperçu en direct au fur et à mesure, et devient effective lors de votre prochaine publication.
Avant de commencer
- Les propriétaires, administrateurs et éditeurs peuvent modifier l'apparence. Les autres voient le message « Seuls les administrateurs et les éditeurs peuvent modifier l'apparence du site. »
- Un site en pause est en lecture seule : « Ce site est en pause. Reprenez-le pour modifier son apparence. »
- Le nom du site est défini dans Paramètres → Général, pas ici.
Modifier l'apparence
Ouvrir Apparence
Ouvrez votre site de documentation et accédez à Apparence sous Site. Le formulaire se trouve à gauche et l'Aperçu en direct à droite. Sur une fenêtre étroite, cliquez sur Prévisualisation pour l'ouvrir.
L'écran Apparence avec son aperçu en direct Effectuer vos modifications
Parcourez les sections ci-dessous. L'aperçu se met à jour au fur et à mesure que vous saisissez vos informations.
Vérifier l'aperçu
Basculez l'aperçu entre Ordinateur et Téléphone, Clair et Sombre, et entre la page Accueil et une page Article.
Enregistrer et publier
Une barre affiche Modifications non enregistrées avec Ignorer et Enregistrer. Cliquez sur Enregistrer, puis publiez le site pour mettre en ligne le nouveau look. Si la publication automatique est activée, le site sera mis à jour automatiquement quelques minutes plus tard.
Si vous quittez la page avec des modifications non enregistrées, Clevera vous demandera confirmation avant que vous ne les perdiez.
Logo et favicône
« PNG, JPG, WebP ou SVG, jusqu'à 2 Mo. »
| Emplacement | À quoi cela sert-il | Si vide |
|---|---|---|
| Arrière-plan clair | Le logo dans l'en-tête en mode clair | Le nom du site s'affiche sous forme de texte (« Nom du site sous forme de texte ») |
| Arrière-plan sombre | Le logo en mode sombre | « Utilise le logo clair » |
| Favicône | La petite icône dans l'onglet du navigateur | « À partir de votre logo » |
Chaque emplacement dispose de Importer, Remplacer et Supprimer. « Nous utilisons le logo clair sur les arrière-plans sombres si vous ignorez le logo sombre. La favicône provient de votre logo, sauf si vous en importez une. »
Couleur
« Une couleur de marque pour les boutons, les liens et les éléments mis en avant. »
- Cliquez sur l'un des 8 échantillons, ou utilisez le sélecteur de couleur pour « Choisir ou coller n'importe quelle couleur » sous forme de valeur hexadécimale telle que
#2563eb. La valeur par défaut est#4f46e5. - Activez Définir une couleur pour le mode sombre pour choisir la couleur utilisée sur les arrière-plans sombres. Désactivé : « Sinon, nous éclaircissons votre couleur pour les arrière-plans sombres. » La couleur dérivée s'affiche en tant qu'Automatique avec sa valeur hexadécimale.
- Une note sur le contraste ci-dessous vérifie vos liens. « Les liens sont bien lisibles sur les arrière-plans clairs et sombres » signifie que tout est correct ; « Les liens peuvent être difficiles à lire. Nous les assombrirons légèrement » signifie que le site ajuste la couleur des liens pour la lisibilité.
Typographie
« Des associations populaires qui fonctionnent dans toutes les langues, ou n'importe quelle police Google. »
| Association | Titres | Corps de texte |
|---|---|---|
| Inter (par défaut) | Inter | Inter |
| Geist | Geist | Geist |
| Manrope | Manrope | Manrope |
| Plus Jakarta Sans | Plus Jakarta Sans | Plus Jakarta Sans |
| DM Sans | DM Sans | DM Sans |
| IBM Plex Sans | IBM Plex Sans | IBM Plex Sans |
| Space Grotesk + Inter | Space Grotesk | Inter |
| Source Serif + Sans | Source Serif 4 | Source Sans 3 |
Pour autre chose, cliquez sur Plus de polices… et choisissez n'importe quelle police Google pour les Titres, le Corps de texte ou les deux. La liste commence par les polices les plus populaires ; tapez pour effectuer une recherche par nom. Chaque police affiche son style : Sans empattement, Empattement, Affichage, Écriture manuscrite ou Monospace.
« N'importe quelle police Google. Nous l'hébergeons avec votre site, afin que les lecteurs ne la chargent jamais depuis Google. Les langues pour lesquelles elle n'est pas disponible utilisent l'association. » Donc, si votre police ne contient pas de caractères japonais, les pages japonaises reviendront à l'association que vous avez choisie.
Forme et thème
| Paramètre | Options | Par défaut |
|---|---|---|
| Coins | Netteté, Doux, Arrondi : l'arrondi des boutons, cartes et boîtes | Doux |
| Thème par défaut | Système (suit l'appareil du lecteur), Clair, Sombre. « Les lecteurs peuvent le changer dans l'en-tête. » | Système |
En-tête de la page d'accueil
Accueil définit « Le haut de la page d'accueil de votre site. »
| Champ | Ce qu'il fait | Par défaut |
|---|---|---|
| Titre | Le grand titre, jusqu'à 120 caractères | Le nom de votre site |
| Sous-titre | La ligne en dessous, jusqu'à 300 caractères | Vide |
| Champ de recherche | Un champ de recherche sous le titre | Activé |
| Arrière-plan | Ce qui se trouve « Derrière le titre et le champ de recherche. » | Dégradé (Lueur douce) |
Le Titre et le Sous-titre peuvent différer selon la langue : ouvrez Autres langues sous le champ, ou cliquez sur Traduire vers toutes les langues pour remplir gratuitement les langues manquantes. Les langues vides affichent le texte de la langue par défaut.
Arrière-plan
« Les couleurs du texte s'ajustent pour rester lisibles, en mode clair et sombre. » Une lecture du contraste telle que « Contraste du titre · Clair 7.1:1 · Sombre 9.4:1 » montre à quel point le titre est lisible.
| Option | Choix |
|---|---|
| Simple | Aucune couleur, aucun dégradé ou image derrière le titre |
| Couleur | Une teinte ou une nuance « Suggérée à partir de votre couleur de marque, ou choisissez-en une. » : Teinte pâle, Teinte claire, Teinte douce, Couleur de la marque, Nuance profonde, Encre, Papier, Charbon |
| Dégradé | Lueur douce, Lavage, Aurore, Lever de soleil, Marque, Minuit, Brume, Sable, Graphite |
| Image | Un motif dessiné (Vagues, Maillage, Points, Plan, Contours, Anneaux, Lignes, Constellation) ou Votre propre image |
Les motifs suivent votre couleur de marque et sont disponibles sur tous les plans. Votre propre image nécessite le plan Starter ou supérieur : « PNG, JPG ou WebP jusqu'à 8 Mo. Les images larges fonctionnent mieux ; nous les redimensionnons et les compressons pour les lecteurs. » Elle est « Affichée à la place d'un motif, assombrie pour que le titre reste lisible. »
Badge
Afficher « Powered by Clevera » ajoute « Un petit badge dans le pied de page. »
| Plan | Badge |
|---|---|
| Gratuit | Toujours affiché ; l'interrupteur est verrouillé |
| Starter, Pro, Business, Custom | Activé par défaut ; désactivez-le pour le masquer |
Ce que chaque plan inclut
| Option | Gratuit | Starter et supérieur |
|---|---|---|
| Logo, favicône, couleurs, polices, coins, thème | Oui | Oui |
| Arrière-plan accueil : simple, couleur, dégradé, motif | Oui | Oui |
| Arrière-plan accueil : votre propre image | Non | Oui |
| Masquer le badge | Non | Oui |
Consultez Plans et limites des sites de documentation pour tout le reste.
Dépannage
| Vous voyez | Que faire |
|---|---|
| « Cette image dépasse 2 Mo. » | Réduisez la taille du logo ou enregistrez-le au format WebP ou SVG. Une image d'accueil peut aller jusqu'à 8 Mo. |
| « Utilisez une image PNG, JPG, WebP ou SVG. » | Les logos et favicônes n'acceptent que ces types. Les images d'accueil acceptent PNG, JPG ou WebP. |
| « Nous n'avons pas pu utiliser cette image. Essayez un PNG ou JPG. » | Le fichier n'a pas pu être lu. Exportez-le à nouveau en PNG ou JPG. |
| « Cette image n'a pas été importée. Réessayez. » | L'importation a été interrompue. Réessayez. |
| « Impossible d'enregistrer l'apparence. Réessayez. » | Rien n'a été enregistré. Vérifiez tout champ marqué en rouge, puis cliquez à nouveau sur Enregistrer. |
| « La liste des polices n'a pas pu être chargée. » | Cliquez sur Réessayer. Vos polices actuelles restent telles quelles. |
| Le site en direct affiche toujours l'ancien look | L'enregistrement ne publie pas. Cliquez sur Publier en haut du site. |