Pagina 1 di 1
Dimensione logo e risoluzione schermo
Inviato: 29/09/2013, 21:03
da potrikkia
ciao a tutti,
come faccio a far si che il site_logo nel tema prosilver occupi tutto lo spazio fino alla fine del form di ricerca(cioè tutto il rettangolo in alto all'inizio della pagina) e che questa cosa resti anche guardando il forum da altri pc con risoluzioni differenti dello schermo??
perchè su alte risoluzioni il logo è piccolo e arriva a metà pagina mentre su basse risoluzioni arriva anche dopo il form di ricerca...
vi ringrazio
Re: Dimensione logo e risoluzione schermo
Inviato: 29/09/2013, 21:27
da Barrnet
Un link al forum sarebbe utile per determinare il problema.
Considera che il layout è liquido ergo si adatta in % rispetto alla larghezza in px dello schermo, se vuoi occupare a prescindere tutta la larghezza devi o rendere fissa la larghezza o allargare in maniera dinamica il logo, magari usando un .svg, nel secondo caso dovrai fare attenzione all'altezza del logo, che crescerà per mantenere le proporzioni con la larghezza.
Re: Dimensione logo e risoluzione schermo
Inviato: 30/09/2013, 8:41
da potrikkia
ecco il link
www.lupirovereto.com/forum
vorrei che al posto del rettangolo verde ci fosse l'immagine...anche sotto al form di ricerca.
Non è che invece di agire sul site_logo che va a coprire il rettangolo verde mi conviene modificare il rettangolo verde vero e proprio? però non saprei dove mettere le mani..
Re: Dimensione logo e risoluzione schermo
Inviato: 02/10/2013, 12:36
da potrikkia
nessuno?
Re: Dimensione logo e risoluzione schermo
Inviato: 02/10/2013, 13:30
da Tiger
Con Photoshop,ti crei un'immagine-logo di queste dimensioni:
1250x120px
Apri il tuo colours.css e trovi:
Codice: Seleziona tutto
.headerbar {
background-color: #5e7f3a;
background-image: url("{T_THEME_PATH}/images/bg_header.gif");
color: #FFFFFF;
}
Sostituendolo con:
Codice: Seleziona tutto
.headerbar {
background-color: #5e7f3a;
background-image: url("{T_THEME_PATH}/images/tuaimmagine.estensione(gif;png;jpg)");
background-repeat: no-repeat;
color: #FFFFFF;
}
Poi apri il tuo common.css:
trovi:
Codice: Seleziona tutto
.headerbar {
background: #ebebeb none repeat-x 0 0;
color: #FFFFFF;
margin-bottom: 4px;
padding: 0 5px;
}
sostituendolo con:
Codice: Seleziona tutto
.headerbar {
background: #ebebeb none repeat-x 0 0;
color: #FFFFFF;
margin-bottom: 4px;
padding: 0 5px;
height: 120px;
}
Apri il tuo overall_header.html:
trovando:
aggiungendo prima di esso:
trovando:
Codice: Seleziona tutto
<a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a> {S_SEARCH_HIDDEN_FIELDS}
</fieldset>
</form>
</div>
<!-- ENDIF -->
aggiungendo dopo:
</div>
Infine trovi:(nel caso il logo di default non ti serva piu':
Codice: Seleziona tutto
<a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>
commentandolo diventerebbe:
Codice: Seleziona tutto
<!--<a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>-->
Aggiorni temi e template da pca infine svuoti la chace da pca.
Re: Dimensione logo e risoluzione schermo
Inviato: 03/10/2013, 8:24
da potrikkia
come mai devo creare il logo con risoluzione 1250x120px?
se impostassi il forum con risoluzione fissa di 1024x768?
Re: Dimensione logo e risoluzione schermo
Inviato: 03/10/2013, 11:42
da Tiger
Quella che ti ho proposto e' soltanto una delle tante soluzioni che si possono adottare ad esempio per personalizzare il propio . header con un' immagine personalizzatta senza utilizzare necessariamente la classe o id che sia .logo/logo a patto di conoscere i css.
ad esempio nessuno ti voeta di riutilizzare tale classe o id e di personalizzare anche l'header, oppure staccare l'header dal contenitore .wrap e dargli un width di 100% per adattarlo a tutto schermo e con qualsiasi risoluzione, come vedi le soluzioni possono essere svariate a patto di conoscere i css.
Inviato dal mio iPhone usando Tapatalk xD!
^^
Re: Dimensione logo e risoluzione schermo
Inviato: 03/10/2013, 12:47
da Tiger
come mai devo creare il logo con risoluzione 1250x120px?
se impostassi il forum con risoluzione fissa di 1024x768?
Nel tuo caso allora dovrai settare l'immagine con valori fissi,essendo l'header all'interno del "contenitore"
.wrap
Quindi:
1024 px(larghezza)
Altezza a piacere.