Back to top

Autore Topic: Intervenire nel css di un template Gantry  (Letto 4533 volte)

Offline kiaBS

  • Esploratore
  • **
  • Post: 131
    • Mostra profilo
Intervenire nel css di un template Gantry
« il: 12 Feb 2013, 13:47:17 »
Ciao a tutti!
Ho iniziato a usare Grantry Framework..ho però un problemino e vorrei capire se è dovuto a qualche mio errore o meno..dovrei fare una modifica intervenendo sul css ma ho notato che il file è contenuto non nella "normale" cartella css ma in css-compiled e inoltre non è per niente editato..devo mettere delle impostazioni io, o è normale la cosa?
Grazie mille!

Offline kiaBS

  • Esploratore
  • **
  • Post: 131
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #1 il: 12 Feb 2013, 14:23:51 »
Ri-ciao..ho letto in questo post
http://forum.joomla.it/index.php/topic,182212.0.html
che dovrei seguire quella procedura..ma..visto che aggiungerei delle parti per definire meglio delle zone del body o di qualsiasi altro posto, non rischio poi che queste non mi vengano visualizzate? Devo seguire delle regole o indicazioni?
Scusatemi tanto ma è la prima volta che uso Gantry..
Grazie!!

Offline kiaBS

  • Esploratore
  • **
  • Post: 131
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #2 il: 12 Feb 2013, 15:03:25 »
..forse è meglio se faccio l'esatto esempio di quello di cui ora ho bisogno..
nel sito www.magentahomme.com/demo devo fare in modo che il menu che è posizionato nel footer sia orizzontale..ho capito che allora dovrei aggiungere le modifiche css in un file detto gantry-custom.css e io ho scritto questo
Codice: [Seleziona]
body div#rt-footer-sorround div.rt-footer {
background-color: none;
}


body .module-content li {
background-color: none;
display:inline;
font-size: 14px;
font-weight: bold;
padding-bottom: 0em;
padding-left: 1em;
padding-right: 1em;
padding-top: 0em;
border-right:2px solid black;
}


body div#rt-footer .module-content a {
color: black;
border-bottom:none;
padding-right:2px;
}


body div#rt-footer .module-content a:hover {
color: black;
background-color:none;
padding-right:2px;
}


l'effetto non è quello da me voluto, nonostante su un altro sito mi abbia funzionato! Non so se devo fare riferimento a tutti i div che stanno nel footer che sono messi da Gantry!..
In poche parole non so come operare su questo Css..qualcuno ha consigli o aiuti da darmi?..Grazie ancora!!!  :(

Offline Gokuale - Takumi

  • Appassionato
  • ***
  • Post: 528
  • Sesso: Maschio
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #3 il: 12 Feb 2013, 15:10:37 »
ciao comincia a mettere il display : inline-block; riga 8
poi lavori sugli altri valori
ciao
Puoi arrivare fino a 11.000 giri
Ma soprattutto ........ VINCI!!!!
nd. Bunta - the real DK

Offline kiaBS

  • Esploratore
  • **
  • Post: 131
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #4 il: 12 Feb 2013, 15:13:48 »
Grazie mille!!
Ma quindi mi basta inserire così, "normalmente", in questo file css?
Grazie mille ancora!!
C'è altro che dovrei tenere in considerazione, riferito a Gantry?

Offline Gokuale - Takumi

  • Appassionato
  • ***
  • Post: 528
  • Sesso: Maschio
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #5 il: 12 Feb 2013, 15:16:18 »
comunque ricordati che le regole CSS valgono sempre e comunque, ma il dove posizionarle non e' sempre nello stesso modo

per esempio hai usato la classe

body .module-content li

ma non e' detto che in un template la trovi, ogni volta che metti mano ad un template devi essere certo di dove metti le mani non copiando pezzi di codice qua e la perche' funzionavano su un altro sito

ovviamente se i siti hanno lo stesso template ti direi di si che fai bene ovviamente
ciao
 ;D ;D ;D ;D ;D ;D ;D ;D
Puoi arrivare fino a 11.000 giri
Ma soprattutto ........ VINCI!!!!
nd. Bunta - the real DK

Offline kiaBS

  • Esploratore
  • **
  • Post: 131
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #6 il: 12 Feb 2013, 15:25:27 »
Sì, infatti ho guardato tramite Firefox il riferimento del div giusto..
ma come mai i file css di Gantry non sono organizzati come gli altri template?

Offline xplosion

  • Global Moderator
  • Instancabile
  • ********
  • Post: 4047
  • Sesso: Maschio
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #7 il: 12 Feb 2013, 15:31:38 »
Sì, infatti ho guardato tramite Firefox il riferimento del div giusto..
Intendevi Firebug credo...

Offline kiaBS

  • Esploratore
  • **
  • Post: 131
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #8 il: 12 Feb 2013, 15:50:52 »
Sì, scusami, nella fretta ho scritto sbagliato!
Mi sapresti dire cosa devo guardare se voglio fare delle modifiche css? Nel senso..ho visto che alcune cose devo aggiungerle nel file gantry-custom.css ma altre, come ad esempio l'immagine di background, devo farlo con i file presenti in libraries/gantry/css..come mai? Come faccio dove andare a toccare quali file senza guardare tutte le volte il forum?..
Grazie mille!



Offline Gokuale - Takumi

  • Appassionato
  • ***
  • Post: 528
  • Sesso: Maschio
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #9 il: 12 Feb 2013, 15:55:05 »
la cosa migliore che ti posso suggerire e' di studiarti priam la documentazione del framework
http://www.gantry-framework.org/documentation

poi al massimo chiedi quali file devi modificare pero' ricordati che nel caso ci sia un aggiornamento del framework potresti incappare in perdite di codice se modifichi il base

e' come se tu modificassi l'output di un modulo scrivendo la mod sul file presente nella cartella modules senza usare l'override, in caso di aggiornamento di quel modulo ti perdi la modifica

ciao
Puoi arrivare fino a 11.000 giri
Ma soprattutto ........ VINCI!!!!
nd. Bunta - the real DK

Offline kiaBS

  • Esploratore
  • **
  • Post: 131
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #10 il: 12 Feb 2013, 16:09:45 »
uh.. :o  mi sono veramente persa.."il base" sarebbe?
quindi dovrei fare l'override di tutto quanto? ma come posso farlo ad esempio del css del menu footer?..
grazie per la pazienza!


altra cosa:
devo aggiungere un'immagine in background..ho seguito i suggerimenti dati da altri topic
1) ho caricato l'immagine in libraries/gantry/images
2) ho aggiunto al file libraries/gantry/css/gantry.css la seguente linea di codice
 
