WebSite X5Help Center

 
Fabrizio R.
Fabrizio R.
User

Barra menu e barra Intestazione larghe a tutto schermo  it

Auteur : Fabrizio R.
Visité 2460, Followers 4, Partagé 0  

Ragazzi sapete il codice per rendere la barra menu larga tutto lo schermo?

sul mio sito http://www.eurcoffee.it ho impostato dei codici per il menu ecc.

pero' vorrei la barra colorata del menu che occupi tutto lo schermo  tipo famoso codice width:100%  pero' non so' come aggire :( e come inserirlo visto gia' ho inserito il codice per mettere il menu cosi come e' imposto sul sito ...Grazie sempre a chi mi aiutera' :)

Posté le
85 RéPONSES - 1 UTILES
Marzio D.
Marzio D.
User

La cosa più semplice sarebbe che lo spazio con sfondo nero del menù sia quello dello sfondo del top, in parole povere aggiungi una strscia nera all'immagine del top.

Ciao

Lire plus
Posté le de Marzio D.
Marzio D.
Marzio D.
User

Poi visto che ci siamo farei uno sfondo con il colore che ti piace lasciando la base di colore nero, altezza a tuo piacimento ì, bastano pochi px di larghezza ma con lunghezza almeno 4000 px, lo imposti con web site selezionando allineamento alla base.

Vedi questo esenìmpio: http://www.motoramabike.it

Marzio

Lire plus
Posté le de Marzio D.
Fabrizio R.
Fabrizio R.
User
Auteur

hai il codice? come la creo? 

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

aa forse ho capito devo fare sfondo intestazione colore nero di 4000px che si nasconde dietro l immagine intesazione

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

dove seleziono allinamento alla base? 

Lire plus
Posté le de Fabrizio R.
Marzio D.
Marzio D.
User
Fabrizio R.
dove seleziono allinamento alla base? 

Impostazioni Generali

Stile del modello

Sfondo pagina

Ripeti in orizzontale (2)

Allineamento basso (8)

Fabrizio R.

aa forse ho capito devo fare sfondo intestazione colore nero di 4000px che si nasconde dietro l immagine intesazione

NON mi sono spiegato bene: per il top basta inserire una striscia nera alta come il tuo menù, lo spazio dedicato al menù lo lasci trasparente così prende il colore del top, prestare attenzione che tale spazio sia compreso nello sfondo intestazione.

Per quanto riguarda la base inserisci uno sfondo: come da descrizione sopra di ALTEZZA almeno quanto l'altezza della pagina più lunga che hai intenzione di inserire o altra strada tieni fisso lo sfondo del sito.

Esempio creo uno sfondo con larghezza 5/8 px e con altezza 4000 px avendo cura di creare una porzione, che finirà alla base del sito, del colore desiderato, è più facile farlo che descrivere i passi...... Ovviamente poi avrò cura di rendere trasparente il Piè di pagina

Prova varie opzioni seguendo l'esempio che ti ho inserito al primo post.

Tutto questo con website in vers. 11 pro, non ho preso ancora la vers. 12

Ciao 

Lire plus
Posté le de Marzio D.
Fabrizio R.
Fabrizio R.
User
Auteur

quindi poi metto il colore nero e i 4000px lunghezza?

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

pero' non viene bene :( ti allego lo screen

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

a me serve solo dove sta' il menu come se fosse  continuo a destra e sinistra la barra grigia scura :( 

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

...!... non hai avvisato chi ti ha dato i suggerimenti che hai apportato modifiche extra al codice, quindi fuori dalle logiche del programma...!...

... pertanto è di extra che devi continuare per integrazioni extra su modifiche fatte che sai tu, con gli stessi metodi che ti furono sugeriti e di cui dovresti esserne diventato esperto...

... chiudi l'altro argometo, visto che hai risolto...

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

OK grazie sempre amici :) ogni tanto vi scoccio con aiutini hahahahaha

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... visto che hai usato il DIV_CUSTOM nato qui, https://helpcenter.websitex5.com/post/142197 , continua con un altro DIV_CUSTOM, e ad occhio e croce potresti risolvere semplicemente con questa stringa nel TAG STYLE:

#imMnMn {top:-65px} @media(max-width: 1199px) {#SFONDO_MENU{display:none} #imMnMn {top:0px}}

... ed il DIV_CUSTOM da aggiungere al precedente sarà questo:

<div id="SFONDO_MENU" style="position:relative;top:0px;width:100%;height:65px;background-color:black;"> </div> 

.



Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

questo e' x il menu? allungare la barra? direttamente

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

