Personnalisation de la marque

​

En-tête

Dans cette section, nous verrons comment personnaliser les éléments clés de votre instance sur site. Vous pouvez personnaliser le titre du site, les liens de navigation, l’en-tête, le pied de page et le logo selon vos préférences.

​

Titre du site

Le titre de la barre de navigation peut être personnalisé avec la variable d’environnement OVERLEAF_NAV_TITLE ; ce texte est affiché dans le coin supérieur gauche de la navigation si aucun logo n’est défini.

# add to config/variables.env
OVERLEAF_NAV_TITLE=Our Overleaf Instance

​

Logo

Vous pouvez ajouter un logo personnalisé à la place du texte en définissant la variable d’environnement OVERLEAF_HEADER_IMAGE_URL. Cette valeur doit pointer vers un fichier image hébergé à l’extérieur.

config/variables.env

# add to config/variables.env
OVERLEAF_HEADER_IMAGE_URL=https://mysite.somewhere.com/img/logo.png

​

Logos pour les thèmes clair et sombre

À partir de la version 6.3.0, vous pouvez définir des logos distincts pour les thèmes clair et sombre avec les variables d’environnement OVERLEAF_HEADER_IMAGE_URL_LIGHT et OVERLEAF_HEADER_IMAGE_URL_DARK. Les deux valeurs doivent pointer vers un fichier image hébergé à l’extérieur.

# add to config/variables.env
OVERLEAF_HEADER_IMAGE_URL_LIGHT=https://mysite.somewhere.com/img/logo-light.png
OVERLEAF_HEADER_IMAGE_URL_DARK=https://mysite.somewhere.com/img/logo-dark.png

Si l’une de ces variables n’est pas définie, le thème correspondant utilise le logo défini dans OVERLEAF_HEADER_IMAGE_URL.

​

Liens de navigation de l’en-tête

Des éléments de navigation supplémentaires peuvent être ajoutés à l’en-tête de navigation en définissant la variable d’environnement OVERLEAF_HEADER_EXTRAS sur un tableau JSON d’objets. Par exemple :

[\
  {\
    "text": "Some link",\
    "url": "http://example.com/somelink",\
    "class": "subdued",\
    "only_when_logged_out": true\
  },\
  {\
    "text": "Help",\
    "class": "subdued",\
    "dropdown": [\
      {\
        "text": "Documentation",\
        "url": "/learn"\
      },\
      {\
        "text": "Contact Admin",\
        "url": "http://example.com/contact"\
      }\
    ]\
  }\
]

Ajoutez la forme JSON échappée dans toolkit/variables.env :

toolkit/variables.env

# add to toolkit/variables.env
OVERLEAF_HEADER_EXTRAS=[{"text":"Some link","url":"http://example.com/somelink","class":"subdued","only_when_logged_out":true},{"text":"Help","class":"subdued","dropdown":[{"text":"Documentation","url":"/learn"},{"text":"Contact Admin","url":"http://example.com/contact"}]}]

​

Pieds de page

Il est possible de personnaliser le pied de page gauche ainsi que le pied de page droit, plus petit (visible sur des pages comme /project), à l’aide des variables d’environnement OVERLEAF_LEFT_FOOTER et OVERLEAF_RIGHT_FOOTER. Les deux attendent un tableau d’objets JSON qui seront insérés.

Les deux attendent un tableau JSON qui sera inséré.

[\
  {\
    "text": "This is an example text footer entry!"\
  },\
  {\
    "text": "This is an example URL footer link!", "url" : "/my-first-link.htm"\
  }\
]

Lorsque vous utilisez uniquement text, la valeur ne doit pas contenir de HTML, car elle sera affichée comme texte brut.

Ces données doivent être du JSON valide pour fonctionner, avec des guillemets échappés lorsqu’elles sont transmises via une variable d’environnement.

config/variables.env

# add to config/variables.env
OVERLEAF_LEFT_FOOTER=[{"text": "This is an example text footer entry!"}]
OVERLEAF_RIGHT_FOOTER=["text": "This is an example URL footer link!", "url" : "/my-first-link.htm"]

En plus de text et url, l’objet JSON accepte également les propriétés class et label pour une personnalisation supplémentaire.

​

Page de maintenance

Vous pouvez personnaliser le message affiché sur la page de maintenance avec la variable d’environnement OVERLEAF_MAINTENANCE_MESSAGE ; ce texte remplace le message par défaut sous le titre de la page.

# add to config/variables.env
OVERLEAF_MAINTENANCE_MESSAGE=Our Overleaf Instance is down for maintenance and will be back shortly.

Pour inclure des liens ou une autre mise en forme, utilisez plutôt OVERLEAF_MAINTENANCE_MESSAGE_HTML. Si les deux sont définies, OVERLEAF_MAINTENANCE_MESSAGE_HTML est prioritaire.

# add to config/variables.env
OVERLEAF_MAINTENANCE_MESSAGE_HTML=Our Overleaf Instance is down for maintenance. For urgent requests, contact <a href="mailto:[e-mail]">[e-mail]</a>.

OVERLEAF_MAINTENANCE_MESSAGE est affiché en texte brut ; il ne doit donc pas contenir de HTML. OVERLEAF_MAINTENANCE_MESSAGE_HTML est affiché en HTML sans échappement.

Si aucune des deux n’est définie, le message par défaut renvoie vers votre page d’état lorsque OVERLEAF_STATUS_PAGE_URL est définie, et affiche l’adresse e-mail de l’administrateur dans le cas contraire.