WebSite X5Help Center

 
Daniele C.
Daniele C.
User

Orrei sapere se qualcuno di voi ha provato a creare un'intestazione stile google  it

Autore: Daniele C.
Visite 1101, Followers 1, Condiviso 0  

Buongiorno,

vorrei sapere se qualcuno di voi ha provato a creare un'intestazione stile google material design https://material.google.com/
con animazione e ombreggiatura.
Mi piacerebbe sapere se qualcuno è riuscito ad impostare l'header a schermo pieno direttamente da WsX5 12

Grazie in anticipo

Postato il
14 RISPOSTE - 2 UTILI - 1 CORRETTO
Giuseppe Guida
Giuseppe Guida
User

Abilita il Responsive Design al PASSO 1 Impostazioni generali/Responsive Design, poi sempre Al PASSO 1 Impostazioni generali /Stile del Modello /Struttura del Modello principale metti una foto di 1920 px di larghezza e 400/500 px di altezza in "SFONDO DELL'INTESTAZIONE" (NON IN INTESTAZIONE!) settando il COLORE dell'INTESTAZIONE su "Trasparente" e metti l'altezza dell'INTESTAZIONE uguale all'altezza della foto (ma puoi anche dare un'altezza diversa se vuoi). Poi la stessa foto RIDOTTA di dimensioni la metti anche in "Struttura del Modello Responsive" sempre come "SFONDO DELL'INTESTAZIONE", setta anche qui il colore dell'INTESTAZIONE su Trasparente e metti l'altezza dell'INTESTAZIONE uguale alla nuova altezza della foto con dimensioni ridotte (quindi sarà ridotta in altezza anche l'INTESTAZIONE). Fai Anteprima e vedi il risultato.

La procedura che ti ho descritto la puoi vedere applicata qui su questa bozza che sto realizzando:

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

(prova a ridurre la finestra del browser e vedi i risultati del lavoro anche alle risoluzioni dei dispositivi mobili)

Leggi di più
Postato il da Giuseppe Guida
Giuseppe Guida
Giuseppe Guida
User

P.S. per le animazioni o le slideshow a pieno schermo in intestazione devi ricorrere a codici esterni

Leggi di più
Postato il da Giuseppe Guida
Mirko Boschetti
Mirko Boschetti
Moderator

@Giuseppe,

non sò se hai guardato il link di Daniele, parla del header che con scroll della pagina diventa più stretto...

ciaooooooooooo

Leggi di più
Postato il da Mirko Boschetti
Giuseppe Guida
Giuseppe Guida
User

Si Mirko, ho visto, ma poi lui chiedeva "Mi piacerebbe sapere se qualcuno è riuscito ad impostare l'header a schermo pieno direttamente da WsX5 12" ed io ho risposto a quella sua richiesta spiegandogli come fare ;-) Per quell'altro effetto che vuole sull'header deve usare codici esterni, Website non le fa ancora quelle cose in automatico  non fa la gallery full width (cosa anacronistica e impensabile al giorno d'oggi in un sito che possa definirsi al passo con i tempi) figuriamoci il resto...

Leggi di più
Postato il da Giuseppe Guida
Daniele C.
Daniele C.
User
Autore

Grazie per la risposta, quello che mi interessava di più era inserire l'ombreggiatura sotto l'header inserendo il codice esterno all'interno di web site x5 forse...Non mi sono spegato bene.

Se scrollate nel link appare l'ombreggiatura ed io ho bisogno di quella che poi è presente in tutti i siti moderni naturalmente full width.

Leggi di più
Postato il da Daniele C.
Daniele C.
Daniele C.
User
Autore

non è proprio quello che vorrei perchè si limita alla grandezza del corpo che sarà al max di 1150px e non si adatta allo schermo.

Non mi ricordo il cosice per inserire immagini a tutto schermo altrimenti potrei provare a fare una cosa.

Comunque non è possibile modificare l'header da codice HTML?

Leggi di più
Postato il da Daniele C.
Daniele C.
Daniele C.
User
Autore

naturalmente da editor interno sennò devo modificare il codice ad ogni esportazione e diventa una stenta

Leggi di più
Postato il da Daniele C.
Mirko Boschetti
Mirko Boschetti
Moderator
Daniele C.
Non mi ricordo il cosice per inserire immagini a tutto schermo altrimenti potrei provare a fare una cosa. Comunque non è possibile modificare l'header da codice HTML?

ma hai visto l'immagine in intestazione del link di prima.....? è tutto schermo...

inserita come SFONDO DELL'INTESTAZIONE, senza alcun codice...o forse non ti riesco a capire io...quindi rileggi bene il Post di Giuseppe sopra...

Leggi di più
Postato il da Mirko Boschetti
Daniele C.
Daniele C.
User
Autore

lo sfondo non fa al caso mio, volevo provare a inserire una strip sotto con l'ombreggiatura.

Ho provato anche ad aggiungere l'ombreggiatura con shadow box ma ho applicato l'ombreggiatura a tutti gli elementi.

Farò un'ultima prova con questo codice,

<style>

.row1{

background:url('img/image.jpg') no-repeat center center;

background-size:cover;

}
</style>

altrimenti mi invento qualcosa all'esterno.

Leggi di più
Postato il da Daniele C.
Mirko Boschetti
Mirko Boschetti
Moderator

allora se vuoi fare con codice, al passo 4 nel tag head metti questo:

<style>
#imHeaderBg{
box-shadow: 0 3px 5px #A9A9A9;

}
</style>

Leggi di più
Postato il da Mirko Boschetti
Daniele C.
Daniele C.
User
Autore

Era quello che volevo fare.

 piango dalla felicità

Leggi di più
Postato il da Daniele C.