WOW SLIDER
Autore: Francesco P.Da tempo seguo questa lunga discussione (https://helpcenter.websitex5.com/it/post/157292) e mi sono cimentato anch'io nella creazione di qualche sito (non ancora pubblicato) in cui nella home page riscontriamo la galleria fotografica a tutto schermo.
Domanda: visto che Giancarlo é l'artefice di questo argomento e a mio parere incomincia a portare il programma un pò al di là della sfera semiprofessionale, non sarebbe opportuno che lo Staff incomincia a pensare, spero presto, a pubblicare un "oggetto" che permetta a tutti di pubblicare lavori con più calma e celerità, altrimenti l'aforisma "... in cinque passaggi e pubblica subito il sito .... , va a farsi benedire.
Che dite? Complimenti ancora a Giancarlo!
Saluti a tutti
Francesco
N.B. A proposito WOW SLIDER è gratis ma lascia un piccolo logo in basso a destra sulle immagini. nella versione a pagamento il logo viene tolto.
Il logo lo fai sparire semplicemente sostituendo le immagini che crea wowslider con quelle che in origine hai caricato. E che wowslider ha modificato...
Detto questo si, la galleria full (che non credo sia impossibile da implementare in WsX5) secondo me è un must have. Ma credo si vedrà nel 14 o come oggetto supplementare a pagamento. Anche se inizia a diventare noiosa questa cosa degli oggetti a pagamento. Che facciano 3 versioni. Normale, professional ed enterprise e stop.... Adesso come adesso quante gallerie esistono (tutte sono oggetti diversi invece che essere un'unico oggetto con un'interfaccia completa)...
Autore
Questa è la mia esperienza con WOW SLIDER. Dove ho sbagliato.
Ho implementato la procedura di "Giancarlo".
Francesco
Autore
Ho dimenticato l'elemento più importante il link:
http://residenza.francescopinto.it
Francesco ci sono degli errori nel codice che hai inserito sugli z-index e poi ci sono delle lettere o al posto degli zeri 0
Ciao Francesco, si in effetti ha ragione Giuseppe ci sono un pò di errori tipo quelli che ti ho evidenziato in grassetto:
/* impostazioni di pagina distanza Slide full e menù*/
#wowslider-container1{toppx; z-index:-1 !important;}
/* distanza contenuti pagina della Home da Slider */
#imContent{margin-top: 10px;}
/* distanza contenuti pagina dal top */
#imContent{top: 100px;}
#imContent{margin-top: 100px;}
/*impostazioni menù, header e sfondo intestazioni */
#imHeaderBg{position:fixed; top: opx; z-index10;}
#imHeader{position:fixed; width 100%; top: 0px; opx; z-index10;}
#imMnMn{position:fixed; top 30px; z-index10;}
Autore
Ok, scusate ma non ho molta dimestichezza con il codice.
Il Risultato è questo http://residenza.francescopinto.it/index.html
Da premettere che i parametri di WebSite sono:
- altezza 70 per lo sfondo dell'Header
- " 70 per l'Header
- " 30 " menù
Considerazioni:
- perchè nel wewslider su 10 slider il sistema si ferma alla terza?
- il menù non é posizionato sopra il wowslider?
Vi ringrazio per l'aiuto
Io vedo questo sul cellulare. Tutto bianco tranne il logo e il menú hamburger in basso. Ma della slide neanche l'ombra... Vedi allegato.
Si lo slider si vede il menù resta basso.. ma ad un certo breakpoint credo che l'header/immagine sia troppo ingombrante e copre lo slider...
#imHeader{position:fixed; width 100%; top: 0px; 0px;
Francesco... elimina il valore in grassetto ... è doppio ...
Autore
Grazie Giancarlo.
Ho fatto la correzione ma le perplessità riscontrate nel mio ultimo post rimangono invariate. Da premettere che per le slide ho usate come grandezze le stesse suggerite nel tutorial: 1920x 800 px.
Autore
Ho utilizzato anche il procedimento suggerito da KolAsim usando iframe.
Anche qui ho utilizzato quanto suggerito nel tutorial:
- WowSlider 1920 x 800
- Sfondo dell'Header 80; Hader 50 e menù 30.
Quello che non comprendo é perchè mi ritrovo uno slidshow basso non dimensionato con i valori 1930 e 800 così come é riportato nel codice alla sezione "prima della chiusura del tag HEADER" della sezione Esperto del file Home.
Saluti
Francesco
non vorrei ci siano codici extra che disturbano ... fai la prova su un progetto pulito...
Autore
Ok, penso di aver risolto.
Autore
Ecco il risultato con il metodo iframe
http://residenza2.francescopinto.it
l'unico inconveniente é la gestione della Struttura del modello che non risponde più ai comandi nei punti: sfondo dell'header (50), header (1), menu (50).
Inoltre l'header copre al 90% tutto lo WowSlider per cui lo reso "trasparente", mentre il posizionamente delle voci del menù é fisso nella posizione che si vede; non c'è verso di posizionarla un pò più in basso.
Francesco
Francesco perchè non provi utilizzando l'oggetto html è molto più semplice, nell'oggetto metti tutto il codice che generi con wowslider compresi i tag
<header>.... codice...</header> e poi a seguire
<body> ....... codice ..... </body>
poi per estendere l'oggetto html con altezza impostata a zero... inserisci questo.. codice MAeSI
<style>
#imPageRow_1 div {
padding: 0;
width: 100%;
}
</style>
molto più semplice.....
x Francesco, ed altri interessati, per non gravare su questo Argomento, sarebbe meglio aprirne uno proprio, magari facendo riferimento a questo...
... comunque, dipende dalla struttura adottata nella pagina, e non avendo io il programma non posso entrare nel merito non potendo fare delle prove...
... la struttura ideale per il mio metodo IFRAME sarebbe quella di adottare lo stile Orizzontale - Menu sopra l'Header, ed header vuoto impostato sui 100-200 pixel di altezza, che condizionerà l posizione del contenuto della pagina, che come noti d tutti gli esempi funziona a dovere...
... per avere un'idea di quello che avviene adesso, prova a posizionare in HEAD quest stringa:
<style> #imHeaderBg {background-color:transparent !important} #imHeader {background-color:transparent !important}</style>
.
Giancarlo, nell'Oggetto Codice HTML non vanno inseriti i tag head e body e il richiamo al file CSS va messo in head, anche io credevo come te che fosse così con l'Oggetto Codice HTML ma non lo è come spiegatomi da MAeSI sul loro blog, vedi sotto:
grazie Giuseppe .... anche se è funzionante ? ma è solo una questione di sintassi corretta ?
Si Giancarlo, funzionava anche a me in effetti così come avevi scritto sopra, però, dopo il consiglio di MAeSi e dopo aver di conseguenza approfondito il funzionamento dell'Oggetto HTML (da me in effetti mai approfondito) è corretto come detto da loro due.
Autore
Ricapitolando:
* ho eseguito due prove, la prima risiede su http://residenza.francescopinto.it eseguita con il metodo "Giancarlo"
* la seconda su http://residenza2.francescopinto.it eseguita con il metodo "KolAsim"
Francamente ho constatato che il secondo è più semplice e francamente funziona meglio.
Domanda: se decido di cambiare le slide al WowSlider (se ho capito bene) basta solo inserire le immagini nuove nelle cartelle images e toolpips in data1 e basta oppure bisogna rinnovare totalmente il WowSlider e poi salvare il tutto?
Francesco
metodo "KolAsim".. se rimane delle stesse dimensioni e vuoi semplificarti la vita... una volta generato il progetto ed esportato i file in una cartella provvisoria sul desktop, non fai altro che prende tutti i file e le cartelle e sovrascrivere quelle presenti nella root principale del sito.
metodo "Giancarlo" non esiste, per chiarezza è quello originale di wowslider.
Ciao.
Autore
Grazie
... ha già anticipto Giancarlo, e puoi usare altre immagini, sia sostituendo quelle che hai mantenendo lo stesso nome (occhio alla cache)(*), sia usando immagini nuove, modificando gli url:
<li><img src="data1/images/1.jpg" alt="economico" title="economico" id="wows1_0"/></li>
... per esempio al posto di "data1/images/1.jpg" puoi mettere:
"https://cdn.pixabay.com/photo/2017/01/31/22/55/bank-2027944__340.jpg"
(*) ... nel caso di sostituzione delle immagini con stesso nome, per by passar la cache, sarebbe meglio editare con il blocco note la pagina html e correggere l'url in questo modo: "data1/images/1.jpg?1" ...ed a seguire per altre sostituzioni con al posto di 1 il 2, 3, ecc.
... vedo che non hai fatto la prova per provare quanto ti avevo detto precedentemente, in quanto sotto ai 960 pixel scompare lo slideshow...
.
(... il mio metodo DIV_CUSTOM+IFRAME dinamico, permette l'aggiornamento immediato dello slideshow senza toccare il programma, potendolo anche sostituire con slideshow di altre fonti, e per chi è attento, renderlo più leggero ed adatto ai dispositivi "mobile" con un rigo di script; ...½ MB per immagine non è l'ideale... )
.
Francesco devi rivedere la posizione delle icne dei social in alto a destra, perchè alle risoluzioni più basse sono posizionate oltre iil margine destro dell'header e ti sfasano la pagina facendo apparire la barra di scroll orizzontale... Poi a occhio e croce dovresti sistemare l'altezza credo dell'header o rendere il suo sfondo trasparente anche alle risoluzioni più basse perchè sembra che l'header copra la slide o comunque la slide sparisce come ha detto Kol....
Autore
oK, sto lavorando, comunque è dura per chi non mastica un minimo di codice!
Autore
Dopo i Vs preziosi suggerimenti questo è quanto ho saputo fare:
www.federicocasabandb.com
comunque ancora mi tormenta il fatto di non riuscire a tenere bloccato il menù in alto o in basso all'header come in questo caso:
http://www.cgwedding.it/index.html
Autore
http://www.federicocasabandb.com
Occhio ci sono delle cose da rivedere...
e altre cose qui...
Autore
Da una verifica mi risulta che la visualizzazione va bene su tutti i browser tranne Safari, dove si scorge l'immagine inserita a fondo pagina. Immagine utile perchè poi la ritroviamo in una pagina più sotto avendo quell'effetto di profondità.
La bandierina dell'eng è stata ripristinata
Per lo sfondo del carattere riscontro delle difficoltà in quanto il sistema di WowSlider non lo permette.
Grazie mille per il tuo intervento.
Scusami Francesco ma non capisco l'utilità di quella immagine inserita a fondo pagina se puoi utilizzare lo Stile Righe in Website per creare dei validi effetti parallax con immagini di sfondo a larghezza intera e oggetti vari (testo, immagini ecc) che ci scorrono sopra creando ugualmente un bell'effetto di profondità (il parallax serve proprio a questo)
Autore
Ti riferisci a questa
No. A quella che ti ho indicato in una delle foto piú su che ti rimetto qui sotto...
Autore
Scusa, non per insistere, ma io vedo, usando il PC, questa visualizzazione che allego usando i browser Firefox, Crome e Explorer ultima edizione. L'immagine che vedi (forse usando Safari) è un'immagine di sfondo che serve per una pagina successiva.
La bandiera della lingua è visibile.
Grazie per la pazienza che mi dedichi.
Francesco
Quella é la visualizzazione da Chrome. Però considera che lo screenshot l'ho fatto un paio di giorni fa, poi non ho avuto occasione di visualizzare nuovamente il tuo sito dal pc. Forse ora avrai modificato delle cose (tipo ripristinare la bandierina ecc). Ma l'altro giorno con Chrome, come puoi anche tu vedere dallo screenshot, appariva quella immagine sotto la slide di Wowslider al resize della finestra di Chrome.
Autore
Ieri sera mi sono trovato in un negozio di un amico e dal suo PC ho controllato su Firefox il sito e ho constatato che tutto era OK. Alcune perplessità ho su Safari.
Francesco
Autore
Questo è lo screenshot su Chrome di oggi 5 mar 11:27.
Un piccolo corollario: ti potrei chiedere come faccio a tenere il menu fisso in alto tipo questo sito?
http://www.cgwedding.it/index.html
Francesco
Buongiorno Francesco,
se hai altre domande riguardanti altri argomenti ti chiederei per favore di aprire un nuovo topic.
Grazie.