Sto cercando un modo semplice per far sì che un selettore CSS corrisponda ai post pubblicati dall’utente corrente (ma non a quelli di altri utenti). Per quanto ne so, non viene aggiunta alcuna classe CSS a tali post che possa essere utilizzata. Ma forse mi sto perdendo qualcosa?
Se al momento non esiste una tale classe, apprezzerei molto se venisse aggiunta!
Il mio suggerimento sarebbe quello di aggiungere una classe all’elemento topic-post, simile alle classi esistenti relative all’utente che ha pubblicato, ad esempio topic-owner. La nuova classe potrebbe chiamarsi current-user o my-post o qualsiasi altra cosa si adatti alla nomenclatura esistente di Discourse.
Clicca qui per una spiegazione del motivo per cui voglio farlo...
Qualche tempo fa, gli utenti del mio forum si sono lamentati di essere diventati dipendenti dal controllare quante “like” avevano ricevuto i loro post. Tornavano ripetutamente sui post solo per verificare i loro “like” e questo comportamento ricordava loro gli aspetti più tossici delle principali piattaforme di social media.
La mia soluzione è stata creare un tema da utilizzare in cui ho semplicemente aggiunto una regola CSS per nascondere il contatore dei “like” sui loro post. Il pulsante “like” sui post creati dall’utente corrente ha una classe chiamata .my-likes, quindi è facile selezionarlo con CSS. Questo ha funzionato bene e gli utenti sono rimasti soddisfatti della soluzione.
Tuttavia, prima di oggi mi è stato fatto notare che se si clicca sul pulsante “…”, ovvero “mostra altro” su un post, vengono elencati gli utenti che hanno messo “like” a quel post. Un utente ha riferito di essere tornato al suo comportamento da “tossico della dopamina” a causa di ciò, cliccando ripetutamente su “…” per aggirare il tema speciale e controllare i suoi “like”.
Ma a differenza del caso sopra menzionato del pulsante “like”, non riesco a trovare un selettore CSS che mi permetta di farlo. L’unica soluzione che ho trovato è nascondere l’elenco dei “like” per tutti i post, ovvero impedire che gli utenti del tema vedano quell’elenco per qualsiasi post.
Quello che posso fare ora è questo:
.who-liked { display: none;}
Ciò che speravo di fare era qualcosa di simile a questo:
Una cosa che potresti fare è trovare nell’elenco dei temi quelli in cui l’utente corrente è l’autore; questo può essere fatto con jQuery. Se vero, applica uno stile a quella riga. Lo svantaggio potrebbe essere che l’utente può essere trovato come autore del tema OP.
Un altro approccio è sovrascrivere completamente il componente dell’elenco dei temi e fare la magia lì. Ulteriori informazioni sulla sovrascrittura dei modelli sono disponibili qui:
Scusa, stai dicendo di voler decorare i post degli utenti nell’elenco degli argomenti o nell’argomento vero e proprio?
In tal caso, potresti agganciarti all’avatar dell’utente corrente, trovare l’elemento radice del post genitore e aggiungere una classe ad esso con jQuery.
So benissimo che posso farlo con JavaScript. Avrei dovuto menzionarlo fin dall’inizio. Tuttavia, il punto del mio post è che vorrei farlo in modo molto più semplice, con un pizzico di CSS (vedi la parte espandibile del mio post originale).
Oltre a essere una soluzione più semplice e naturale, mi permetterebbe di gestire le cose con l’eccellente sistema integrato per i Temi e i Componenti del Tema.
E non si tratta di qualcosa di strano ed esotico. Come ho già detto all’inizio, Discourse ha già attributi di classe sullo stesso elemento (post nella pagina dell’argomento) per indicare le proprietà dell’utente che ha pubblicato (proprietario dell’argomento, livello di fiducia, appartenenze a gruppi, ecc.). E in un sotto-elemento di questo elemento (il pulsante Mi piace), c’è già un attributo di classe che indica che il post è stato creato dall’utente che sta attualmente visualizzando la pagina.
Per questi motivi, penso che aggiungere quel singolo attributo all’elemento topic-post sia una soluzione molto migliore rispetto a qualche trucco JavaScript.
Ah, sono appena arrivato per pubblicare la soluzione in JS. Ho creato un gruppo chiamato “hidelikes” e questo script JS nasconde la lista dei “mi piace” per tutti i membri del gruppo, solo per i loro stessi post.
<script type="text/discourse-plugin" version="0.8">
$( document ).ready(function() {
let currentUser = api.getCurrentUser();
var groups = currentUser.groups;
var userID = currentUser.id;
const hidelikes = groups.some(g => g.name === 'hidelikes');
if (hidelikes) {
$('<style>').text('.boxed.onscreen-post[data-user-id="' + userID + '"] .who-liked{display: none;}').appendTo(document.head)
}
});
</script>
Ovviamente, se vuoi applicarlo a tutti gli utenti, basta rimuovere la parte relativa ai gruppi.