Personnalisation de la marque

Branding contrôle les éléments visuels que les lecteurs voient en premier : logos, favicons et liens de navigation. Tout prend en charge les variantes mode clair/sombre.

Logo

Ajoutez votre logo dans l'en-tête de navigation :

{
  "logo": {
    "light": "/images/logo-light.webp",
    "dark": "/images/logo-dark.webp",
    "href": "https://yourcompany.com"
  }
}

Dimensions du logo

Les logos sont affichés à une largeur maximale de 120px. Pour de meilleurs résultats :

• Largeur : 120-240px
• Hauteur : 30-40px
• Format : SVG de préférence

Favicon

Une seule image pour les deux modes :

{
  "favicon": "/images/favicon.svg"
}

Ou une variante distincte pour chaque mode :

{
  "favicon": {
    "light": "/images/favicon.svg",
    "dark": "/images/favicon-dark.svg"
  }
}

Le favicon light est affiché en mode clair ; dark est affiché en mode sombre. dark est facultatif — s'il est omis, light est utilisé dans les deux modes. Jamdesk émet un <link rel="icon"> pour le favicon principal, ainsi qu'un second lien avec media="(prefers-color-scheme: dark)" pour la variante sombre.

Formats pris en charge : SVG, PNG, ICO.

Nom du site

Le champ name apparaît dans les onglets du navigateur et les résultats de recherche :

{
  "name": "Acme Docs",
  "description": "Documentation for the Acme API"
}

Liens de navigation

Ajoutez des liens à votre barre de navigation :

{
  "navbar": {
    "links": [
      { "label": "Blog", "href": "https://yourcompany.com/blog" },
      { "label": "Pricing", "href": "https://yourcompany.com/pricing" }
    ],
    "primary": {
      "type": "button",
      "label": "Get Started",
      "href": "https://app.yourcompany.com/signup"
    }
  }
}

Options des liens

Bouton principal

Le champ primary crée un bouton d'appel à l'action mis en évidence :

{
  "primary": {
    "type": "button",
    "label": "Dashboard",
    "href": "https://app.yourcompany.com"
  }
}

Pied de page

Ajoutez des liens sociaux et des colonnes de liens personnalisées au pied de page de votre documentation.

Liens sociaux

Affichez des icônes de réseaux sociaux en bas de chaque page :

{
  "footer": {
    "socials": {
      "github": "https://github.com/yourcompany",
      "x": "https://x.com/yourcompany",
      "discord": "https://discord.gg/yourserver",
      "linkedin": "https://linkedin.com/company/yourcompany"
    }
  }
}

Plateformes prises en charge

Colonnes de liens

Ajoutez des groupes de liens organisés au-dessus de vos icônes sociales :

{
  "footer": {
    "links": [
      {
        "header": "Resources",
        "items": [
          { "label": "Blog", "href": "https://yourcompany.com/blog" },
          { "label": "Changelog", "href": "/changelog" }
        ]
      },
      {
        "header": "Company",
        "items": [
          { "label": "About", "href": "https://yourcompany.com/about" },
          { "label": "Careers", "href": "https://yourcompany.com/careers" }
        ]
      }
    ],
    "socials": {
      "github": "https://github.com/yourcompany",
      "x": "https://x.com/yourcompany"
    }
  }
}

Masquer le pied de page sur des pages spécifiques

Utilisez le frontmatter pour masquer le pied de page sur des pages individuelles :

---
title: Landing Page
hideFooter: true
---

Cela est utile pour les pages de destination personnalisées ou les pages où le pied de page serait distrayant.

Branding Jamdesk

Par défaut, un lien « Propulsé par Jamdesk » apparaît dans le pied de page de vos pages de documentation. Cela contribue à faire connaître Jamdesk tout en conservant un aspect professionnel à votre documentation.

Masquer le branding

Pour supprimer le branding Jamdesk :

1. Accédez à Paramètres dans votre dashboard Jamdesk
2. Trouvez la section Paramètres de build
3. Désactivez Afficher le branding Jamdesk
4. Déclenchez un nouveau build

Exemple complet de branding

Voici une configuration de branding complète :

{
  "name": "Acme Documentation",
  "description": "Build amazing products with Acme",
  "theme": "jam",
  "colors": {
    "primary": "#6366F1",
    "light": "#818CF8",
    "dark": "#4F46E5"
  },
  "favicon": "/images/favicon.svg",
  "logo": {
    "light": "/images/logo-dark.webp",
    "dark": "/images/logo-light.webp",
    "href": "https://acme.com"
  },
  "navbar": {
    "links": [
      { "label": "API", "href": "/api/overview" },
      { "label": "Blog", "href": "https://acme.com/blog" }
    ],
    "primary": {
      "type": "button",
      "label": "Sign Up",
      "href": "https://app.acme.com/signup"
    }
  },
  "footer": {
    "socials": {
      "github": "https://github.com/acme",
      "x": "https://x.com/acme",
      "discord": "https://discord.gg/acme"
    },
    "links": [
      {
        "header": "Resources",
        "items": [
          { "label": "Blog", "href": "https://acme.com/blog" },
          { "label": "Status", "href": "https://status.acme.com" }
        ]
      }
    ]
  }
}

Domaine personnalisé

Ajoutez votre domaine dans le dashboard Jamdesk :

1. Accédez à Paramètres → Domaines
2. Ajoutez votre domaine (ex. docs.yourcompany.com)
3. Configurez le DNS comme indiqué
4. Attendez la vérification

Votre documentation sera accessible à votre domaine personnalisé avec SSL automatique.

Prochaines étapes