Configura emoji personalizzati

[Discourse]

Questa guida spiega come personalizzare le emoji sul tuo sito Discourse tramite set di emoji selezionabili, caricamento di nuove emoji, configurazione delle impostazioni del sito e regolazione delle dimensioni delle emoji.

Livello utente richiesto: Amministratore

Selezione di un set di emoji

Discourse supporta attualmente cinque set di emoji:

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

Per una panoramica di come appaiono i diversi set, puoi dare un’occhiata a questo confronto dei set di emoji. Puoi configurare l’impostazione del sito emoji_set su /admin/config/emoji/settings insieme ad altre impostazioni relative alle emoji.

Il menu a discesa mostra anche set legacy che non sono più supportati attivamente per motivi di licenza. Rimangono elencati per retrocompatibilità: se il tuo sito utilizzava uno di questi set, continuerà a funzionare, ma le emoji verranno ora visualizzate utilizzando il set corrente corrispondente.

Tabella che mostra i set legacy e i loro fallback

Set legacy	Fallback
Apple/International	Twemoji
Facebook Messenger	Standard (Unicode)
Google style	Noto
Google Classic	Noto
Twitter style	Twemoji
Win10 style	Fluent UI

Aggiunta di emoji personalizzate

Per aggiungere emoji personalizzate:

1. Naviga su Admin -\u003e Appearance -\u003e Emoji su /admin/config/emoji

2. Fai clic sul pulsante Aggiungi emoji per nominare, classificare e caricare l’immagine della tua emoji
   Se hai più file emoji da caricare, puoi selezionare fino a 10 file immagine nel selettore di file per il caricamento in blocco. I nomi dei file immagine verranno utilizzati come nomi delle emoji in questo caso.

   
   
   

Impostazioni emoji

Puoi accedere alle impostazioni delle emoji su /admin/config/emoji/settings per personalizzare il comportamento delle emoji sul tuo sito.

• enable_emoji - Abilita la visualizzazione e l’uso delle emoji nell’istanza di Discourse. Se disabilitato, le emoji non verranno renderizzate e gli utenti non potranno accedervi o utilizzarle nei campi di testo.
• emoji_set - Seleziona il tuo stile di emoji preferito. Diversi set di emoji possono fornire aspetti unici alle emoji visualizzate sul sito.
• max_emojis_in_title - Numero massimo di emoji consentite nel titolo dell’argomento (predefinito: 1). Se il valore impostato è zero, impedisce l’uso di qualsiasi emoji nei titoli degli argomenti.
• enable_emoji_shortcuts - Smiley di testo comuni come :) :p :( verranno convertiti in emoji.
• emoji_autocomplete_min_chars - Numero minimo di caratteri richiesti per attivare il popup di completamento automatico delle emoji (predefinito: 0).
• enable_inline_emoji_translation - Abilita la traduzione per le emoji in linea (senza spazi o punteggiatura prima).
• emoji_deny_list - Queste emoji non saranno disponibili per l’uso nei menu o negli shortcode.
• external_emoji_url - URL di un servizio esterno per le immagini delle emoji. Lasciare vuoto per utilizzare l’impostazione predefinita.
• discourse_reactions_enabled_reactions - Definisce un elenco di reazioni abilitate, qualsiasi emoji è consentita qui. Reazioni predefinite: +1, laughing, open_mouth, clap, confetti_ball, e hugs.
• discourse_reactions_excluded_from_like - Reazioni che non contano come Mi piace. Qualsiasi reazione non presente in questo elenco conterà come Mi piace per badge, segnalazioni e altri scopi.
• discourse_reactions_allow_any_emoji - Se abilitato, verrà aggiunto un pulsante che consente agli utenti di selezionare qualsiasi emoji nel selettore di reazioni. Agli utenti sarà consentito scegliere qualsiasi emoji, incluse le emoji personalizzate, per le reazioni. Per limitare le reazioni disponibili, utilizza l’impostazione del sito emoji_deny_list.

Ridimensionamento delle emoji personalizzate

Per impostazione predefinita, tutte le emoji vengono ridimensionate tramite CSS a 20x20, ma questo può essere sovrascritto con CSS personalizzato. Per mantenere il corretto rapporto di aspetto e la dimensione nativa nei post, aggiungi il seguente CSS:

/* Rendi le emoji a dimensione normale (non forzare il quadrato) */
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;
}

Per personalizzare le dimensioni di una specifica emoji, usa:

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

Per ridimensionare le emoji nei messaggi di chat e nello stato utente nelle chat:

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