Meilleures pratiques pour créer des styles CSS personnalisés pour des sections de posts

Préambule

Alors que je mettais en place et personnalisais l’instance Discourse de ma communauté, j’ai cherché des moyens d’exploiter l’incroyable puissance de la plateforme pour augmenter mon propre bonheur ainsi que celui de mes utilisateurs.

L’une des choses que j’aimerais faire serait d’ajouter une signature personnalisée aux messages privés que j’envoie, et de les « signer ». Je ne veux pas utiliser d’image, mais plutôt mon nom dans une police Google.

Faire fonctionner cela m’aidera à comprendre comment proposer des extraits de code et autres à ma communauté pour leur utilisation lors de la composition de messages, donc la connaissance est générale, même si la question est spécifique.

La raison pour laquelle je pose la question est qu’avant de passer du temps à créer ces blocs pour les utiliser, j’aimerais m’assurer que c’est la meilleure façon de procéder. Parce que si je trouve des idées astucieuses, je pense partager quelques exemples pour lancer une discussion afin de recueillir encore plus d’idées astucieuses de la part d’autres personnes plus intelligentes que moi. :slight_smile:

La question : Comment mettre du texte dans un message dans un bloc qui peut être ciblé via CSS ?

Ce que j’ai trouvé jusqu’à présent

Je suis tombé sur le sujet suivant :

[ CSS personnalisé dans un message / ajout de classes personnalisées](Custom css inside a post / adding custom classes)

De ce sujet, j’ai retenu cette réponse :

Cela semble fonctionner, mais je suis curieux de savoir si c’est actuellement considéré comme la meilleure pratique/méthode pour cela.

Pendant que j’y suis, une question spécifique légèrement hors sujet tout en restant dans le sujet :

J’« abuse » d’une personnalisation pour faire fonctionner mon idée de signature, seulement ça ne fonctionne pas, et je suis curieux de savoir si quelqu’un a une idée à ce sujet.

Je charge des polices Google personnalisées en utilisant un plugin dont je sais qu’il fonctionne car tout mon forum utilise avec succès ces polices. Je l’ai utilisé pour forcer le chargement de « Playwrite USA Traditional ».

J’ai le CSS suivant dans mon thème :

div[data-theme-ieh] {
    font-family: "Playwrite USA Traditional";
    text-align: right;
}

Ma div dans mon exemple de message est bien alignée à droite, mais elle utilise Arial ou similaire, pas la police de mon thème, ni Playwrite.

Est-ce que je rate quelque chose de stupide dans ma configuration, ou y a-t-il autre chose que vous pensez que je rate ? Ce n’est pas une question Discourse.

Aussi, y a-t-il une meilleure façon de charger une police Google pour l’utiliser sur mon site ?

Je vous recommande de consulter Generic bbcode wrapper for theme components

Je ne vois rien d’après ce que vous avez partagé ici. Si vous pouvez partager un lien vers le forum en direct, il nous sera plus facile de vous aider à trouver le problème.

1 « J'aime »

En vérifiant le code d’intégration de https://fonts.google.com/share?selection.family=Playwrite+US+Trad:wght@100..400, il semble qu’il devrait être \"Playwrite US Trad\"

// <uniquifier> : Utilisez un nom de classe unique et descriptif
// <weight> : Utilisez une valeur de 100 à 400

.playwrite-us-trad-<uniquifier> {
  font-family: "Playwrite US Trad", cursive;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
1 « J'aime »

Ooh, ça a l’air plutôt sympa. Merci pour le tuyau !

C’est tout ce que j’espérais. Je ne voulais pas perdre de temps, mais au cas où il y aurait quelque chose de vraiment évident. lol.

Je… stupide Google… ugh. Je me suis concentré sur la direction du composant pour m’assurer que j’avais le nom correct, y compris les majuscules, que je n’ai même pas pensé à vérifier le nom RÉEL que Google pourrait utiliser. d’oh.

Pour mémoire, charger le nom de police correct et référencer le nom de police correct donne les résultats initialement attendus.

Et maintenant, je peux “signer” mes messages :


Merci :slight_smile:

1 « J'aime »

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.