Joomla.it Forum
Non solo Joomla... => Pubblica Amministrazione => : gigisam 28 Jan 2012, 10:17:42
-
Buongiorno a tutti, ho bisogno di un vostro aiuto e premetto che sono un neofita del mondo joomla...sto realizzando un sito per un comune e la mia difficoltà sta nel far adattare il banner automaticamente alle dimensioni del monitor di chi visita il sito del comune. Vi allego una foto per maggiore chiarezza e nascondo alcune parti per non far capire quale comune sia per non fare delle figuraccie con voi. Penso che si debba modificare il CSS ma non sono riuscito a trovare il punto esatto, oppure vi chiedo è possibile rendere tutto il template fisso? Cioè che si adatta automaticamente a tutti i monitor come per esempio il sito del tgcom... Grazie
[allegato eliminato da un amministratore essendo vecchio più di un anno]
-
Bisognerebbe sapere prima che template utilizzi, non possiamo inventarti il css a mano ;) Inoltre il layout fisso è un layout specificato in pixel/pt/ecc... mentre quello che vuoi si chiama layout fluido, specificato in %, in em ecc... che si adatta alle varie dimensioni del browser! Altrimenti puoi optare per un template responsive che si adatta anche ai vari supporti da cui si accede al sito!
-
Questo è il nome del template: accessible_metid... cosa mi consigli un template fisso oppure che si adatta(tramite modifica css)? Magari come realizzarlo
-
Beh dipende da cosa vuoi ottenere ;) Io credo sia indifferente ma sicuramente trattandosi di P.A. devi usare un template accessibile! quindi il mio consiglio è di buttarti più sullla validazione w3c!
-
La validazione del w3c non mi ha dato nessun errore...io vorrei che il banner si adattasse a tutti i monitor...mi serve una soluzione tramite esempi oppure la modifica per capire come si è intervenuti. Please
-
se devi regolarti in base al banner ti conviene utilizzare un layout fisso.
-
Giovi, scusa sto cercando di capire come impostare accessible_metid come layout fisso sapresti dirmi come fare?
-
Deciditi, prima hai detto che volevi renderlo adattabile ;) Innanzitutto se hai un link al sito postalo subito così sapremo darti un aiuto immediato!
-
layout fisso credo sia anche più semplice da realizzare
-
Gigi ti rispondo sul forum per rispetto alla community perchè chiuque potrebbe avere il tuo stesso problema. Per le prossime volte però fatti semplicemente pochi problemi perchè siamo tutti qui per imparare, aiutare e condividere i nostri problemi (ma anche le nostre soluzioni!), ma soprattutto siamo degli appassionati e non per forza dei maestri del webdesign ;) Quindi se i nostri lavori fanno semplicemente ridere, allora ridiamoci su perchè ci siamo divertiti, ci abbiamo messo tutto il nostro impegno ma soprattutto abbiamo sicuramente imparato qualcosa di nuovo perchè con joomla! è così, non avendolo sviluppato noi (io, te, tutti gli atri!) con le nostre mani non conosciamo obbligatoriamente a fondo il cms quindi è chiaro che ogni nuova scoperta non fa che arricchire la nostra conoscenza!
Posso dirti quindi che dovresti andare fiero per aver scelto di utilizzare joomla! per un sito del genere perchè in primis cominci a diffondere anche nelle amministrazioni questa filosofia contraria allo spreco di soldi per soluzioni I.T. che veramente(!!!!) fanno ridere (se ne sente molto il bisogno quindi hai anche tutto il mio appoggio!) e poi perché sicuramente stai usando un prodotto che ha dietro un magnifico supporto, quindi per qualunque problema sai che puoi rivolgerti al forum, permettimi, stra**ttendotene di questa specie di "timidezza" ;)
Approposito, prima con il discorso della validazione non intendevo sottolineare solo quell'aspetto ma anche l'accessibilità del sito. Io ora non conosco tutte le regole da adottare per i siti delle P.A. (mai toccato uno in vita mia!) ma è bene che ti informi sull'argomento perchè è un sito molto delicato.
ora veniamo al problema però altrimenti ti annoio troppo ;)
Alla riga 11 del file layout.css trovi:
width: auto !important;
sostituiscilo con un bel
width: 1000px !important;
ed hai risolto tutto in bellezza ;)
ora lo sfondo però resterà bianco quindi eventualmente puoi pensare di dargli un bello sfondo chiaro o verso l'azzurro!
-
Recepito in pieno tutta la prima parte della tua risposta, mentre tornando alla seconda parte modificando la riga che tu mi hai indicato resta fisso il layuot...non ho capito bene la storia dello sfondo
-
Giovi ho già effettuato la modificia che mi suggerivi...non mi sembra un bel risultato...puoi vedere anche te?così mi dai un suggerimento, un consiglio.......magari forse è meglio modificare il css???ma non saprei proprio come fare :-[ . Resta sempre il fatto che non ho capito ancora la storia dello sfondo
-
Hai modificato quel rigo? Non vedo il cambiamento
-
Beh si ho modificato quel rigo che mi hai indicato tu, possibile che non sinotinulla? E per modificare il CSs, cosa mi dici?
-
Prova a fare quella modifica ed a controllare che nel file in cui l'hai fatta il cambiamento sia stato registrato (chiudi il file e riaprilo se lo modifichi online, apri il file dopo averlo caricato se lo modifichi sul tuo computer e dopo lo carichi con filezilla!). Tutta la struttura del sito dovrebbe centrarsi (quindi prendere la lunghezza del banner che hai inserito) e gli spazi laterali dovrebbero rimanere bianchi (per ora!)
-
Questo è l'effetto che dovresti ottenere. Dimenticavo, il link al vecchio sito devi inserirlo con l'http:// iniziale altrimenti il server darà sempre pagina inesistente!
[allegato eliminato da un amministratore essendo vecchio più di un anno]
-
Come vedi (me ne accorgo solo ora) il div centrale scende a causa della sua larghezza eccessiva: per rimediare ti basterà usare anzichè 1000px come valore di width qualcosa come 1120px.
-
Ok grazie...io sto cercando ora di vedere il CSs come modificarlo...qualche dritta???
-
puoi usare qualunque editor di testo. Che programma usi per caricare i file sul server?
-
Uso Montepaschi e file zilla , avresti da darmi qualche dritta su come modificare il CSs? Magari qualche riga di codice
-
Non Montepaschi ma notePad non so come si uscito :-)
-
gigi ma in che senso? Te l'ho scritto all'inizio della discussione cosa devi fare! :)
Comunque ti consiglio di utilizzare notepad++, che ti da più strumenti per le modifiche ed è più comodo!
-
Nel CSs e più precisamente nella skin white voglio modicare il codice così posso inserire un div che si allarga automaticamente, questo mi e' stato richiesto la modifica che mi hai suggerito precedentemente non va bene. Ecco perché ti chiedevo delle dritte sulle modifiche del css
-
questo potevi farmelo capire subito :) Allora secondo me le soluzioni sono 2:
- usi un'immagine png con uno scorcio della città ed uno sfondo trasparente e la allinei all'interno del banner a destra in modo che sia sempre sul bordo dx della pagina
- inserisci come banner un'immagine panoramica della città che arrivi almeno a 1300px di larghezza così che la zona che ora è vuota non resti mai scoperta.
se qualcosa non è abbastanza chiara chiedi pure!
-
Scusa per la poca chiarezza... Ho già creato e immagini png la prima con logo e la scritta del comune , la seconda il div, la terza con le immagini della città. Ma separate come le metto? Creo una sola immagine? Oppure posso fare in modo diverso?
-
Guarda come sta ora...cosa e' venuto fuori
-
dentro il div top ci potresti mettere un'immagine allineate con float:right; o con position:absolute;
questa immagine (può essere quel palazzo magari) deve avere uno sfondo trasparente, ma va bene anche così inizialmente per farti capire cosa intendo.
Quindi avrai <div id="top">
<div class="padding">
<div id="accessibility-links">
.......tante scritte...............
</div>
</div>
<img style="position:absolute; bottom:0; right:0; style="float:right;" src="..........">
</div>
-
domani vedrò quanto mi suggerisci...spero solo di capirci qualcosa in più di adesso...grazie giovi
-
Giovi ma nella skin white a che rigo metto il codice che ho creato? Buona giornata
-
questo è un codice html che andrebbe messo all'interno del file index.php del tuo template!
-
Ciao Giovi, scusa per non essermi fatto vivo prima e per non averti informato su come procede, voglio farti vedere il codice che ho fatto(non mi funziona) e farti vedere anche le immagini che ho realizzato per vedere se riesce a darmi qualche dritta. Allora la prima immagine (tutte png) è il logo, che vorrei realizzare anche in modo linkabile se si può fare, la seconda invice è il colore che rende fluido il tutto mentre la terza quella che va destra sono i simboli...ti allego anche il codice
[allegato eliminato da un amministratore essendo vecchio più di un anno]
-
Ciao Giovi, scusa per non essermi fatto vivo prima e per non averti informato su come procede, voglio farti vedere il codice che ho fatto(non mi funziona) e farti vedere anche le immagini che ho realizzato per vedere se riesce a darmi qualche dritta. Allora la prima immagine (tutte png) è il logo, che vorrei realizzare anche in modo linkabile se si può fare, la seconda invice è il colore che rende fluido il tutto mentre la terza quella che va destra sono i simboli...ti allego anche il codice
[allegato eliminato da un amministratore essendo vecchio più di un anno]
-
Hai colto in pieno il messaggio ;)
Io farei una modifica strutturale all'header del template. Piuttosto che fare tutto tramite css potresti modificare il file index.php del template inserendo al posto del div che c'è attualmente questo codice:
<div id="header">
<img src="logo_man.png" class="logo" />
<img src="bannerin.png" class="banner" />
</div>
il css sarà così invece:
#header{background: url(../images/sanpietr.png) repeat-x;}
#header .logo{float:left;}
#header .banner{float:right;}
Tutto semplice semplice ;)
-
Dimenticavo, per rendere linkabile il logo:
<div id="header">
<a href="<?php echo $this->baseurl ?>/" >
<img src="logo_man.png" class="logo" />
</a>
<img src="bannerin.png" class="banner" />
</div>
-
mi consigli di modificare solo il file index.php ma una domanda...ma poi l'immagine dello sfondo con il colore che permette d'essere fluido cos' non c'è
-
invece si ;) nella piccola porzione di css che ti ho postato c'è scritto che lo sfondo va ripetuto verticalmente per tutto quanto il banner!
-
adesso è chiaro...quindi poche righe sia nel file index.php che nel css skin.white quindi sostituisco il
body.white div#top con body.white div#header
mentre quello del logo linkabile nel file index.php giusto???
-
in linea teorica è esatto ma il tuo template, vedo, prevede anche una toolbar all'iterno del template (ovvero il div "padding"). Per cui potresti fare quanto segue:
-appena si chiude il tag del div con class="padding" (quindi dopo il tag di chiusura </div> corrispondente a tale div) incolli il codice html che ti ho suggerito:
<div id="header">
<a href="<?php echo $this->baseurl ?>/" >
<img src="logo_man.png" class="logo" /></a>
<img src="bannerin.png" class="banner" />
</div>- alla fine del tuo css (non modificare niente di quello che è già scritto nel file!!!) ci inserisci quest'altro codice, adattato alla tua situazione:
#header{background: url(../images/sanpietr.png) repeat-x; height:200px; width:100%; }
#header .logo{float:left;}
#header .banner{float:right;}
Se riesci a fare questa prova subito vediamo che succede!
-
farò la prova lunedì mattina e poi ti farò sapere mooooolto volentieri
-
Giovi guarda come e' venuto con le modifiche...cosa ho sbagliato?
-
1. devi incollare il codice dentro il div top, appena sotto padding (invece è dentro wrapper ma appena sotto top).
2. hai usato il codice che ti ti ho postato? Manca il logo ed il link è associato al banner anzichè al logo
-
Certo ho usato il codice che mi hai dato, vedo l'errore del codice del padding
-
Guarda ora???
-
ottimo, ora devi solo aggiustare i link delle immagini. ora come ora le immagini dovrebbero trovarsi nella root del sito (se le sposti li funzionerà), se le vuoi tenere in un altra path devi correggere le url delle immagini nel codice
-
Cosa devo fare con le immagini?
-
fai prima buttandole nella cartella principale del sito
-
Guarda cosa e' successo adesso
-
1. il div "header" ti ho detto di metterlo appena chiuso il tag di "padding", non subito prima che venisse chiuso.
2. aggiungi questo div appena alla fine del codice che hai incollato tu:
<div style="clear:both"></div>
edit:attenzione: clear:both, non clear come era scritto prima
se non metti i tag nelle posizioni giuste non si capirà mai da cosa deriva il problema...
-
Le ho provate tutte...ho inserito il codice in vari posti cambiava il banner manon con l'effetto desiderato
-
Ok andiamo per gradi e mettiamo da parte il problema del menu per un istante. Se il metodo float non ti soddisfa puoi provare così:
questo appena chiuso il tag padding (quindi cancelli tutto ciò che c'era prima)
<img src="logo_man.png" />e questo è il css (idem):
#top{background: url(../images/banner.png) no-repeat right;}
-
Ho provato queste ultime modifiche ma il risultano non e' stato quello sperato, dopo continuo a modificare il codice precedente
-
Ho capito dove sta il problema in pratica l'immagine bannerin blocca la barra di sotto. L'immagine bannerin dovrebbe salire sopra ed essere gestita per tutto il banner, vedi il sito di manduria fatto con una versione di joomla 1.08 e che lo ha fatto non c'e più
-
Giovi scusa ma per salire il banner che faccia anche parte del pudding, come posso fare?
-
Cosa intendi per salire?
-
Hai visto quello di manduria? In poche parole far salire il banner impostando il colore trasparente così si vede il bannerin dove ci sono i pulsanti di "+" "-" ecc.. Così poi il blocco del padding dove c'è "la città" "l'amministrazione" ecc.. Restano così come stanno ora, se guardi manduria e' più chiaro
-
in quel sito hanno adottato la II soluzione che ti ho consigliato, ovvero quella dell'immagine come sfondo e non come immagine.
la prossima volta comunque specifica cos'è manduria, non siamo mica tutti del salento qui ;)
-
Scusa per non aver specificato ... Quindi ricapitolando usando la seconda soluzione il codice per rendere il logo link abile lo metto sempre, giusto? Adesivo provo nuovamente la seconda soluzione......
-
Giovi ho appena usato la seconda soluzione ma esce solo il logo, non linkabile, poi togliendo dopo quello che viene dopo padding vanno via le impostazioni di zoom ecc.. Non esce come la città di manduria
-
gigi più che postarti il codice adatto non saprei che fare, ovviamente dovrai essere tu ad adattarlo alla situazione.. se non ti intendi di css ed html è inutile che ti avventuri per queste strade, prova a leggere qualche guida prima, in fondo non è difficile!
per aggiungere il link (che è una cosa che puoi tranquillamente vedere alla fine perchè il tuo problema principale è assicurarti che la struttura del banner sia adattabile!) basta racchiudere l'oggetto che vuoi linkare nei tag <a href="..........."> </a>
-
Perdonami se ho abusato della tua pazienza, ora devo solo inserire il colore di sfondo......cosa ne pensi?