WebSite X5Help Center

 
Tommaso Tarallo
Tommaso Tarallo
User

Possibilità inserire una intestazione di grandezza opportuna per ogni breakpoin  it

Autor: Tommaso Tarallo
Visitado 1143, Followers 2, Compartido 0  

Salve, ho il seguente problema: in Personalizzazione del Modello Responsive, se metto una intestazione di dimensioni piccole, questa si visualizza bene sul mio smartphone (in orientamento verticale) ma poi sul tablet (in orientamento verticale) questa si vede troppoa piccola; invece, se scelgo una intestazione più grande va bene per la visualizzazione su tablet (in orientamento verticale) ma sullo smartphone (in orientamento verticale) si vede tagliata.

Questo problema nasce perchè i breakpoint si riferiscono agli oggetti contenuti dentro la pagina, invece per quanto riguarda le intestazioni ci sono solo due possibilità generiche: Desktop e Mobile.

Quindi voi dovete permettere, ad ogni breakpoint, di poter inserire una nuova intestazione così da coprire in larghezza il contenuto della pagina.

Grazie.

Publicado en
16 RESPUESTAS - 3 úTIL - 1 CORRECTO
Giuseppe Guida
Giuseppe Guida
User

Ciao. Ma se imposti per bene due foto per l'intestazione Desktop e Responsive, la seconda leggermente più piccola della prima e le inserisci in "Sfondo dell'intestazione" invece che in Intestazione, lasciando quest'ultima settata su colore "trasparente" (o la metti proprio a zero), hai una Intestazione che si adatta a tutti i display, così come ho fatto io qui in questo template:

http://www.bozzasito003.altervista.org/pizzeria

se provi a ridurre la finestra del browser dalla larghezza massima a quella più piccola (o verifichi direttamente su smartphone e tablet), vedrai come l'intestazione (l'immagine della ragazza con pizza in mano e dietro di lei pizza gigante) si vede bene a tutte le visualizzazioni.

ciao ciao

Leer más
Publicado en de Giuseppe Guida
Tommaso Tarallo
Tommaso Tarallo
User
Autor

grazie ragazzi per il vostro prezioso aiuto ma meglio evitare codice esterno...

Giuseppe Guida, mi mpotresti inviare il tuo progetto così guardo come è fatto lo sfondo dell'intestazione e mi rendo conto dell'idea?

quanto devono essere grandi le due intestazioni?

Leer más
Publicado en de Tommaso Tarallo
Pc Win
Pc Win
User
Giuseppe Guida
Ciao. Ma se imposti per bene due foto per l'intestazione Desktop e Responsive, la seconda leggermente più piccola della prima e le inserisci in "Sfondo dell'intestazione" invece che in Intestazione, lasciando quest'ultima settata su colore "trasparente" (o la metti proprio a zero), hai una Intestazione che si adatta a tutti i display, così come ho fatto io qui in questo template:

ciao

spiegheresti di preciso cosa intendi per quanto quotato qui sopra? nello specifico dove le setto le foto intestazione responsive e desktop nel progetto?

grazie

Fabio

Leer más
Publicado en de Pc Win
Pc Win
Pc Win
User

scusa non avevo letto bene, ho risolto

grazie

Leer más
Publicado en de Pc Win
Tommaso Tarallo
Tommaso Tarallo
User
Autor

cpme hai risolto Pc Win?

Mi potresti spiegare in dettaglio?

Leer más
Publicado en de Tommaso Tarallo
Pc Win
Pc Win
User

ciao Giuseppe

subito non avevo letto bene e non vedevo il risultato.
Alla fine se metti l'immagine in "sfondo intestazione" e non "intestazione", dopo averla ridotta, (io ho fatto almeno 3 prove prima di rtovare la misura giusta) funzionerà

E' una soluzione che non posso adottare io però perchè l'immagine è rappresentata da tanti (magari) sponsor che devo poi linkare ognuno al proprio sito e non so come fare

ciao

Leer más
Publicado en de Pc Win
Tommaso Tarallo
Tommaso Tarallo
User
Autor

e quando deve essere l'immagine come larghezza?

Leer más
Publicado en de Tommaso Tarallo
Pc Win
Pc Win
User

