Aggiungere una classe di categoria a una Pagina Pubblicata

Sviluppatore
1

Se non possiamo usare type="text/discourse-plugin" in un tag script, c’è un modo per ottenere lo slug della categoria corrente di una pagina pubblicata?
Lo scopo è aggiungere una nuova classe contenente lo slug in un tag HTML della pagina.

2 Mi Piace
2

Ciao,

Non sono sicuro di aver capito appieno, ma la categoria è disponibile sul corpo, quindi puoi puntarla.

Ad esempio:

Screenshot 2022-11-01 at 17.42.55
Screenshot 2022-11-01 at 17.42.55598×127 17.1 KB

Puoi puntare tutti gli argomenti della categoria lounge con:

.published-page.lounge {
  ...
}
2 Mi Piace
3

Mi dispiace, non sono stato abbastanza chiaro e avrei dovuto spiegare meglio lo scopo.

Attualmente, la pubblicazione della pagina non utilizza lo sfondo della categoria.

Impostazione:

image
image636×743 82.3 KB

Vista dell’argomento:

image
image1432×772 71.6 KB

Vista della pagina pubblicata:

image
image898×330 19 KB

Lo sfondo della categoria è definito in color_definitions.scss:

body.category-test-category {
    background-image: url(/uploads/default/original/1X/1851d5e9eb66a9ecf49f0dc747dfbad1a0fd220b.jpeg)
}

La pagina pubblicata non ha la classe category-test-category e quindi non eredita l’immagine di sfondo.

La mia idea è usare javascript per ottenere lo slug della categoria e aggiungere una classe category-[category slug] al tag body, qualunque sia il nome della categoria, in modo che gli sfondi delle categorie vengano applicati automaticamente, invece di scrivere CSS personalizzato per le categorie di ogni pagina pubblicata, come ad esempio:

.published-page {
    &.test-category {
        background-image: url("/uploads/default/original/1X/1851d5e9eb66a9ecf49f0dc747dfbad1a0fd220b.jpeg");
    }
}
4 Mi Piace
4

Sono d’accordo, ottima idea :+1:

2 Mi Piace
5

Capisco… Sì, è una buona idea ma sfortunatamente non credo sia possibile modificare una pagina pubblicata con un componente tema (javascript)… Probabilmente con un plugin o aggiungendo al core la parte category- prima del nome della categoria.

Penso che per ora funzioni il modo manuale. Creare un componente tema con le SCSS pertinenti alle categorie delle pagine pubblicate e aggiungere impostazioni per questo.

Intendo qualcosa di simile a questo, forse: GitHub - VaperinaDEV/published-page-category-background-image

Ma forse c’è una soluzione migliore, non sono sicuro. :slightly_smiling_face:

3 Mi Piace
6

È una soluzione molto intelligente, ma concordo sul fatto che averla di default (o personalizzabile) nel core potrebbe essere un’ottima cosa. L’intento attuale è avere esplicitamente uno sfondo di default utilizzando i colori del tema, come possiamo vedere in publish.scss:

.published-page {
  background-color: var(--secondary);
  color: var(--primary);

Che ne dici se gli URL delle immagini di sfondo delle categorie personalizzate fossero memorizzati in variabili CSS a cui potremmo accedere facilmente nel nostro CSS personalizzato? Almeno, non ci preoccuperemmo di utilizzare l’URL completo dell’immagine nel nostro CSS.

Ho creato una richiesta di funzionalità qui: Published pages could inherit categories' background image setting

4 Mi Piace