Anteprime dell'elenco argomenti (TLP)

[merefield (Robert)]

Questo è un componente del tema ma ha l’opzione per aggiungere un plugin complementare.

|||
-|-|-|
| Riepilogo | Il componente originale Topic Preview che ti consente di aggiungere immagini ed estratti (e altro!) all’elenco degli argomenti pur potendo configurare quali aggiunte appaiono in quale elenco.
| Link al Repository | GitHub - merefield/discourse-tc-topic-list-previews: Enriches the content and layout of topic lists
| Guida all’installazione | Installing a theme or theme component
| Sponsorizzazione | Si prega di considerare di diventare uno sponsor del mio lavoro open source a un livello che si adatti alle risorse e alle esigenze tue o della tua organizzazione per garantire che questo componente riceva la manutenzione che merita e continui a funzionare per il tuo sito in futuro.

Ti piace questo componente del tema? Per favore, su GitHub

Installa questo componente del tema

Funziona molto bene con Discourse Bars 🍻 🍸 (a sidebar framework)!

Panoramica

Topic List Previews ti consente di:

• Aggiungere immagini, estratti e statistiche degli argomenti agli elementi dell’elenco degli argomenti; e
• Modificare il layout e lo stile degli elementi dell’elenco degli argomenti
• Aggiungere argomenti ‘in primo piano’ sopra gli elenchi di argomenti e gli argomenti.
• Aggiungere il Muro Utente alla pagina delle attività dell’utente (la funzione ‘Portfolio’).

Il Sidecar

Questo può essere completato con il ‘plugin sidecar’: https://github.com/merefield/discourse-topic-previews-sidecar

per aggiungere le seguenti funzionalità:

• ‘azioni’ (segnalibro, collegamento e mi piace dall’elenco degli argomenti)
• Selettore di miniature nell’editor dei metadati dell’argomento. (Scegli qualsiasi miniatura dall’intero argomento tramite una semplice interfaccia utente)
• Colorazione dello sfondo basata sul colore dominante della miniatura
• Elaborazione delle miniature di YouTube per rimuovere eventuali bordi neri (fondamentale per determinare il miglior colore dominante).
• Opzione per ricreare le miniature al momento della ricostruzione del post dell’argomento per consentire una rapida gestione dell’eliminazione dei bordi su base di argomento individuale.

Guida all’installazione del plugin: Install plugins on a self-hosted site

Hai bisogno almeno del componente del tema, il plugin è facoltativo.

Queste impostazioni possono essere applicate a tutti o a elenchi di argomenti selezionati su base globale o specifica per categoria.

Questa flessibile serie di funzionalità ti consente di creare una varietà di stili diversi per gli elenchi di argomenti, tra cui

Stile di base

Impostazioni pertinenti

• miniatura elenco argomenti
• estratto elenco argomenti
• azione elenco argomenti

Stile Pinterest (Masonry) alias ‘tiles’

Impostazioni pertinenti

• tiles elenco argomenti
• miniatura elenco argomenti
• estratto elenco argomenti
• azione elenco argomenti
• larghezza miniatura elenco argomenti
• altezza miniatura elenco argomenti

che ha un’opzione di formato ampio (dietro l’impostazione topic_list_tiles_wide_format):

Questo funziona in modo reattivo, quindi si collasserà in formato masonry se non gli viene data abbastanza larghezza (e viceversa).

Immagini in primo piano

Impostazioni pertinenti

• tag immagini in primo piano elenco argomenti
• conteggio immagini in primo piano elenco argomenti
• larghezza in primo piano elenco argomenti
• altezza in primo piano elenco argomenti
• titolo in primo piano elenco argomenti
• estratto in primo piano elenco argomenti
• ordine in primo piano elenco argomenti

Attivazione/disattivazione degli estratti:

L’ho introdotto un po’ di tempo fa per l’uso con il mio plugin AI Topic Summaries.

Puoi usarlo per TLP:

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

Esempi in azione