Codice: [Seleziona]
body {color: #333; background: url(../images/bg.png) repeat !important;}
ma nulla.. :(
« Ultima modifica: 12 Feb 2013, 16:11:54 da kiaBS »

Offline Gokuale - Takumi

  • Appassionato
  • ***
  • Post: 528
  • Sesso: Maschio
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #11 il: 12 Feb 2013, 16:20:02 »
se c'e' previsto un file custom.css io metteri dentro tutto li in modo che non ti perdi nulla altrimenti te lo fai a mano e lo leghi all'index.php del template cosi' sei sicura che a meno di cambiare template il file con le tue regole CSS verranno sempre allicate

ciao
Puoi arrivare fino a 11.000 giri
Ma soprattutto ........ VINCI!!!!
nd. Bunta - the real DK

Offline kiaBS

  • Esploratore
  • **
  • Post: 131
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #12 il: 12 Feb 2013, 16:34:29 »
..capito..ora provo a vedere cosa riesco a fare! Hai per caso qualche idea sul perchè non mi funzioni il caricamento dell'immagine?..
grazie mille ancora..!!

Offline xplosion

  • Global Moderator
  • Instancabile
  • ********
  • Post: 4047
  • Sesso: Maschio
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #13 il: 12 Feb 2013, 16:37:42 »
Infatti, devi utilizzare al massimo il custom css.
Quindi:
- crea il file nometemplate-custom.css
- carica l'immagine di background in templates\nometemplate\images\patterns
- aggiungi una riga di codice nel tuo nometemplate-custom.css del tipo:
Codice: [Seleziona]
body{
    background:url(../images/patterns/background.png) repeat !important;}

In più per avere precedenza mi sa che devi aggiungere (per tutti gli ID) anche una riga simile a questa:
Codice: [Seleziona]
#rt-header .rt-container {
    background: none!important;}

Prova e facci sapere.

Offline kiaBS

  • Esploratore
  • **
  • Post: 131
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #14 il: 12 Feb 2013, 16:47:23 »
ooooh!HA FUNZIONATOOO! grazie milleeeee!  ;D
ma scusa una domanda, perchè non ci sto veramente capendo più nulla, come mai in altri topic c'era scritto invece di mettere l'immagine e la modifica da un'altra parte?!  :-\  mi dispiacerebbe continuare a "rompere" sul forum, vorrei capire la logica che devo seguire per sapere dove mettere le modifiche!Grazie ancora per l'infinita pazienza!

Offline xplosion

  • Global Moderator
  • Instancabile
  • ********
  • Post: 4047
  • Sesso: Maschio
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #15 il: 12 Feb 2013, 16:51:33 »
Non so dove hai letto questo, ma e una buona norma se lavori sulla personalizzazione del template (in questo caso gantry) e bene di cercare di inserire tutto (css, immagini, i file dell'override) dentro la cartella del tuo template.

Offline Gokuale - Takumi

  • Appassionato
  • ***
  • Post: 528
  • Sesso: Maschio
    • Mostra profilo
Re:Intervenire nel css di un template Gantry
« Risposta #16 il: 12 Feb 2013, 16:53:37 »
di norma la path di

Codice: [Seleziona]
background: url(../images/nomeimmagine.ext);
parte dalla cartella http://tuosito.XX/templates/nometemplate/
quini l'immagine dovrebbe risiedere nella cartella images del tuo template o in una sua sottocartella con relaiva path aggiornata come quella che ti ha passato Xplosion
nel caso che il css abbia variabili identificate e riconosciute dal framework allora puoi cambiare il tutto

ciao
 ;D ;D ;D ;D ;D ;D ;D ;D ;D
Puoi arrivare fino a 11.000 giri
Ma soprattutto ........ VINCI!!!!
nd. Bunta - the real DK

 



Web Design Bolzano Kreatif