Aperçus de la liste de sujets (TLP)

[merefield (Robert)]

Ceci est un composant de thème mais avec la possibilité d’ajouter un plugin complémentaire.

|||
-|-|-|
| Résumé | Le composant original d’aperçu de sujet qui vous permet d’ajouter des images et des extraits (et plus encore !) à la liste des sujets tout en pouvant configurer les ajouts qui apparaissent sur quelle liste.
| Lien vers le dépôt | GitHub - merefield/discourse-tc-topic-list-previews: Enriches the content and layout of topic lists
| Guide d’installation | Installing a theme or theme component
| Sponsoring | Veuillez envisager de devenir un sponsor de mon travail open source à un niveau qui convient à vos ressources et besoins, ou à ceux de votre organisation, afin de garantir que ce composant reçoive la maintenance qu’il mérite et continue de fonctionner pour votre site à l’avenir.

Vous aimez ce composant de thème ? Veuillez le sur GitHub

Installer ce composant de thème

Fonctionne très bien avec Discourse Bars 🍻 🍸 (a sidebar framework) !

Vue d’ensemble

Topic List Previews vous permet de :

• Ajouter des images, des extraits et des statistiques de sujets aux éléments de la liste de sujets ; et
• Modifier la disposition et le style des éléments de la liste de sujets
• Ajouter des sujets ‘En vedette’ au-dessus des listes de sujets et des sujets.
• Ajouter un mur d’utilisateurs à la page d’activité de l’utilisateur (fonctionnalité ‘Portfolio’).

Le Sidecar

Ceci peut être complété par le ‘plugin sidecar’ : https://github.com/merefield/discourse-topic-previews-sidecar

pour ajouter les fonctionnalités suivantes :

• ‘actions’ (mise en signet, lien et favori depuis la liste des sujets)
• Sélecteur de miniatures dans l’éditeur de métadonnées de sujet. (Choisissez n’importe quelle miniature de l’ensemble du sujet via une interface utilisateur simple)
• Colorisation de l’arrière-plan basée sur la couleur dominante de la miniature
• Traitement des miniatures YouTube pour supprimer les bordures noires (crucial pour déterminer la meilleure couleur dominante).
• Option pour recréer les miniatures lors de la reconstruction du message du sujet afin de vous permettre de gérer rapidement l’élimination des bordures sur une base de sujet individuelle.

Guide d’installation du plugin : Install plugins on a self-hosted site

Vous avez besoin au minimum du composant de thème, le plugin est facultatif.

Ces paramètres peuvent être appliqués à toutes les listes de sujets ou à des listes sélectionnées, que ce soit au niveau du site ou par catégorie.

Cet ensemble de fonctionnalités flexibles vous permet de créer une variété de styles de listes de sujets, y compris

Style de base

Paramètres pertinents

• miniature de la liste des sujets
• extrait de la liste des sujets
• action sur la liste des sujets

Style Pinterest (Masonry) dit ‘tuiles’

Paramètres pertinents

• tuiles de la liste des sujets
• miniature de la liste des sujets
• extrait de la liste des sujets
• action sur la liste des sujets
• largeur de la miniature de la liste des sujets
• hauteur de la miniature de la liste des sujets

qui a une option de format large (derrière le paramètre topic_list_tiles_wide_format) :

Cela fonctionne de manière réactive, donc il s’effondrera en format masonry s’il n’a pas assez de largeur (et vice versa).

Images en vedette

Paramètres pertinents

• tag des images en vedette de la liste des sujets
• nombre d’images en vedette de la liste des sujets
• largeur des images en vedette de la liste des sujets
• hauteur des images en vedette de la liste des sujets
• titre des images en vedette de la liste des sujets
• extrait des images en vedette de la liste des sujets
• ordre des images en vedette de la liste des sujets

Activation/Désactivation des extraits :

Je l’ai introduit il y a un moment pour l’utiliser avec mon plugin AI Topic Summaries.

Vous pouvez l’utiliser pour TLP :

GitHub - merefield/discourse-tc-excerpts-toggle: A small Discourse theme component that adds a...

