Come posso cambiare lo sfondo di un certo argomento?

Sviluppatore
1

Continuando la discussione dal thread Background of topic color change:

Ciao, come posso cambiare lo sfondo di un certo argomento?

1 Mi Piace
2

Oppure. Non so programmare. Quale sarebbe il codice CSS per personalizzare lo sfondo degli argomenti di una sottocategoria specifica?

Grazie per la tua risposta!

1 Mi Piace
3 
.category-support .topic-post {
    background: red;
}

fa:\n\n

image
image938×670 27.9 KB
\n\nLa classe specifica della categoria si trova nel tag <body>.\n\n
image
image898×152 15.9 KB
\n\n—\n\nSe vuoi evidenziare solo il primo post:\n\ncss .category-support .topic-post:first-child { background: red; } \n\n—\n\nSe vuoi cambiare lo sfondo degli argomenti specifici della categoria in un elenco di argomenti, allora l’argomento che hai collegato è la strada da percorrere.\n\n```css
.category-support.topic-list-item {
background: red;
}

4 Mi Piace
4

Grazie mille :+1:
Ci proverò sicuramente!

Posso aggiungere un’immagine invece di un colore?

5

Un’altra domanda: qual è il codice per personalizzare lo sfondo di una sottocategoria specifica?
Grazie

6

Ciao,

Puoi anche utilizzare le impostazioni della categoria per impostare un’immagine di sfondo per la categoria.

Screenshot 2022-10-29 at 8.13.25
Screenshot 2022-10-29 at 8.13.25963×664 23.5 KB

1 Mi Piace
7

Sì, ha funzionato :+1:. Ma quando rendo pubblica la pagina lo sfondo rimane bianco :point_down:

image
image1401×1073 79.7 KB

La funzionalità della pagina pubblica è molto limitata.
Ad esempio, l’anteprima del video di YouTube non viene mostrata (viene mostrato solo il banner del video). Non è possibile creare un carosello di immagini (tutte le immagini vengono posizionate una dopo l’altra in fondo alla pagina).
Da qui, ho le seguenti domande: È possibile migliorare la funzione della pagina pubblica da solo, o ci sono già codici pronti per migliorare la pagina pubblica?
Forse dovrei creare un post separato su questo problema :thinking:

8

Dovresti stilizzare la pagina pubblicata separatamente dall’argomento stesso, ma ogni pagina pubblicata ha il suo ID, quindi è possibile modificarle con un po’ di CSS. ad es.:

.published-page {
  &.testing-published-page.topic-276.foo {  /*questo è l'ID della mia pagina composto da topic-title+topic-ID+category-slug*/
    background-color: #c4ddc4;

    .published-page-header {
      background-color: #facccc;
    }

    blockquote {
      background-color: #facccc;
      border: 5px solid #fb7878;
    }
  }
1 Mi Piace
10

Grazie, apprezzo molto la tua risposta.
È possibile rendere il codice in modo che la pagina pubblicata erediti automaticamente il design del post originale?

11

Grazie per la tua risposta!
Mi sono ricordato di questa funzionalità. Questa funzione imposta lo sfondo per tutti gli argomenti di una particolare categoria. Posso codificare lo sfondo nell’editor dei post, solo per un post specifico. Senza personalizzare lo sfondo dell’intera sezione

12

Puoi mostrarmi un testo approssimativo e più specifico, come è scritto, altrimenti non posso?

image
image1327×510 69.9 KB

titolo-argomento = kody-css-dlya-nastrojki-oformleniya-temy
slug-categoria = staff
ID-argomento = image

Ecco la mia pagina pubblicata :point_down:

image
image1092×945 61.4 KB

13

Hai cercato i dettagli della pagina nell’ispettore del tuo browser?

14

no, perché non lo capisco.
intendi qualcosa del genere::backhand_index_pointing_down:?

image
image688×699 32.4 KB

15

Ho preso l’id dal browser :point_up_2:
image

16

Temo che le mie competenze CSS siano ancora limitate a semplici frammenti e modifiche, quindi non sono la persona migliore per insegnare nemmeno le basi. :slightly_smiling_face:

Abbiamo alcune guide che potrebbero esserti utili?

1 Mi Piace
17

Posso farti un’altra domanda, temo che nessun altro mi risponderà tranne te. Come si fa a creare un effetto simile di sfarfallio (bagliore) del pulsante?
Button-whatsapp gif

18

Ecco il codice del mio pulsante

[data-theme-button2] {
    display: flex;
    justify-content: end;
    a {
        padding: 10px 50px;
        background: #24E927;
        border-radius: 5px;
        border: 1px solid #004E7D;
        color: #004E7D;
        font-weight: 600;
    }
}
19

Puoi ottenere aiuto specifico per Discourse qui, ma dovrai andare altrove per ottenere trucchi CSS. Io uso solo Google e https://css-tricks.com/

4 Mi Piace
20

Ciao. Grazie per le informazioni :raised_hands:
Penso che sia meglio per me assumere uno specialista piuttosto che capire la programmazione. Mi sono dovuto occupare della questione del codice del pulsante. In questo momento, ho dovuto risolvere il problema con il codice del pulsante.

2 Mi Piace
21

Se hai bisogno di assumere qualcuno per modifiche CSS o qualcosa di più, puoi pubblicare su Marketplace e/o inviarmi un messaggio privato.

2 Mi Piace