WebSite X5Help Center

 
Francesco P.
Francesco P.
User

WOW SLIDER  it

Autore: Francesco P.
Visite 2324, Followers 2, Condiviso 0  
Parole Chiave: slider,wow

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.

Postato il
38 RISPOSTE - 2 UTILI
Matteo C.
Matteo C.
User

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)...

Leggi di più
Postato il da Matteo C.
Francesco P.
Francesco P.
User
Autore

Questa è la mia esperienza con WOW SLIDER. Dove ho sbagliato.

Ho implementato la procedura di "Giancarlo".

Francesco

Leggi di più
Postato il da Francesco P.
Giuseppe Guida
Giuseppe Guida
User

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

Leggi di più
Postato il da Giuseppe Guida
Giancarlo B.
Giancarlo B.
User

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;}

Leggi di più
Postato il da Giancarlo B.
Francesco P.
Francesco P.
User
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

Leggi di più
Postato il da Francesco P.
Giuseppe Guida
Giuseppe Guida
User

Io vedo questo sul cellulare. Tutto bianco tranne il logo e il menú hamburger in basso.  Ma della slide neanche l'ombra... Vedi allegato. 

Leggi di più
Postato il da Giuseppe Guida
Giancarlo B.
Giancarlo B.
User

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...

Leggi di più
Postato il da Giancarlo B.
Giancarlo B.
Giancarlo B.
User

#imHeader{position:fixed; width 100%; top: 0px; 0px; 

Francesco... elimina il valore in grassetto ... è doppio ...

Leggi di più
Postato il da Giancarlo B.
Francesco P.
Francesco P.
User
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.

Leggi di più
Postato il da Francesco P.
Francesco P.
Francesco P.
User
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

Leggi di più
Postato il da Francesco P.
Giancarlo B.
Giancarlo B.
User

non vorrei ci siano codici extra che disturbano ... fai la prova su un progetto pulito...

Leggi di più
Postato il da Giancarlo B.
Francesco P.
Francesco P.
User
Autore

Ok, penso di aver risolto.

Leggi di più
Postato il da Francesco P.
Francesco P.
Francesco P.
User
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

Leggi di più
Postato il da Francesco P.
Giancarlo B.
Giancarlo B.
User
Francesco Pinto
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.....

Leggi di più
Postato il da Giancarlo B.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

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>


.

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

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:

Leggi di più
Postato il da Giuseppe Guida
Giancarlo B.
Giancarlo B.
User

grazie Giuseppe .... anche se è funzionante ? ma è solo una questione di sintassi corretta ?

Leggi di più
Postato il da Giancarlo B.
Giuseppe Guida
Giuseppe Guida
User

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.

Leggi di più
Postato il da Giuseppe Guida
Francesco P.
Francesco P.
User
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

Leggi di più
Postato il da Francesco P.
Giancarlo B.
Giancarlo B.
User

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.

Leggi di più
Postato il da Giancarlo B.
Francesco P.
Francesco P.
User
Autore

Grazie

Leggi di più
Postato il da Francesco P.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

Francesco Pinto
.. ... ... 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? ... ... ...

... 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... )

.

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

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....

Leggi di più
Postato il da Giuseppe Guida
Francesco P.
Francesco P.
User
Autore

oK, sto lavorando, comunque è dura per chi non mastica un minimo di codice!

Leggi di più
Postato il da Francesco P.
Francesco P.
Francesco P.
User
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

Leggi di più
Postato il da Francesco P.
Giuseppe Guida
Giuseppe Guida
User

Occhio ci sono delle cose da rivedere...

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

e altre cose qui...

Leggi di più
Postato il da Giuseppe Guida
Francesco P.
Francesco P.
User
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.

Leggi di più
Postato il da Francesco P.
Giuseppe Guida
Giuseppe Guida
User

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)

Leggi di più
Postato il da Giuseppe Guida
Francesco P.
Francesco P.
User
Autore

Ti riferisci a questa

Leggi di più
Postato il da Francesco P.
Giuseppe Guida
Giuseppe Guida
User

No.  A quella che ti ho indicato in una delle foto piú su che ti rimetto qui sotto... 

Leggi di più
Postato il da Giuseppe Guida
Francesco P.
Francesco P.
User
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

Leggi di più
Postato il da Francesco P.
Giuseppe Guida
Giuseppe Guida
User

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. 

Leggi di più
Postato il da Giuseppe Guida
Francesco P.
Francesco P.
User
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

Leggi di più
Postato il da Francesco P.
Francesco P.
Francesco P.
User
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

Leggi di più
Postato il da Francesco P.
Incomedia
Riccardo P.
Incomedia

Buongiorno Francesco,

se hai altre domande riguardanti altri argomenti ti chiederei per favore di aprire un nuovo topic.

Grazie.

Leggi di più
Postato il da Riccardo P.