Joomla.it Forum

Joomla! 3 => Joomla! 3 => : danjde 10 Oct 2017, 18:19:55

: [RISOLTO] Sostituire il titolo del modulo con immagine
: danjde 10 Oct 2017, 18:19:55
Salve amici,
ho letto questo post (http://forum.joomla.it/index.php?topic=71712.0) su come sostituire un immagine ad un titolo modulo.
Purtroppo nel mio caso qualcosa non sembra andare per il verso giusto e dunque non riesco a visualizzare l'immagine.

Ciò che ho fatto è:

1) Ho inserito nel modulo il module class suffix: _marablog
 2) Ho creato in custom.css la classe: .moduletable_marablog h3
 3) dove ho posto il seguente codice:

:
.moduletable_marablog h3 {
        background:transparent url(../images/mara-k2-avatar.png) no-repeat scroll 49px -12px;
        color:#ffffff;
        height:81px;
        font-size:0;
}

allego lo screenshot da Firebug

Grazie infinite!

Davide
: Re:Sostituire il titolo del modulo con immagine
: giusebos 10 Oct 2017, 23:38:44
:
.moduletable _marablog h3 {
        background:transparent url(../images/mara-k2-avatar.png) no-repeat scroll 49px -12px;
        color:#ffffff;
        height:81px;
        font-size:0;
}
: Re:Sostituire il titolo del modulo con immagine
: danjde 11 Oct 2017, 09:34:40
Grazie "giusebos"!

Eh, sapessi, le ho provate tutte, ma non prende i nuovi attributi!
Non so capire, non sono di certo un mago con i css, ma non riesco a capire dove sbaglio!
Ho provato ad impostarli anche direttamente da firebug/analizza elemento ma niente.

Se vuoi, se hai tempo, se hai voglia di curiosare, ecco qui (https://www.veronalive.it/index.php) l'url

Grazie ancora della tua gentilissima disponibilità :-)

Davide
: Re:Sostituire il titolo del modulo con immagine
: Alex21 11 Oct 2017, 11:02:56
. . . Eh, sapessi, le ho provate tutte, ma non prende i nuovi attributi! . . .
Provate quasi tutte, altrimenti funzionerebbe.  :)


Purtroppo i css hanno il difettuccio che solitamente funzionano nella pagina per cui sono stati scritti. Quando li si copia fanno cilecca, per questo o per quello.


Riguardiamoli, iniziando da questo: url(../images/mara-k2-avatar.png)  . Per quello che capisco dovrebbe esserci l'immagine a questo url:  https://www.veronalive.it/images/mara-k2-avatar.png  . Però mi dà 404 - page not found.  Dove hai messo l'immagine?
Ciao!

: Re:Sostituire il titolo del modulo con immagine
: danielecr 11 Oct 2017, 12:43:38
2) Ho creato in custom.css

Ciao,
oltre alle cose già scritte, magari mi sbaglio, ma se guardo il sorgente della pagina che hai linkato poco sopra, non vedo il caricamento del file custom.css, quindi assicurati che il file dove scrivi le istruzioni sia caricato.
Se poi ti confondi con ../ e le posizioni relative puoi sempre usare il percorso copleto del tipo
:
url('http://sito.com/percorso/cartella/immagine/immagine.png')
: Re:Sostituire il titolo del modulo con immagine
: danjde 11 Oct 2017, 17:06:50
Hey! Grazie a tutti del gentilissimo aiuto!
Vorrei in effetti capire (per imparare) meglio dove sta l'inghippo :-D

Ho provato a sostituire il path relativo con uno assoluto, ma nisba!
Allora ho provato ad assegnare i valori unicamente al tag ".g-title" e per la prima volta vedo l'immagine (poi devo sistemare le dimensioni) al posto del testo:

:
.g-title {
        background:transparent url(../../../../images/stories/veronalive/logo/K2/mara-k2-avatar.png) no-repeat scroll 49px -12px;
        color:#ffffff;
        height:81px;
        font-size:0;
}


Ovviamente usando il tag ".g-title" generico mi ritrovo la stessa immagine su ogni modulo titolo.

Allora ho provato con i tag:

:
.g-title .moduletable _marablog h3
.g-title _marablog
.g-title h3 (tanto per provare)
.moduletable _marablog .g-title

nulla, nulla, nulla!


PS
"le ho provate ..quasi tutte" (eccetto l'unica giusta) :-D

Grazie ancora


: Re:Sostituire il titolo del modulo con immagine
: Alex21 11 Oct 2017, 19:32:19
Mi sembra che ci siano sostanziali miglioramenti.  Il file css personale  c'è  e pure il percorso dell' immagine, che si vede.
Adesso bisogna raggiungere quel particolare <h3>.
Toccando ferro si può provare così:
:
.moduletable._marablog h3{
background:transparent url(../../../../images/stories/veronalive/logo/K2/mara-k2-avatar.png) no-repeat scroll 49px !important;
color:#ffffff;
height:81px;
font-size:0;
}
oppure
.moduletable._marablog .g-title{

background:transparent url(../../../../images/stories/veronalive/logo/K2/mara-k2-avatar.png) no-repeat scroll 49px !important;
 color:#ffffff;
 height:81px;
 font-size:0;
}
Se togli -12px si allinea giusto in altezza.
Ciao!

: Re:Sostituire il titolo del modulo con immagine
: danjde 11 Oct 2017, 21:35:58
WAW Alex, hai fatto centro!
Vanno bene entrambe e in effetti sia "h3" che "g-title" identificano in modo univoco quella porzione di modulo.

Il problema dipendeva evidentemente dal fatto che tra i vari tentativi non avevo "attaccato" il tag e aggiunto il punto insieme.
Non sapevo che i tag si potessero "attaccare" anche se il punto li precede.

Ma del resto ci sono un infinità di cose che ignoro e più imparo e più mi rendo conto di essere ignorante... :-D


Grazie grazie grazie grazie grazie a tutti!!!!