questo dipende da te direi,

la mia della versione desktop era 1280, poi, come dicevo, ne ho provate diverse, fino a 480.....fai delle prove

ciao

Leer más
Publicado en de Pc Win
Tommaso Tarallo
Tommaso Tarallo
User
Autor

Ho effettuato delle prove seguendo i vostrio consigli ma l'intestazione risulta sempre tagliata e non si adatta alle varie visualizioni

mi potete gentilmente inviare un vostro esempio di progetto anche grezzo?

grazie: questo è il mio indirizzo email negoziopedalino[@]gmail.com

Leer más
Publicado en de Tommaso Tarallo
Tommaso Tarallo
Tommaso Tarallo
User
Autor

...

Leer más
Publicado en de Tommaso Tarallo
Giuseppe Guida
Giuseppe Guida
User

Giuseppe P., ti ho mandato la mail con il progetto, fammi sapere se l'hai ricevuta. Ciao ciao

Leer más
Publicado en de Giuseppe Guida
Tommaso Tarallo
Tommaso Tarallo
User
Autor

Infinite grazie Giuseppe ma volevo che l'intestazione su mobile non si tagliava minimamente...

Leer más
Publicado en de Tommaso Tarallo
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Usuario del mes RU

... secondo me dovrebbe poter bastare l'uso di un'immagine di misure adatte alla misura minore in larghezza che vuoi servire, per esempio 480 px;
... oppure, visto che già lo sai fare, controllare con apposite media_query diverse immagini di misure diverse per i vari intervalli che considererai...
... in extra, e secondo me, potresti anche risolvere semplicemente secondo una mia vecchia idea espressa diverse altre volte ed adottata in un modo o nell'atro da diversi utenti:
1)– realizzare una pagina HTML extra, oppure una pagina senza applicare il modello, con il codice per immagine di sfondo con attributo "cover", oppure con slideshow tipo"maximage" come quello di Mirko, molto adatto allo scopo...
2)- attribuire all'Intestazione un'altezza fissa ed adeguata allo scopo; per esempio, se si volesse che alla risoluzione minima 480 avesse un'altezza di 240 pixel, questa sarebbe l'altezza da impostare per tutto il sito; ...cioè anche a 1280 o superiore l'altezza sarebbe sempre fissa a 240 px;
3)- le immagini da usare al p.1) devono essere con rapporto 2:1, quindi realizzate ad hoc in quanto la parte che avrà prevalenza sarà quella disposta sull'asse orizzontale centrale; ...per esempio 960x480, o 1200x600, e/o congrue;
4)- creare l'Intestazione vuota e con sfondo trasparente;
5)- usare il codice personalizzato al Passo_4 per un DIV_CUSTOM con larghezza al 100% e con altezza quella stessa dell'intestazione, 240 px, ed eventualmente assegnare l'attributo TOP adeguato alla posizione relativa dell'intestazione, per occuparne la medesima sezione;
6)- nel DIV_CUSTOM incorporare i codice IFRAME che importi la pagina cui p.1);
...
... è più semplice a farsi che a dirsi, ma di più non posso dirti in quanto mi sono espresso per memoria residua...
(... non dovresti incontrare difficoltà, e magari il mio interprete, che spesso ha gentilmente attuato quanto proponevo, potrebbe fornire il suo contributo...)

.

Leer más
Publicado en de  ‪ KolAsim ‪ ‪
Tommaso Tarallo
Tommaso Tarallo
User
Autor

Grazie Kolasim, dovrei perdere un casino di tempo per qualche sito che faccio.... mi accontento delle possibilità del programma....

chiudo il post e grazie a tutti!

Leer más
Publicado en de Tommaso Tarallo
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Usuario del mes RU

Giuseppe P.
... ... dovrei perdere un casino di tempo per qualche sito che faccio.... mi accontento delle possibilità del programma.... 

... nessuna perdita di tempo, basterebbero un paio di copia/incolla; ... comunque è sempre meglio usare le funzioni del programma come detto precedentemente, adattandovisi, e  che non si era capito se si era capito...

.

Leer más
Publicado en de  ‪ KolAsim ‪ ‪