Changer les icônes globalement

Documentation Guides pour les développeurs
22

Oui, suivez ce guide : Replace Discourse's default SVG icons with custom icons in a theme

2 « J'aime »
23

Rebond, s’il vous plaît. J’ai la même question.

Par défaut, Discourse utilise l’icône de lien en bas du message comme bouton « partager » (elle fait plus que simplement afficher le lien, elle propose un partage sur les réseaux sociaux), mais la même icône est utilisée dans l’éditeur pour modifier un lien.

Ces deux fonctions devraient vraiment avoir des icônes différentes, car elles sont distinctes. OU si quelqu’un connaît un moyen de remplacer ce changement global dans l’éditeur de message, je serais reconnaissant.

2 « J'aime »
24

Récemment, j’ai changé l’icône « J’aime » de « heart » à « book-reader ».

J’ai obtenu un grand succès en modifiant toutes les icônes « J’aime », sauf celle dans la liste déroulante des notifications.

Capture166

J’ai utilisé l’en-tête suivant, en ajoutant toutes les options possibles auxquelles j’ai pu penser :

   <script type="text/discourse-plugin" version="0.8">
        api.replaceIcon('d-unliked', 'book-reader');
        api.replaceIcon('d-liked', 'book-reader');
        api.replaceIcon('heart', 'book-reader');
        api.replaceIcon('new read', 'book-reader');
        api.replaceIcon('d-icon-heart', 'book-reader');
        api.replaceIcon('notification.liked', 'book-reader');  // notifications 
        api.replaceIcon('notification.liked_2', 'book-reader');  // notifications 
        api.replaceIcon('notification.liked_many', 'book-reader');  // notifications 

    </script>

Le cœur a été remplacé partout sur la plateforme, sauf dans la liste déroulante des notifications…

Des idées ?

1 « J'aime »
25

Essayez d’ajouter également :

api.replaceIcon('notification.liked_consolidated', 'book-reader');

1 « J'aime »
26

Merci pour ta réponse, Daniela !

J’ai ajouté le code, mais rien n’a changé. Le cœur s’affiche toujours comme icône de notification.

   <script type="text/discourse-plugin" version="0.8">
        api.replaceIcon('d-unliked', 'book-reader');
        api.replaceIcon('d-liked', 'book-reader');
        api.replaceIcon('heart', 'book-reader');
        api.replaceIcon('new read', 'book-reader');
        api.replaceIcon('d-icon-heart', 'book-reader');
        api.replaceIcon('notification.liked', 'book-reader');  
        api.replaceIcon('notification.liked_2', 'book-reader');  
        api.replaceIcon('notification.liked_many', 'book-reader');  
        api.replaceIcon('notification.liked_consolidated', 'book-reader');  

    </script>

Hormis cette instance, l’icône book-reader a remplacé toutes les icônes de cœur partout ailleurs.

Je pensais qu’il pouvait s’agir d’un conflit d’icônes, alors j’ai remplacé « book-reader » par « pencil », car je sais que les notifications peuvent utiliser cette icône. Cela n’a pas fonctionné, c’est toujours un cœur.

Des idées ?

27

J’ai essayé de remplacer l’icône envelope par l’icône inbox, mais les changements ne s’appliquent pas aux icônes à l’intérieur du panneau du menu utilisateur. Faut-il les cibler d’une manière spécifique ?

Mon extrait :

// {theme}/javascripts/discourse/api-initializers/init-theme.gjs

import { apiInitializer } from "discourse/lib/api";

export default apiInitializer((api) => {
  api.replaceIcon("envelope", "inbox");
});
28

Bonjour @jrgong :waving_hand:

Vous trouverez ici les remplacements d’icônes qui contiennent les notifications.

Ajoutez cette ligne à votre extrait :

api.replaceIcon("notification.private_message", "inbox");
1 « J'aime »