Exemples en action

• StarZen - Un site de fans non officiel de Star Citizen
• https://www.artofsm.art/

Support

Je ne fournis aucun support garanti gratuitement. Je peux fournir un support aux entreprises ou institutions qui s’inscrivent à l’un de mes niveaux de sponsoring mensuels OR ou PLATINE.

Il existe également une option de chasse aux bugs unique.

[raghukamath (Raghavendra Kamath)]

Existe-t-il un moyen de baser l’ordre des images mises en avant sur le moment où le tag est ajouté ? Actuellement, il affiche l’image mise en avant du sujet qui a une activité récente, repoussant ainsi les images taguées les plus récentes vers le bas.

Par exemple, si j’ai 10 images et que j’en marque 5 comme mises en avant, ces 5 seront affichées dans la barre supérieure. Si j’ajoute 5 tags supplémentaires, ils remplaceront les 5 existants. Mais si l’un des 5 sujets précédents a des commentaires ou des publications, cette image sera mise en avant.

[merefield (Robert)]

Étiquette ? Non, mais il existe cette option pour trier par date de création :

[merefield (Robert)]

Attention : Je vais bientôt apporter une modification à la disposition des Carreaux (élément). Si vous avez des ajustements CSS, ils pourraient devoir être… euh… ajustés :

Je promets de ne pas le faire très souvent, mais celui-ci vise à simplifier les choses et à faciliter de nouvelles fonctionnalités qui pourraient apparaître à l’avenir…

Actuellement, la modification est sur la branche beta.

[raghukamath (Raghavendra Kamath)]

Oui, cette option aide un peu, mais si l’un des anciens articles a une mise à jour, il apparaît en premier.

[merefield (Robert)]

Je n’utilise que les options natives disponibles dans l’API Discourse (c’est un composant thématique à la base, donc vous ne pouvez pas changer l’API). Quand j’aurai le temps, je regarderai à nouveau le tri. Cependant, cela est apparu il y a quelque temps et j’ai fait un changement pour aider l’un des utilisateurs. Topic List Previews (legacy) - #1154 by merefield. Je suis surpris que cela ne fonctionne pas comme prévu. On s’attendrait à ce que le created_at d’un sujet reste statique malgré de nouveaux messages ? Êtes-vous sûr d’avoir modifié le paramètre et actualisé le navigateur ?

[merefield (Robert)]

@raghukamath Je viens de tester ceci et cela semble fonctionner comme prévu ? Il ne changera toujours pas l’ordre en réponse aux nouveaux Posts et respectera la date created_at. Veuillez rafraîchir votre navigateur et réessayer.

[raghukamath (Raghavendra Kamath)]

Aucun problème. Je vais tester davantage. Peut-être que j’ai été confus à cause du comportement lorsque l’option est activée. Désolé de vous déranger autant.

Un autre problème que mes membres ont souligné concerne le fait que la correction CSS de la couleur des sujets non lus et lus ne s’applique pas aux navigateurs mobiles.

[merefield (Robert)]

@raghukamath

Un autre problème que mes membres ont souligné concerne le correctif CSS de couleur des sujets non lus et lus qui ne s’applique pas aux navigateurs mobiles.

Oui, cela était toujours en suspens comme indiqué précédemment. J’essaierai de l’intégrer à la mise à jour de la mise en page décrite ci-dessus, probablement dans quelques jours.

[flash]

Salut, j’essayais de travailler avec le plugin git déprécié quand je n’ai pas pu remplacer le CSS sur la miniature mobile. Il revenait constamment à une hauteur de 80px. J’ai commencé à chercher et j’ai vu qu’il avait été déplacé vers le composant. Aurai-je le même problème et devrai-je cloner le composant pour le changer ou existe-t-il une autre solution ? Je veux que le mobile ait une largeur complète sur le navigateur mobile.

[merefield (Robert)]

La mise en page ici ne conviendrait-elle pas à vos besoins : Topic List Previews (TLP) - #4 by merefield ? Les nouvelles vignettes ont des miniatures pleine largeur. Ceci est actuellement sur la branche beta. Installez-la si vous le souhaitez en tant que composant de thème supplémentaire et essayez-le. N’oubliez pas de spécifier la branche lors de l’installation et de modifier le nom du composant de thème pour qu’il soit clair qu’il s’agit de la version bêta.

