Configurer des emojis personnalisés

:bookmark: Ce guide explique comment personnaliser les emojis sur votre site Discourse via des ensembles d’emojis sélectionnables, le téléchargement de nouveaux emojis, la configuration des paramètres du site et l’ajustement de la taille des emojis.

:person_raising_hand: Niveau d’utilisateur requis : Administrateur

Sélection d’un ensemble d’emojis

Discourse prend actuellement en charge cinq ensembles d’emojis :

  • Fluent UI
  • Noto
  • OpenMoji
  • Twemoji
  • Standard (Unicode)

Pour avoir un aperçu de l’apparence des différents ensembles, vous pouvez consulter cette comparaison d’ensembles d’emojis. Vous pouvez configurer le paramètre du site emoji_set dans /admin/config/emoji/settings ainsi que d’autres paramètres liés aux emojis.

Ajout d’emojis personnalisés

Pour ajouter des emojis personnalisés :

  1. Accédez à Admin → Apparence → Emoji dans /admin/config/emoji

  2. Cliquez sur le bouton Ajouter un emoji pour nommer, classer et télécharger l’image de votre emoji
    :information: Si vous avez plusieurs fichiers d’emoji à télécharger, vous pouvez sélectionner jusqu’à 10 fichiers image dans le sélecteur de fichiers pour les télécharger en lot. Les noms des fichiers image seront utilisés comme noms d’emoji dans ce cas.

Importation en lot d’emojis personnalisés

Vous pouvez importer jusqu’à 1000 emojis via un seul fichier ZIP contenant un manifeste emojis.csv. Le fichier CSV doit contenir les colonnes suivantes avec les en-têtes : name, group, filename.

name,group,filename
emoji_a,group_name,image.png

Le processus d’importation repose entièrement sur le manifeste. Si un fichier ou une ligne est manquante, il sera ignoré. Le champ group peut être laissé vide, auquel cas l’emoji personnalisé sera ajouté au groupe default.

Pour importer :

  1. Accédez à Admin → Apparence → Emoji dans /admin/config/emoji

  2. Cliquez sur le bouton Importer et sélectionnez le fichier ZIP contenant vos emojis.

  3. Prévisualisez l’importation et confirmez les modifications. Vous pouvez résoudre ici les éventuels conflits en sélectionnant l’emoji à conserver. Les conflits peuvent survenir si un emoji existant portant le même nom (et un groupe/image différent) existe déjà. Pour finaliser l’importation, cliquez sur Confirmer l’importation.

Exportation en lot d’emojis personnalisés

Les emojis personnalisés peuvent être exportés dans un seul fichier ZIP. Le fichier ZIP résultant contiendra un manifeste emojis.csv, prêt à être importé sur n’importe quel site Discourse sans modification. Il contient l’image, le nom et le groupe de chaque emoji.

Pour exporter, cliquez sur le bouton Sélectionner pour exporter et sélectionnez tous les emojis que vous exportez. Lorsque vous êtes prêt, cliquez sur le bouton Exporter et un fichier ZIP sera téléchargé.

Épinglage d’emojis en haut du sélecteur

Vous pouvez épingler n’importe quel groupe d’emojis en haut du sélecteur d’emojis. Accédez au paramètre emoji_picker_pinned_groups via Admin → Apparence → Emoji → Paramètres dans /admin/config/emoji/settings. Saisissez le nom du groupe d’emojis à épingler en haut du sélecteur.

Les groupes d’emojis personnalisés et réguliers peuvent être épinglés en haut. Par exemple, saisir flags déplacera le groupe d’emojis de drapeau en haut, au-dessus des smileys.

Noms des groupes d’emojis par défaut :

  • smileys_&_emotion
  • people_&_body
  • animals_&_nature
  • food_&_drink
  • travel_&_places
  • activities
  • objects
  • symbols
  • flags

Paramètres des emojis

Vous pouvez accéder aux paramètres des emojis dans /admin/config/emoji/settings pour personnaliser le comportement des emojis sur votre site.

  • enable_emoji - Active l’affichage et l’utilisation des emojis dans votre instance Discourse. Si cette option est désactivée, les emojis ne seront pas rendus et les utilisateurs ne pourront pas y accéder ou les utiliser dans les champs de texte.
  • emoji_set - Sélectionnez votre style d’emoji préféré. Les différents ensembles d’emojis peuvent offrir des apparences uniques aux emojis affichés sur le site.
  • max_emojis_in_title - Nombre maximum d’emojis autorisés dans le titre du sujet (par défaut : 1). Si la valeur définie est zéro, cela empêche l’utilisation de tout emoji dans les titres des sujets.
  • enable_emoji_shortcuts - Les textes de smileys courants tels que :) :p :( seront convertis en emojis.
  • emoji_autocomplete_min_chars - Nombre minimum de caractères requis pour déclencher la fenêtre contextuelle de saisie semi-automatique des emojis (par défaut : 0).
  • enable_inline_emoji_translation - Active la traduction des emojis en ligne (sans espace ni ponctuation avant).
  • emoji_deny_list - Ces emojis ne seront pas disponibles pour une utilisation dans les menus ou les codes courts.
  • emoji_picker_pinned_groups - Ces groupes d’emojis sont épinglés en haut du sélecteur d’emojis.
  • external_emoji_url - URL d’un service externe pour les images d’emojis. Laissez vide pour utiliser la valeur par défaut.
  • discourse_reactions_enabled_reactions - Définit une liste de réactions activées, tout emoji est autorisé ici. Réactions par défaut : +1, laughing, open_mouth, clap, confetti_ball et hugs.
  • discourse_reactions_excluded_from_like - Réactions qui ne comptent pas comme un « J’aime ». Toutes les réactions qui ne figurent pas sur cette liste compteront comme un « J’aime » pour les badges, les rapports et autres utilisations.
  • discourse_reactions_allow_any_emoji - Si cette option est activée, elle ajoute un bouton permettant aux utilisateurs de sélectionner n’importe quel emoji dans le sélecteur de réactions. Les membres pourront choisir n’importe quel emoji, y compris les emojis personnalisés, pour les réactions. Pour limiter les réactions disponibles, utilisez le paramètre du site emoji_deny_list.

Redimensionnement des emojis personnalisés

Par défaut, tous les emojis sont redimensionnés via CSS à 20x20, mais cela peut être annulé par du CSS personnalisé. Pour conserver le bon rapport d’aspect et la taille native dans les messages, ajoutez le CSS suivant :

/* Mettre les emojis à la taille normale (ne pas forcer le carré) */
div.topic-post img.emoji[src*="uploads"], 
div.d-editor-preview img.emoji[src*="uploads"], 
div.emoji-modal img.emoji[src*="uploads"], 
div.d-editor-textarea-wrapper img.emoji[src*="uploads"], 
div.title-wrapper img.emoji[src*="uploads"], 
td.main-link img.emoji[src*="uploads"] {
  width: auto;
  height: auto;
}

Pour personnaliser la taille d’un emoji spécifique, utilisez :

img.emoji[title=":youremoji:"] { 
  height: XXpx; 
  width: YYpx; 
}

Pour redimensionner les emojis dans les messages de chat et le statut des utilisateurs dans les chats :

div.chat-message-text img.emoji[src*="uploads"], 
span.user-status-message img.emoji[src*="uploads"] {
  width: auto;
  height: auto;
}
33 « J'aime »

15 messages ont été déplacés vers un nouveau sujet : Discussions diverses sur les émojis