• StarZen - Un sito di fan non ufficiale di Star Citizen
• https://www.artofsm.art/

Supporto

Non fornisco alcun supporto garantito gratuitamente. Posso fornire supporto a aziende o istituzioni che si iscrivono a uno dei miei livelli di sponsorizzazione mensile GOLD o PLATINUM.

C’è anche un’opzione una tantum per la caccia ai bug.

[raghukamath (Raghavendra Kamath)]

C’è un modo per ordinare le immagini in primo piano in base al momento in cui viene aggiunto il tag? Attualmente porta l’immagine in primo piano dell’argomento che ha attività recenti, spingendo verso il basso le immagini taggate più recenti.

Ad esempio, se ho 10 immagini, ne contrassegno 5 come in primo piano, ora quelle 5 vengono mostrate nella barra superiore. Se aggiungo altri 5 tag, questi sostituiranno i 5 esistenti. Ma se uno dei 5 argomenti precedenti ha commenti o post, quell’immagine viene portata in primo piano ora.

[merefield (Robert)]

Tag? No, ma c’è questa opzione per ordinare per data di creazione:

[merefield (Robert)]

Attenzione: Sto per apportare una modifica al layout delle Tiles (elementi) molto presto. Se hai apportato delle modifiche CSS, queste potrebbero dover essere… ehm… modificate:

Prometto che non lo farò molto spesso, ma questa volta è per riordinare le cose e facilitare alcune nuove funzionalità che potrebbero apparire in futuro…

Attualmente la modifica è sul branch beta.

[raghukamath (Raghavendra Kamath)]

Sì, quell’opzione aiuta un po’, ma se uno dei post precedenti ha un aggiornamento, viene visualizzato in primo piano.

[merefield (Robert)]

Sto usando solo le opzioni native disponibili all’interno dell’API di Discourse (è fondamentalmente un Componente Tematico, quindi non puoi cambiare l’API). Quando avrò tempo, darò un’occhiata di nuovo all’ordinamento. Tuttavia, questo è emerso un po’ di tempo fa e ho apportato una modifica per aiutare uno degli utenti. Topic List Previews (legacy) - #1154 by merefield. Sono sorpreso che questo non funzioni come previsto. Ci si aspetterebbe che la created_at di un argomento rimanga statica nonostante i nuovi post? Sei sicuro di aver modificato l’impostazione e aggiornato il browser?

[merefield (Robert)]

@raghukamath Ho appena testato questo e sembra funzionare come previsto? Non cambierà comunque l’ordine in risposta a nuovi post e rispetta la data created_at. Aggiorna il tuo browser e riprova.

[raghukamath (Raghavendra Kamath)]

Nessun problema. Farò altri test. Forse mi sono confuso a causa del comportamento quando l’opzione è abilitata. Mi scuso per averti disturbato così tanto.

Un altro problema che i miei membri hanno evidenziato riguarda la correzione CSS del colore degli argomenti non letti e letti che non viene applicata ai browser mobili.

[merefield (Robert)]

@raghukamath

Un altro problema che i miei membri hanno evidenziato riguarda la correzione CSS del colore degli argomenti non letti e letti che non viene applicata ai browser mobili.

Sì, quello era ancora in sospeso come affermato in precedenza. Cercherò di spedirlo con l’aggiornamento del layout descritto sopra, probabilmente entro pochi giorni.

[flash]

Ciao, stavo cercando di lavorare con il plugin Git deprecato quando non sono riuscito a sovrascrivere il CSS sulla miniatura mobile. Continuava a tornare a un’altezza di 80px. Ho iniziato a cercare e ho visto che era stato spostato nel componente. Avrò lo stesso problema e dovrò clonare il componente per modificarlo o c’è un’altra soluzione? Voglio che il mobile abbia la larghezza completa sul browser mobile.

[merefield (Robert)]

