Codice su header in modalitá responsive
Autor: Andrea D.
Visitado 1939,
Seguidores 4,
Compartilhado 0
Ciao a tutti, premetto che ho esaminato un po' di discussioni e so che una soluzione c'é, ne sto seguendo anche un paio ma non riesco a capire come fare.
Vorrei inserire un codice html, o un'immagine, sopra all'header, come ho fatto nel sito in modalitá desktop. Il codice sarebbe il menu a tendina per le lingue, come faccio a renderlo visibile?
Publicado em
metti un link per vedere...
Autor
Ciao Mirko, era proprio un tuo intervento che seguivo si un altro post. Il sito dove ho inserito il codice cerca e la tendina per le lingue è in fase beta ed è questo: http://indirizzodiprova.altervista.org/sitobeta/
Autor
Ecco, il risultato che vorrei arrivare e di cui parlavo era quello di emulare quello che accade qui http://www.mirboprova.altervista.org/ws-12/index.html
Quando vado su smartphone la barra di ricerca e/o altri codici rimangono.
prova a mettere il capo di ricerca e il menu lingue a sx nell'intestazione, e poi passo 4/impostazioni avanzate/Statistiche, codice,seo/esperto/prima della chiusura del tag head metti questo:
<style>
#imHeader .search_form {
display:block;
}
#langSelect f16 white{
display:block;
}
#imHeader .imTemplateContent {
display:block;
}
</style>
Autor
Ciao Mirko, grazie per il tuo codice, l'ho provato ed effettivamente funziona, giustamente il sito era il tuo, l'unico "problema" è che non posso spostare il menu a tendina delle lingue a sinistra, il cliente me l'ha imposto li.
C'è una soluzione? magari modificando il codice che mi hai dato?
io l'unica cosa che sono riuscito a provare è questa....sicuramente ci saranno dei modi migliori, e molto più fluidi...non è il massimo, ma potrebbe funzionare lavorandoci ed aggiungendo, magari in un css suo, altre media.....
http://provews.altervista.org/campo-cerca/
... qui si vede il clone! interpretato a modo mio: http://www.zspace.it/kolasim/trash/intestazioneAndrea143211.html
... il codice si intercetta in HEAD dal rigo 47 a partire da: <!-- EXTRA INIZIO -->
.
Autor
Ciao Mirko e KolA, ho provato a inserire i vostri codici (ovviamente non assieme) e per ora sembra funzionare, vediamo se ci saranno effetti collaterali anche se non penso. Grazie per l'aiuto.
Autor
Ciao scusate il doppio post ma ho notato una cosa che avevo dato per scontato invece ho sbagliato, quando il codice viene alterato con il codice che mi avete dato, che continuo a dire funziona, il fondo della pagina si accavalla come potete vedere nel link aggiornato http://indirizzodiprova.altervista.org/sitobeta/
Sicuramente sarà da inserire una o due stringhe nel codice, ma quale?
OT: nella barra della lingua io inserirei italiano/English , anzichè Italy/England , ma ovviamente è solo un parere personale , però vedendo moltri altri siti simili ...
Autor
Si Claudio, l'ho pensato anchio infatti se guardi nel menu normale come ultima voce l'ho già fatto, mi ero fermato su questo problema del responsive ed aggiustarlo in qualche modo, anche, sopratutto, con l'aiuto vostro, poi modificherò sicuramente. Grazie comunque per il suggerimento
...!... dovresti organizzare il Piè di Pagina in modo diverso: http://www.zspace.it/kolasim/trash/intestazioneAndrea143211_b.html
... cioè usare nel campo di testo opportuni codici HNTML per impaginare correttamente, oppure farne a meno...
...
... in alternativa, prova a compilarlo da solo in una pagina senza applicare la grafica del sito tramite le proprietà pagina, posta il LINK e poi vedremo se per caso! si potesse procedere all'integrazione con DIV_CUSTOM... (!sai che non ho il programma!)
.
Autor
e se nel caso volessi adattare solo l'header con i codice lingua e ricerca mentre il folder lo lasciassi responsive come da programma (insomma con la sola scritta che mi fa mettere nelle impostazioni) cosa dovrei modificare nel codice? perchè ieri sera ho provato ma mi accavalla il contenuto desktop con la scritta in responsive..
Autor
*footer
Comunque per la cosa appena chiesta son riuscito a realizzarla analizzando il tuo codice Kola, lascio aperto così se qualcuno ha una soluzione per l'adattamento anche del Footer, senza perdere modello e senza dover editare ogni volta tutto, l'accetto volentieri.
... fai la prova che ti ho indicato prima in "alternativa", posizionando gli oggetti (testo,tabella,immagini,ecc.) nella griglia...
.
Kol, ciao. Nel tuo esempio online, ad alcune risoluzioni, appare la barra di scroll orizzontale sotto. Prova a ridurre man mano la finestra del browser e te ne renderai conto.. Lo fa anche a me in alcuni siti nel momento in cui inserisco codici per far apparire il contenuto nascosto anche in modalità responsive nonostante abbia spostato a sinistra tutti gli elementi da far rimanere visibili.
Ciao, grazie, adesso purtroppo non posso controllare
Ciao
Autor
aprofittando che é tornato a galla questo post, kola vorrei chiederti un modo per non tagliare l'immagine dell'header in responsive, utilizzando il tuo codice, ma bensi venga rimpicciolita a seconda della risoluzione..
Se vedi sul lato destro ci sta la traccia d'oro me se si rimpicciolisce la schermata o lo si guarda da smartphone la traccia d'oro si perde...
Un altro esempio dove ho applicato il tuo codice e si vede meglio il taglio é qui http://indirizzodiprova.altervista.org/tig3rtest (sopra ho provato un codice di mirko ma ho notato che nel riepillgo carrello etc, rimane un buco vuoto percui opto per il tuo)..
... sono ancora su un mini tablet e non sono in condizioni di verificare; ... quando è se potrò, ti farò sapere...
.
Ciao
... ho potuto controllare e penso che possa dipendere dalle misure assegnate all'Oggetto HTML contenitore che va oltre al layout della pagina...
... essendo cornice che fa parte della stessa immagine esce dal layout in rapporto alle proporzioni; ...prova ad aggiungere nei vari @media questa stringa per vedere come si comporta :
#imHeader {background-size: 100% auto;}
.
ciao