Impostare uno stile diverso per H2, H3, ecc.

[medicinapertutti]

Ciao a tutti!
Quando scrivo un articolo nel sito, imposto i vari H2, H3, H4, ecc. ai titoli dei vari paragrafi. Vorrei che ognuno abbia uno stile proprio (non so se è il termine adatto) che venga automaticamente impostato.
Ad esempio, vorrei che un titolo H2 sia scritto in rosso, corsivo, carattere 15; H3 deve essere in blu, neretto e carattere Times New Roman 13; e così via...
Suggerimenti?

[alemoppo]

Sicuramente potresti farlo con un CSS personalizzato, tipo:

H3{
color:#00F;
font-weight: bold;
font-family: ...
}

Forse esistono anche plugin che fanno questa cosa, prova a cercare un attimo. Altrimenti puoi sempre utilizzare CSS, se hai dei problemi fai sapere.

Ciao!

[medicinapertutti]

Sicuramente potresti farlo con un CSS personalizzato, tipo:

H3{
color:#00F;
font-weight: bold;
font-family: ...
}

Forse esistono anche plugin che fanno questa cosa, prova a cercare un attimo. Altrimenti puoi sempre utilizzare CSS, se hai dei problemi fai sapere.

Ciao!

Grazie della risposta!
Ho provato ad aggiungere il codice ma non funziona. E' come se le impostazioni di base del sito prevalgano su quelle che aggiungo nel CSS personalizzato.

[alemoppo]

Vedo che lo hai aggiunto, ma è commentato:

/* 
h2 {
  font-family: sans-serif;
  font-size: 30px;
  margin-top: 30px;
}
aggiunto per modificare lo stile di H2 */

Si tratta di quello?

Ciao!

[medicinapertutti]

Sì, era quello prima che lo modificassi.
Facendola semplice, ho visto che se inserisco questo codice per cambiare il colore dell'H2

h2 {
  color:red;
}

il colore di H2 resta nero.
Funziona se invece aggiungo !important, in questo modo.

h2 {
  color: red !important;
}

E' un modo corretto?

Questa è una pagina di esempio.

[alemoppo]

Nella riga 308 viene impostato:

#page-content h2

Quindi, con:

#page-content h2 {color:red;}

Dovrebbe funzionarti correttamente.

Ciao!

[medicinapertutti]

Funziona sia con #page-content h2 che con .post-content h2, a patto che ci aggiunga !important
Attualmente ho inserito il seguente codice e mi sta bene:

.post-content h2 {
  color: #0e6ebe !important;
  font-weight: bold;
  margin-top: 30px;

Ciò che ora non capisco è che se provo a fare modifiche simili a .av-latest-post-single h4 (sarebbe il testo che compare nel widget "Ultimi articoli"), alcune modifiche le fa ma altre no.
Ad esempio, attualmente c'è:

.av-latest-post-single h4 {
  display: inline-block;
  font-size: 20px;
  font-family: Georgia, serif;
}

ma se quel testo, ad esempio, lo volessi fare rosso (con color: red;), non capisco perché non va.

Grazie delle risposte!

[alemoppo]

Funziona sia con #page-content h2 che con .post-content h2, a patto che ci aggiunga !important

A me risulta che con

#page-content h2 {color:red;}

funziona senza !important.

Ciò che ora non capisco è che se provo a fare modifiche simili a .av-latest-post-single h4 (sarebbe il testo che compare nel widget "Ultimi articoli"), alcune modifiche le fa ma altre no.
Ad esempio, attualmente c'è:

.av-latest-post-single h4 {
  display: inline-block;
  font-size: 20px;
  font-family: Georgia, serif;
}

ma se quel testo, ad esempio, lo volessi fare rosso (con color: red;), non capisco perché non va.

Prova con:

#page-content .ashe-widget a
{
  color:red;
}

EDIT:
Se vuoi solamente i titoli degli ultimi articoli, prova così:

#page-content .ashe-widget h4 a
{
  color:red;
}

Ciao!

[medicinapertutti]

A me risulta che con

#page-content h2 {color:red;}

funziona senza !important.

Hai ragione, evidentemente avevo sbagliato qualcosa.

EDIT:
Se vuoi solamente i titoli degli ultimi articoli, prova così:

#page-content .ashe-widget h4 a
{
  color:red;
}

Ciao!

Se invece volessi solamente i titoli degli articoli più letti?

Grazie mille, alemoppo! Cercherò di non disturbare più dopo. :)