Joomla.it Forum

Joomla! 3 => I Template di Joomla! 3 => : tomtomeight 27 Jul 2016, 14:07:54

: [Risolto] Distanziare testo (padding) su articolo con sfondo immagine.
: tomtomeight 27 Jul 2016, 14:07:54
Buongiorno

Sto rifacendo un sito da flash a joomla, e praticamente deve risultare uguale nella grafica e contenuti.
palazzopaterno.it/index.html sito in flash
palazopaterno.it/la-famiglia.html in joomla
Template Gantry Helium
il contenuto della pagina joomla lnkata sopra deve essere uguale alla pagina flash cliccando la prima voce del menù flash La famiglia.

Per ottenere la stessa grafica ho inserito la stessa immagine della corrispondente flash come sfondo del container, il problema è quello di abbassare il testo dell'articolo rispetto allo sfondo, dopo vari inutili tentativi ho agito su margine di  "body p"  giusto per andare avanti sul lavoro e far vedere i risultati anche se parziali. Ovviamente non è la strada giusta visto che ad ogni paragrafo mi inserisce il margine. C'è altro modo per inserire immagine di sfondo slegata dal contenuto in modo da poter aggiustare il testo senza modificare anche lo sfondo?

Grazie
: Re:Distanziare testo (padding) su articolo con sfondo immagine.
: giusebos 27 Jul 2016, 14:26:14
Potrebbe andare bene se quella regola si applicasse solo al primo paragrafo?


:
body p:first-child {
margin-top:10px;
}
: Re:Distanziare testo (padding) su articolo con sfondo immagine.
: adottauncane 27 Jul 2016, 16:13:42
Prova a metterla così:

:
.g-content, bg-main {
    margin: 0 auto;
    max-width: 938px;
    min-height: 663px;
}
.g-content, bg-article {
    font-size: 15px;
    font-weight: 600;
    line-height: 19px;
    margin: 0 auto;
    max-width: 938px;
    min-height: 500px;
}
body p {
    margin-top: 100px;
    padding: 20px;
}
#g-page-surround {
    background: #922c2c none repeat scroll 0 0;
}
#g-mainbar, bg-article {
    background-color: #922c2c;
    background-image: url("../../images/bgarticle.jpg");
    background-position: 50% 20%;
    background-repeat: no-repeat;
}

 body p {margin-top:100px; padding:20px;}

.pagenavcounter {padding-left:20px;}

Non riesco a vedere la home, immagino sarà da inserire come avevi fatto in .g-content.
Inoltre dovrai probabilmente ritoccarla per i @media e farla comunque più lunga.
: Re:Distanziare testo (padding) su articolo con sfondo immagine.
: tomtomeight 27 Jul 2016, 18:31:36
Intanto  Grazie adesso provo e poi vi dico, solo per un po' devo sospendere questo lavoro e poi ci ritorno.

La home ha un bg diverso senza testo, ho adottato due stili diversi con classe custom nella sezione main del template bg-article per gli articoli e bg-main per la home da aggiungere alla classi proprie del template.
: Re:Distanziare testo (padding) su articolo con sfondo immagine.
: tomtomeight 01 Aug 2016, 12:22:52
Riprendo la discussione.
Ho agito sul titolo dell'articolo e abbassandolo credo di aver risolto, ho altre domande ma apro un altro post. Grazie.
: Re:[Risolto] Distanziare testo (padding) su articolo con sfondo immagine.
: adottauncane 01 Aug 2016, 13:07:17
Così però ti deforma l'immagine... Secondo me devi metterla svincolata dal testo...
: Re:[Risolto] Distanziare testo (padding) su articolo con sfondo immagine.
: tomtomeight 01 Aug 2016, 13:27:23
Nella home non ho testo e dovrebbe andare bene, negli articoli invece l'immagine anche se distorta non provoca grandi problemi, adesso il logo fa parte della immagine e quindi viene distorto ma conto di separarlo. Comunque ogni consiglio è ben accetto. adesso sto riproducendo la sezione "Il Palazzo".
: Re:[Risolto] Distanziare testo (padding) su articolo con sfondo immagine.
: adottauncane 01 Aug 2016, 15:03:35
Se separi il marchio dallo sfondo allora va bene... :)