[flash]

Cela le ferait certainement. Je l’ai maintenant en pleine largeur comme je le voulais. Merci.

[merefield (Robert)]

J’ai fusionné la branche beta :

• le style interne des vignettes a été modernisé et rangé. Les miniatures occupent maintenant toute la largeur de la colonne.
• il y a un certain nombre de simplifications CSS
• le mobile a bénéficié de quelques améliorations mineures de la mise en page pour les non-vignettes.
• les titres des vignettes devraient maintenant refléter les visites précédentes sur mobile également.

Layout changes

[sofi.pocketful (Sofi)]

Salut,

Merci pour cet incroyable composant ! J’adore le design

Je suis relativement nouveau dans Discourse et je ne connais pas grand-chose aux termes techniques.

J’ai eu du mal avec les images qui ne s’affichent pas dans le composant de liste. Pour une raison quelconque, les images s’affichent dans l’aperçu du composant, mais lorsque je charge la chose réelle, les images ne sont plus là.

^ Ceci est l’aperçu du composant

[sofi.pocketful (Sofi)]

^ C’est comme ça que ça ressemble quand je charge la vraie page

Maintenant, je pense que cela a quelque chose à voir avec mes paramètres Discourse ??

Y a-t-il un paramètre spécifique qui doit être activé pour que ce composant fonctionne ? Je ne sais vraiment pas pourquoi cela ne fonctionne pas comme il le devrait…

[merefield (Robert)]

Bonjour, merci de votre intérêt.

Quelques points :

• Si vous n’avez jamais installé de composant ou de plugin similaire auparavant, il peut y avoir un délai avant que toutes les miniatures ne soient générées. Il s’agit d’un processus par lots qui prend du temps. Ce processus devrait démarrer automatiquement en arrière-plan une fois que vous aurez installé le composant et l’aurez ajouté à un thème. Vérifiez votre file d’attente sidekiq. Vous pourriez y voir de nombreux jobs en attente.
• Il n’est pas nécessairement compatible avec n’importe quel thème, il y a toujours une possibilité de conflit : il est uniquement développé et conçu avec le thème par défaut. Veuillez d’abord le tester sur votre site avec uniquement le thème par défaut. Vous pouvez adapter son apparence, mais cela devra être basé sur les artefacts spéciaux de ce composant.

[sofi.pocketful (Sofi)]

Salut Robert,

Merci pour ta réponse ! Je vais tester ce que tu as suggéré sur mon site

[flash]

Salut Robert. J’importe un tableau avec du JavaScript tiers sous l’en-tête et le script casse les aperçus lorsque je l’utilise dans un composant. Des idées de contournement ?

[merefield (Robert)]

S’il y a une erreur dans ce script qui empêche l’exécution de JavaScript, cela pourrait casser le code de mise en page TLP qui exige que JavaScript soit dans les meilleures conditions. Recherchez les erreurs rouges dans la console de votre navigateur.

[raghukamath (Raghavendra Kamath)]

@merefield

Je viens de tester ceci et cela semble fonctionner comme prévu ? Il ne changera toujours pas l’ordre en réponse à de nouveaux messages et respectera la date created_at. Veuillez rafraîchir votre navigateur et réessayer.

Salut, j’ai activé l’option de date de création comme vous l’avez suggéré. Cela résout quelque peu les problèmes. mais je pense que dans l’ancien plugin, l’ordre était défini selon la date à laquelle le message était tagué. De plus, le problème des anciennes images apparaissant sur la page d’accueil lors de toute mise à jour ou réponse au sujet rend difficile pour une image récente de rester mise en avant. Supposons que je mette une image en avant et si un ancien message d’il y a un an reçoit une nouvelle réponse, la page d’accueil aura l’image mise en avant de ce message. Si de nombreux anciens messages reçoivent une réponse, l’image mise en avant nouvellement taguée disparaît.