...  ... vedo che non hai ancora provato ... 

... come già detto devo vedere quello che fai...

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

ho dovuto togliere tutto bhoo all improvviso mi ha sbalzato le misure :(  ora sono di nuovo  indietro :( KolAsim mo mi devi aiutare hahahah allora ora il sito sta'  come prima che  la barra menu' non e' lunga tutto lo schermo :( ho tolto tutti i codici anzi ti indico tutti i codici che ci sono: cosi mi aiuti una volta e' sempre sempre hahahah

<style>

#imContent {padding-top: 80px;}

</style>

dopo apertura body?

<div id="SFONDO_FULL" style="position:relative;top:0px;width:100%;z-index:10;">

<img src="http://www.eurcoffee.it/image/co10.jpg" width=100%;>

</div>

poi nell impostazione generale dei codici :

<style>

#imMnMn {

top:0px;

position:absolute;

left:auto;

margin-left:0px;

border-top: 0px;

z-index:10003;

}

</style>


<style>

#imMnMn .hamburger-bar {

background-color:red;
}
</style>

 ecco questo e' tutto quello che c'e' :(

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... MACCHINE CAFFE' ...adesso va a capo;  ...hai cambiato font; ...sei sicuro che deve rimanere così...?...

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

Dammi un aiuto se blokkato tutto :( guarda il template cosi mi dici i codici per far si che viene tutto a posto barra menu larga tutto lo schermo poi l immagine header full 100% e aggiustare il content page :( helppp

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... non mi hai risposto, altrimenti cambierebbero alcune cose ... 

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Mirko Boschetti
Mirko Boschetti
Moderator

e questo:

<p><a href="http://www.eurcoffee.it" ><img src="image/f1.jpg" style="bottom: 700px; left:auto; position: absolute; z-index: 5;" /></a></p>

nel tag head...?

Lire plus
Posté le de Mirko Boschetti
Fabrizio R.
Fabrizio R.
User
Auteur

si

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

Poi c e quello del div che sta nel body ora ho tolto quello nell head non so perche masi era bloccato tutto ora sono rimasti solo il div per l immagine ed quello menu per farlo posizionare a piacimento :( mo sto a zero per risolvere la barra menu ecc :(

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

Buondi KolAsim spero ci sei oggi 

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... dopo pranzo andrò a rivedere con calma cosa hai fatto ...

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Mirko Boschetti
Mirko Boschetti
Moderator

mi sembra di vederlo funzionante ora...

Lire plus
Posté le de Mirko Boschetti
Fabrizio R.
Fabrizio R.
User
Auteur

siii tutto bene infatti credo che va bene ho messo a posto tutti i codici ed anche il respansive  si vede bene

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

Con l'aiuto di KolAsim e' andato tutto buon fine :) Grazie.....

Lire plus
Posté le de Fabrizio R.
Mirko Boschetti
Mirko Boschetti
Moderator

ma la scritta macchine caffè deve stare in riga o su 2 righe...?

a volte lo vedo su una, a volte su 2...

Lire plus
Posté le de Mirko Boschetti
Fabrizio R.
Fabrizio R.
User
Auteur

mi chiedevo solo una cosa, secondo voi possibile inserire una transazione di dissolevanza alle immagini header? qualcuno sa' il codice da inserire? sarebbe bello che compaiono a dissolevanza :) http://www.eurcoffee.it  

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

riga 1 

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

non accavalata deve essere una sola riga io lo messa cosi a me si vede cosi 

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Fabrizio R.
Con l'aiuto di KolAsim e' andato tutto buon fine :) Grazie.....

... visto adesso, ottimo, esattamente come ti avevo detto qui:   https://helpcenter.websitex5.com/post/142232#12

... tieni presente però che il sito migliore è quello che si sa realizzare con gli strumenti previsti dal programma, senza strafare...

... ringrazio anche Mirko ...che ne ha permesso l'attuazione originale ...

...

...!... per la dissolvenza devi/puoi fare come ti avevo già detto a ferragosto...!...

.



Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

ovvio grazie anche a Mirko :)  ... KolAsim non puoi ridarmi il codice per la dissolevanza? :( non lo ricordo

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

si ma quello era per il backgroun :( questo e header :( l inpostazione del codice e' diverso :(

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

non cio'  capito molto bene, :8 perche' non so cosa  devo sostituire? il dv sfondo full lo in dopo la chiusura del body poi qui c e un file js che deve essere modificato? prima che viene messo nella cartella di esportazione ma non e' che mi puoi dare l istruzione? un fie txt sempre per gentilezza e perfavore ci mancherebbe :)

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

Sei un grande KolAsim :)  , ma voledo avere invece della sfumatura bianca la dissolevanza sarebbe , che parte come se ci fosse sfondo nero.. cosa potrei aggiungere? al codice, non potendo inserire lo sfondo nero perche mi serve bianco quello del templates 

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... incapsula il DIV in un altro DIV con sfondo nero...

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

<div style="background-color:black;z-index:-1;">
<div id="SFONDO_FULL" style="position:relative;top:0px;width:100%;">
<img src="http://www.eurcoffee.it/image/bg0.jpg" width=100% >
</div></div>

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

ottimo , KolAsim invece per farsi che il menu si blokki quando fa l'ancoraggio perche' ho cambiato delle cose mi piace piu' cosi il sito , pero' ovvio quando clicco prodotti e la pagina scala per ancoraggio , il menu scompare su , invece sarebbe bello blokkarsi quando va su, spero hai capito www.eurcoffee.it   :) Grazie di cuore...

Lire plus
Posté le de Fabrizio R.
Mirko Boschetti
Mirko Boschetti
Moderator

bel lavoro, complimenti....però il menu hamburger dove è finito ora...?

Lire plus
Posté le de Mirko Boschetti
Claudio D.
Claudio D.
Moderator
Meilleur utilisateur du mois IT

...riducendo molto si visualizza l'hamburger ... , ma a certe risoluzioni intermedie ci sono dei problemi , sia col menu che non si visualizza sia con certe celle che si troncano ...

Lire plus
Posté le de Claudio D.
Mirko Boschetti
Mirko Boschetti
Moderator
...riducendo molto si visualizza l'hamburger ...

molto molto però...

Lire plus
Posté le de Mirko Boschetti
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... infatti...!...   prima c'era ed ora non più... ... ...e poi il menu c'è ancora ma non si vede, e l'hamburger rosso si vede appunto in finestra ridotta; ...credo che sono stati modificati anche i breakpoint ...

... per quanto riguarda la barra menu fissa io non ho il programma, ma mi sembra! che  già abbia tale opzione, ...altrimenti intervenire con qualche codice...

... di più non posso aggiungere... ...

.



Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

Il template lo posto su 1200px , dove c e l errore della riduzione :( io ho fatto prove su pc su iphone su samsung va bene mo non so che modificare :( se vedete un errore :( 

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

Forse ho visto scompare la barra menu lunga tutto lo schermo :( ad una certa risoluzione

secondo voi devo mettere il colore al menu? lo tolto nelle impostazioni ho messo trasparente perche' avevo messo il codice di kolAsim che mi dava una barra colorata lunga tutto lo schermo ..pero' togliendo il colore alla barra menu sua di programma forse ad una certa risolusione scompare e quindi non e' che non c'e' il manu...e che la barra aggiunta col codice scompare..ad una certa risoluzione...quindi chi mi aiuta ad risolvere? :)

Lire plus
Posté le de Fabrizio R.
Mirko Boschetti
Mirko Boschetti
Moderator

ho appena fatto una prova con i tuoi codici qui e a me funzia:

http://www.mirboprova.altervista.org/topfull2/

---------------------------------------------------------------

....hai messo Risolto il Post, cosi però nessun'altro può intervenire...

Lire plus
Posté le de Mirko Boschetti
Fabrizio R.
Fabrizio R.
User
Auteur

questo nel div menu proprieta' pagina?   non ho capito la modifica da fare :(

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

quindi tutto va bene, si deve risolvere solo il fatto che ad una certa risoluzione scompare la barra menu inserita col codice , quindi non imposto da programma il colore del menu lo lascio trasparente?  pero' non ho capito cosa devo modificare per risolvere la cosa :( ma il menu hamburger va bene?

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

...!... si parla del tag style...!...

... oppure per chiuderla qui prova ad usare quest'altro:  

#imMnMn { position:fixed; top:0px; }

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

tolgo questo?

<div id="SFONDO_MENU" style="position:relative;top:0px;width:100%;height:65px;background-color:black;"> </div> 

e poi inserisco il colore al menu da programma? :( Help meee

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

il menu deve restare sotto l header pero'...  cosi non e che lo mette fisso sopra all header? l immagine che e' in width:100% con codice

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... rileggi il post linkato prima, il tag style sta in HEAD ...

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

la modifica che mi vuoi far fare risolve il problema che,  diciamo la barra menu nero non scompare ad una certa risoluzione a finche' poi il barra menu resta senza colore , a me serviva risolvere cio' eppure se ci fosse il codice per fare la funzione che quando scrollo il menu si blokka sopra restando visibile , alla fine sono 2 i casi hahhahah semplici naturalmente :) che io non so' capace di capire :(

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

si letto...

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

sta' nel  passo 4 ...

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... per tutto il sito al passo_4 ...

... pagina per pagina in Proprietà della Pagina; ...ma perchè chiedi se l'hai già fatto...?...

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

sorry. :( e' che non ho capito per modificare  cosa devo fare :(

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... in HEAD hai inserito questa stringa:

#imMnMn {top:-45px} @media(max-width: 1199px) {#SFONDO_MENU{display:none} #imMnMn {top:0px}}

... elimiminala e lascia solo:

#imMnMn {top:-45px}

... oppure usa quest'altra:

#imMnMn { position:fixed; top:0px; }       ( ... dovrebbe fissarti il menu in alto...)


Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

grazie di vero cuore..........  :)

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

provo ....per vedere se la funzione fosse quella :)

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

il sito e' tutto a posto molto carino solo una cosa...per la dissolevanza dell'immagine header al 100% l'effetto non posso metterelo nero sfondo colore perche' se no mi da anche la pagina nera ..non so' perche'..cmq se si puo' risolveres e no fa nulla :) 

Lire plus
Posté le de Fabrizio R.
Mirko Boschetti
Mirko Boschetti
Moderator

ora i menu sono centrati, ma stringendo la pagina vanno a dx...?

Lire plus
Posté le de Mirko Boschetti
Fabrizio R.
Fabrizio R.
User
Auteur

come posso modificare? sia il fatto che mai detto che il fatto della transazione dissolevanza colore nero e non bianco?

Lire plus
Posté le de Fabrizio R.
Mirko Boschetti
Mirko Boschetti
Moderator

prova questo al posto del tuo:

 #imMnMn {position:fixed; top:0px;left:0;text-align:center; width:100%; z-index: 10;}

Lire plus
Posté le de Mirko Boschetti
Fabrizio R.
Fabrizio R.
User
Auteur

dovrei usare qualche z-index..   ? per il fatto che l'effetto transazione dell'immagine header sfondo e' bianche e non nera... perche' quando imposto color:black...al codice inserito..mi da tutto lo sfondo nero e toglie il bianco che mi serve per visualizzare i contenuti pagina....

un argomento gia' fatto con KolAsim che io ho usato ma..all'improvviso mi da' questo errore...  :( poi devo risolvere il fatto del menu che mi ha suggerito Mirko...  :( Help me...

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

ok mirko provo :)

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

credo che questo e' risolto ottimo :) mo c e' il fatto dell' effetto colore dissolevanza immagine header :(

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

si ma se lo metto nero mi da tutto nero anche la pagina :(

Lire plus
Posté le de Fabrizio R.
Mirko Boschetti
Mirko Boschetti
Moderator

letto tardi...

Lire plus
Posté le de Mirko Boschetti
Fabrizio R.
Fabrizio R.
User
Auteur

il fatto del menu e' risolto..Mirko ho messo il tuo codice

Lire plus
Posté le de Fabrizio R.
Fabrizio R.
Fabrizio R.
User
Auteur

mo ho solo il picc. problema dell'effetto colore sfumatura dissolevanza :( se metto black mi da tutto anche la pagina contenuto :(

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Fabrizio R.
mo ho solo il picc. problema dell'effetto colore sfumatura dissolevanza :( se metto black mi da tutto anche la pagina contenuto :(

... non hai chiuso l'incapsulamento, manca:  </div>

... VEDI >>>>   https://helpcenter.websitex5.com/post/142232#40

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

hai ragione..... :) ora tutto completo...dai un occhiata se va bene tutto :) 

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... correggi qui:

<imgsrc="http://www.eurcoffee.it/image/bg10.jpg" width=100%;">

width=100%;"

... deve essere così:

<imgsrc="http://www.eurcoffee.it/image/bg10.jpg" width=100% >

width=100%

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

Fatto 

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... OK, ...non si notano altri errori nel codice...

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

Ho lasciato un post del fatto della posizione menu respansive 

Lire plus
Posté le de Fabrizio R.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Fabrizio R.
per il post qui..   https://helpcenter.websitex5.com/post/142593 nessuno aiuta? :)

... non capisco cosa stai cercando di ottenere; ...l'esempio dimostrativo di Mirkopostato prima mi sembra che sia perfetto oltre che innovativo! ...

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Fabrizio R.
Fabrizio R.
User
Auteur

Per cambiare il colore scritta menu agg. Al menu hamburger lui la messa nera 

Lire plus
Posté le de Fabrizio R.