Il layout qui non soddisfa le tue esigenze: Topic List Previews (TLP) - #4 by merefield soddisfa le tue esigenze? Le nuove tessere hanno miniature a larghezza intera. Questo è attualmente sul ramo beta. Installalo se lo desideri come Componente Tema aggiuntivo e provalo. Ricorda di specificare il ramo durante l’installazione e di modificare il nome del Componente Tema per renderlo chiaro che si tratta della Beta.

[flash]

Questo sicuramente lo farebbe. Ora è a tutta larghezza come volevo. Grazie.

[merefield (Robert)]

Ho unito il branch beta:

• lo stile interno delle tessere è stato modernizzato e riordinato. Le miniature ora occupano l’intera larghezza della colonna.
• ci sono una serie di semplificazioni CSS
• il mobile ha avuto alcuni piccoli miglioramenti del layout per i non-tessere.
• i titoli delle tessere dovrebbero ora riflettere le visite precedenti anche su mobile.

Layout changes

[sofi.pocketful (Sofi)]

Ciao,

Grazie per questo fantastico componente! Adoro il design

Sono relativamente nuovo in Discourse e non conosco molti termini tecnici.

Ho avuto problemi con le immagini che non vengono visualizzate nel componente elenco. Per qualche motivo, le immagini vengono visualizzate nell’anteprima del componente, ma quando carico la cosa reale, le immagini non ci sono più.

^ Questa è l’anteprima del componente

[sofi.pocketful (Sofi)]

^ Questo è come appare quando carico la pagina reale

Ora, credo che abbia a che fare con le mie impostazioni di discourse??

C’è un’impostazione specifica che deve essere attivata affinché questo componente funzioni? Non so davvero perché non funzioni come dovrebbe…

[merefield (Robert)]

Ciao, grazie per il tuo interesse.

Un paio di cose:

• Se non hai mai installato un componente o plugin simile prima, potrebbe esserci un ritardo prima che tutte le miniature vengano generate. Questo è un processo batch e richiede tempo. Questo processo dovrebbe iniziare a funzionare in background automaticamente una volta installato il componente e aggiunto a un tema. Controlla la tua coda sidekiq. Potresti vedere molti lavori in coda.
• Non è necessariamente compatibile con qualsiasi tema, c’è sempre la possibilità di uno scontro: è sviluppato e progettato solo con il tema predefinito. Si prega di testarlo sul tuo sito inizialmente solo con il tema predefinito. Puoi adattare il suo aspetto, ma ciò richiederà la base sui manufatti speciali di questo componente.

[sofi.pocketful (Sofi)]

Ciao Robert,

Grazie per la tua risposta! Testerò quello che hai suggerito sul mio sito

[flash]

Ciao Robert. Sto inserendo una tabella con JavaScript di terze parti sotto l’intestazione e lo script interrompe le anteprime quando lo uso in un componente. Hai qualche idea per una soluzione alternativa?

[merefield (Robert)]

Se c’è un errore in quello script che impedisce l’esecuzione di javascript, questo potrebbe interrompere il codice di layout TLP che richiede che javascript funzioni al meglio. Cerca errori rossi nella console del tuo browser.

[raghukamath (Raghavendra Kamath)]

@merefield

Ho appena testato questo e sembra funzionare come previsto? Non cambierà comunque l’ordine in risposta a nuovi post e rispetta la data created_at. Per favore, aggiorna il tuo browser e riprova.

Ciao, ho abilitato l’opzione della data di creazione come hai suggerito. Risolve in parte i problemi. ma penso che nei plugin precedenti l’ordine fosse impostato in base alla data in cui il post è stato taggato. Inoltre, il problema dell’immagine più vecchia che appare in prima pagina ad ogni aggiornamento o risposta all’argomento rende difficile mantenere un’immagine recente in primo piano. Supponiamo che io renda un’immagine in primo piano e se un post più vecchio di un anno riceve una nuova risposta, la prima pagina avrà l’immagine in primo piano di quel post. Se molti post più vecchi ricevono risposte, l’immagine in primo piano appena taggata scompare.