27 aprile 2015

Template Composite per WebSite X5 Evolution 11

E' ormai da qualche mese che la priorità per chi gestisce un sito web è rendere fruibile le proprie pagine sui dispositivi mobile, causa la mail perentoria che Google ha inviato a chi ha creato un sito non mobile friendly:
I sistemi Google hanno testato 126 pagine del tuo sito e riscontrato che il 100% delle pagine presenta errori critici di usabilità sui dispositivi mobili. Gli errori in queste 126 pagine incidono notevolmente sulla modalità di utilizzo del tuo sito web da parte degli utenti di dispositivi mobili. Tali pagine non verranno considerate ottimizzate per i dispositivi mobili dalla Ricerca Google e verranno quindi mostrate e posizionate adeguatamente per gli utenti di smartphone.
Chi utilizza WebSite X5, che attualmente non crea template responsive, si trova alle strette. Nelle numerose discussioni aperte sul sito ufficiale di supporto lo staff indica come strada percorribile quella di creare una doppia versione del sito, mobile e desktop. Questa soluzione ha dei limiti: si tratta di due siti a layout fisso e ogni aggiornamento dei contenuti deve essere riportato su entrambi i progetti.

Noi, già con il template Alpines, abbiamo sperimentato una strada alternativa, anche se non di semplice attuazione: aggiungere le media queries nei CSS del template generato dal programma. Occorre un po' di dimestichezza con i linguaggi di base, ma il risultato è a nostro avviso accettabile: il sito ha una larghezza massima prefissata, al di sotto della quale è responsive.

Ecco il secondo esperimento, Composite, template monopagina scaricato da templatemo.com e adattato per WebSite X5 Evolution 11 (11.0.6.27).

Il template originale è rilasciato sotto licenza Creative Commons 4.0. Per quanto riguarda il nostro adattamento leggi i termini di utilizzo.


demo composite
DEMO

Il template utilizza il Google Font "Open Sans". Prima di importare il progetto occorre inserire il file .ttf nella sezione "Preferenze" del programma. Oltre che da Google Font, è possibile scaricare il file dalla pagina ReadMe della demo del template online.

Questo il codice @import da noi utilizzato:
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,700,300);

Per personalizzazioni è necessario consultare i file custom.css e custom.js: tutti i blocchi di codice sono commentati per permettere una facile lettura ed eventuale modifica.
Sono stati utilizzati Oggetto Testo, Oggetto Codice HTML e Oggetto Modulo Invio E-mail. Si fa presente che la variazione degli oggetti all'interno della pagina, sia nel tipo che nella posizione, potrebbe comportare una revisione sostanziale delle regole CSS.

Qui il file .iwzip da scaricare: DOWNLOAD


Per problemi di visualizzazione o difficoltà incontrate nelle personalizzazioni, contattateci a questo indirizzo quellidelcucuzzolo@altervista.org oppure attraverso i commenti di questo post.


Aggiornamento del 15/05/2015:
  • modificati i files custom.js e custom.css per permettere l'inserimento, nelle immagini della sezione Portfolio, delle varie tipologie di collegamento previste dal programma (ad esclusione di "Suono")


80 commenti:

  1. Complimenti siete veramente forti, nonostante la mia ignoranza in materia sono riuscito a fare il mio sito grazie ai vostri suggerimenti, tychehouse.it - ben accette critiche per apportare modifiche. Scrivo per sapere se possibile variare il colore del testo nelle foto in Home Page e se è possibile passare dal giallo ocra del menu ad altro colore. Comunque complimenti NiCo

    RispondiElimina
    Risposte
    1. Ciao Nino,
      grazie! :)

      Per modificare il colore dei testi nella slide devi editare il file custom.css: alla riga 133 c'è la classe .slider-caption a cui è attribuito color:white; cambialo con il colore da te scelto.
      Il colore di sfondo della voce del menu è stato impostato da programma: passo 1, Stile del Modello, Menu Principale, Voci Menu, Voce su passaggio del mouse.

      Abbiamo dato un'occhiata al tuo sito: avendo cambiato la composizione degli oggetti nella griglia della pagina dovresti fare alcuni aggiustamenti alle media queries; se guardi il sito a una risoluzione compresa tra 1020 e 768 ti rendi conto di cosa non va. Ti consigliamo inoltre di scrivere il testo nel footer in un oggetto HTML: alle risoluzioni più basse il testo attuale (fuso nello sfondo del footer) viene tagliato. Comunque bel lavoro!

      Elimina
    2. Questo commento è stato eliminato dall'autore.

      Elimina
  2. Ciao MAeSI, Grazie per le informazioni sono riuscito finalment a sistemare il sito. Potete cortesemente dirmi come fare per gli aggiustamenti media queries, purtroppo non sono ferrato in materia. Ultima richiesta, ho visto che nel blog avete inserito in data 20.2.14 questo Galleria immagini con effetti jQuery UI , è possibile inserirlo per visualizzare le immagini " l'Appartamento", Un soincero Saluto N.

    RispondiElimina
    Risposte
    1. Ciao Nino,

      riguardando il tuo sito, ci siamo accorti che hai un redirect ad una versione "mobile" sempre fatta con WebSite X5.
      Se non è una soluzione provvisoria, questo ha poco senso: perché gestire due progetti distinti quando il template che stai usando (Composite) si adatta già a tutti i dispositivi?
      Per quanto riguarda le media queries (anche se a questo punto potrebbe avere poco senso), dovresti modificare il codice relativo a .row2, .row4 e .row6 rendendolo uguale a quello di .row1 ed il codice relativo a .row5 rendendolo uguale a quello di .row2.
      Ti facciamo notare che per fare questo tipo di modifiche strutturali, occorre avere un minimo di dimestichezza sui linguaggi di base.
      Per quanto riguarda la galleria che segnalato, che al momento non è responsive, la soluzione più semplice è inserire il codice in un Oggetto HTML.

      Elimina
  3. Buonasera, ho scoperto solo oggi questo bellissimo blog, ed ho scaricato i vostri template perchè sto cercando di ricostruire con web site il sito della mia attività. Mi piacerebbe sviluppare il template timeline, si potrebbe inserire al posto dell'immagine statica uno slider? avrei anche molte altre domande, posso contattarvi in qualche modo?
    Andrea

    RispondiElimina
    Risposte
    1. Ciao Andrea, grazie per il commento che però potevi scrivere nel relativo post :)
      Comunque, per quanto riguarda la slider, puoi usare le sezioni per inserire codice personalizzato come ad esempio "Dopo l'apertura del tag BODY".

      In tutte le pagine, in alto a destra trovi la nostra mail.

      Elimina
  4. Ciao.... Ho difficoltà ad importare il file iwzip. mi da un errore nel file xml

    RispondiElimina
    Risposte
    1. Ciao Giacomo,

      il template è per la versione 11. Stai per caso usando una versione inferiore?

      Elimina
    2. errore nel caricamento del progetto - errore nel documento xml 2565, 49

      Elimina
    3. Ciao Giacomo,

      tu stai usando la prima versione della 11: aggiorna il programma all'ultima versione (11.0.7.30). Se dopo l'aggiornamento non funzionasse ancora, prova a riscaricare il file .iwzip perché a noi risulta funzionante.

      Elimina
  5. Ciao MAeSI,
    bravi avete realizzato un template semplice e pulito proprio come lo stavo cercando.
    ho scaricato il file e sto cercando di realizzare il mio sito web.....
    ho capito come modificare i testi ed i colori ma quando vado ad aggiungere una riga nella sezione portfolio per aumentare il numero di foto si sballa tutto il layout il sito.
    Mi serve un aiutoooooooo
    mi dite per favore cosa devo modificare e dove.
    vi ringrazio tanto e spero di riuscirci. ( se c'è la faccio vi mando il link)
    Grazie Ciao Domenico

    RispondiElimina
    Risposte
    1. Ciao Domenico, grazie, lo abbiamo "solo" adattato per WebSite X5 11 :)

      E' difficile darti una risposta esauriente in un commento, ma ci proviamo: abbiamo creato uno script, presente nel template (file strip.js), che assegna ad ogni "riga" (div figli diretti di #imContent) una classe con un numero crescente che corrisponde al numero della riga presente in "Creazione della Pagina" ed abbiamo strutturato i file custom.css e custom.js basandoci su questi numeri.
      Se ad esempio duplichi tutti gli oggetti della riga 9 e li inserisci nella riga 10, dovrai duplicare tutti i css/script relativi a .row9 ed assegnarli a .row10, quindi dovrai rinominare tutte le classi successive aumentando di 1 il numero presente (.row10 diventerà .row11, .row11 diventerà .row12 e così via) sia nel file custom.css che nel file custom.js.

      Per questo tipo di modifiche strutturali, occorre avere un minimo di dimestichezza con i linguaggi di base.

      Noi ci siamo divertiti nell'adattarlo, non è detto che valga la pena apportare "pesanti" modifiche alla struttura esistente, tanto più che la prossima versione 12 supporterà RWD quindi tutto sarà (o dovrebbe essere) più semplice :)

      Elimina
    2. Ciao MAeSI intanto grazie per la risposta e la disponibilità.
      Ora che ho capito dove mettere le mani provo a combinare qualcosa e vi faccio sapere.
      Buon fine settimana.
      Un saluto Domenico.

      Elimina
    3. Ciao MAeSI,
      come giustamente anticipatamente da parte vostra la modifica che volevo apportare per me è leggermente (per modo di dire) difficoltosa, pertanto utilizzerò il template come da voi realizzato.
      Vorrei sapere, gentilmente, come modificare solo il testo del bottone rettangolare della "HOME" (ABOUT US, LEARN MORE, MEET OUR TEAM).
      Vi ringrazio anticipatamente.
      Ciao Domenico

      Elimina
    4. Ciao Domenico,
      il codice della slide che contiene tutti i testi (compresi quelli dei pulsanti), si trova al "Passo 2 - Proprietà Pagina - Esperto - Dopo l'apertura del tag BODY".

      Buon fine settimana pure a te :)

      Elimina
  6. Ciao MAeSI,
    grazie per la risposta.
    Ora posso ultimare il sito a breve vi invio link per vosti commenti, suggerimenti e migliorie.
    Buona giornata a presto,
    Saluti Domenico

    RispondiElimina
    Risposte
    1. Ciao Domenico perché non fai vedere anche a noi il tuo lavoro, un grazie

      Elimina
  7. Hi guys! Thank you for your excellent responsive template "Composite"!
    I'm having problems with icons "features". I would like to replace the icons on my own. Could you please help me how to do it?

    With respect and admiration of your work,
    Evgeny, Russia

    RispondiElimina
    Risposte
    1. Hi Evgeny, thanks for your comment.
      The icons in the "Features" are icons Font Awesome 4.2. You must change the class (e.g. fa-laptop) in the code < i class="fa fa-laptop"> . See here for complete list: fortawesome.github.io/Font-Awesome/icons/

      -----

      Ciao Evgeny, grazie per il tuo commento.
      Le icone in "Features" sono icone Font Awesome 4.2. Devi modificare la classe (per esempio fa-laptop) nel codice < i class="fa fa-laptop">. Guarda qui per la lista completa: fortawesome.github.io/Font-Awesome/icons/

      Elimina
  8. Oh, thanks for the answer!
    Wow, all turned out! ))

    RispondiElimina
  9. Hello, dear MAeSi!
    Still try to do my first site))
    Please tell me whether it is possible to add a new page in the menu?
    And will they still adaptive?
    Thus, the site will cease to be a "single page". Is it possible?

    I want to assign one of the menu item status "level" and add to him two new pages, subparagraphs.

    When I try to do that, and add new pages, I could not go to them in no other way except directly through the site map.
    The button of menu item do not work in this case. :(

    Kind regards,
    Evgeniy

    RispondiElimina
    Risposte
    1. Ciao Evgeniy, scusa se ti rispondiamo in italiano.

      Per inserire nel menu un link ad un'altra pagina, segui solo i punti 1 e 2 di questo articolo: quellidelcucuzzolo.blogspot.it/2015/03/template-tamarillo-menu-link-esterno.html

      Le pagine create non saranno automaticamente responsive, dovrai scrivere tu il codice opportuno.

      Elimina
  10. how to change the color green?

    RispondiElimina
    Risposte
    1. Hi nikolateam,

      What green color are you referring to?

      Elimina
  11. I was fine. thanks to the rapid appearance and response :)

    RispondiElimina
  12. Buonasera! Complimenti per il vostro lavoro e per i template!
    Sto utilizzando "Composite" per la creazione di un sito (finalmente qualcosa di responsive con x5!!) ma non riesco ad apportare alcune modifiche:
    1) cambiare le immagini della slide. Nonostante abbia creato nuove immagini delle stesse dimensioni di quelle di default, non riesco a farle vedere. Da dove andrebbero sostituite?
    2) per cambiare il colore, ad esempio, dei bottoni del menù... dove dovrei andare?

    So che sono modifiche banali ma datemi qualche dritta!
    Grazie, buon lavoro

    RispondiElimina
    Risposte
    1. Ciao Federica, grazie per il tuo messaggio.

      Ti rispondiamo per punti:
      1) il codice della slide si trova al "Passo 2 - Proprietà Pagina - Esperto - Dopo l'apertura del tag BODY" e, una volta sostituiti i nomi delle immagini, dovrai allegarle al "Passo 4 - Statistiche, SEO e Codice - Esperto" indicando come "Percorso relativo sul server" la cartella silder
      2) puoi cambiare il colore del menu direttamente da programma al "Passo 1 - Stile del Modello - Menu Principale"

      Elimina
  13. Questo commento è stato eliminato dall'autore.

    RispondiElimina
    Risposte
    1. esportando il template nella 12, cè qualche disfunzione, se lo adattasse alla 12 sareste davvero superesaustivi !!! nel frattempo vi dico che i codici nell body nell head vengono a mancare....

      Elimina
    2. Ciao Stefano,
      importare il template Composite nella versione 12 ha poco senso, visto che con questa versione puoi già creare siti responsive senza aggiungere troppi codici.

      Sarebbe da rifare da zero ma, per il momento, non abbiamo intenzione di riprendere in mano i vecchi template per adattarli alla nuova versione.

      Elimina
  14. ok grazie, però aprendo il template nella 12 purtroppo perde di qualche funzionalità.
    prevedete template adattati anche per la 12?

    RispondiElimina
    Risposte
    1. Ciao Stefano.

      Sì, qualcosa faremo :)

      Elimina
  15. Ciao MaeSI,

    Complimenti !! Ottimo lavoro.

    Ho acquistato WebSite X5 Prof. 12. Ho effettuato il download del vs. Template "Compositive" e sto cercando di personalizzarlo in base alle mie esigenze.

    Ho una piccola difficolta' !! Non riesco a cambiare il colore del background dell'area CONTACT (Contact Us) e delle atre sezioni come ABOUT - OUR TEAM ecc....

    Vorrei aggiunere in CONTATTI un colore BIANCO ( White / #ffffff ) invece del grigio come dal vs. Template.

    Nonostante accedo al file costum.CSS vado alla riga, presumo giusta ( /* contact */.row10, .row11 {background-color:#303030) modifico il codice colore ma nel template NON succede nulla !!!

    Come posso fare? Resto in attesa di un vs. cortese riscontro.

    Ringrazio anticipatamente e vi auguro ogni bene.

    Luigi

    RispondiElimina
    Risposte
    1. Ciao Luigi,
      grazie per il messaggio.
      Come già scritto nei commenti precedenti, importare il template Composite nella versione 12 ha poco senso, visto che con questa versione puoi già creare siti responsive senza aggiungere troppi codici.

      Se invece lo stai provando con la versione 11, per vedere i cambiamenti apportati al file custom.css, devi rimuovere il file dal progetto e riallegarlo con le modifiche effettuate.

      Elimina
    2. Gentilissimo MAeSI,

      seguito tuo consiglio ho importato il template nella versione 11 di WSX5 ed e' tutto PERFETTO !! Non ho piu' problemi con il colore del background.

      Ti chiedo solo un'ultima cortesia e chiedo perdono se approfitto della tua generosa disponibilita'.

      Come posso sostituire il Top Slide del Vs. template aggiugendo il Top Slide UGUALE a quello che ha fatto Nino Conforti nel suo Sito Web tychehouse.it ?

      Essendo poco esporto di "Codice", non conosco cosa e dove fare le modifiche !

      GRAZIE 1000 e Un cordiale Saluto

      Luigi

      Elimina
    3. Ciao Luigi,
      la slideshow usata nel sito di Nino è stata creata con questo servizio online free: www.comslider.com
      Dovrai inserire il codice generato dal servizio al posto del codice della flexslider in Proprietà pagina -> Esperto -> Dopo l'apertura del tag body.

      Elimina
    4. Ciao MaeSI,

      Ottimo suggerimento, funziona perfettamente.

      Unico problema riscontrato è che le immagini non si adattano alla modalita' visione RESPONSIVE !! Sono in cerca di una soluzione.....brancolo nel buio....

      Ti sono grato per avermi preso in considerazione e per aver risposto alle mie richieste.

      Sinceri Saluti e Buon Lavoro

      Luigi

      Elimina
    5. Ciao Luigi,

      non conosciamo il servizio che offre www.comslider.com ma, come puoi vedere, nel sito di Nino la slideshow è responsive.
      Controlla le impostazioni del template scelto, di più non ti sappiamo dire.

      Buon lavoro anche a te.

      Elimina
    6. Ciao Luigi, spero abbia trovato la soluzione, flag a Responsive. Scusami se rispondo ora ma avevo problemi ad entrare nel blog.

      Elimina
    7. Ciao Nino,

      Grazie per avermi preso in considerazione.

      Seguito suggerimenti di MAeSI il mio nuovo progetto ha cominiato a realizzarsi. Vedi ---> vinicolagranese.it/in_costruzione <--

      Ora sono alle prese con il cambio immagini e personalizzazione delle Font Awesome ( Font a icone ) come da te gia' fatto nel tuo sito nell' area INFO (Natura, Benessere, Tranquilita' e Ospitalita').

      Puoi fornirmi un suggerimento su come fare !?

      Ho preso visione del sito web fortawesome.github.io/Font-Awesome/ ma sinceramente NON sono riuscito a capire/trovare una soluzione.

      Perdonami Nino, ma come si puo' risolvere la personalizzare del MENU' (HOME, ABOUT US, LEARN MORE, MEET OUR TEAM....) nel template compositive !!

      Confidando in una tua gentile risposta, ti porgo i miei piu' cordiali saluti

      Lugi

      Elimina
    8. Perdonami Nino,

      Con riferimento alla mia precedente risposta/messaggio, ho risolto con il cambio immagini "Font Awesome icons" .......Ho capito come fare !!! :-)

      Ora sono in cerca della soluzione solo sulla personalizzazione del Menu' template Responsive....

      Una buona e felice sera.......

      Luigi

      Elimina
    9. Ciao Luigi, se non ricordo male nel menu trovi in trasparenza un codice html basta cliccarci sopra e cambi la descrizione del menu

      Elimina
  16. Ciao ragazzi,
    ho bisogno di aiuto!!!! Se siete così gentili da spiegarmi bene come faccio ad inserire solo la slide che avete fatto sul composite template dentro un altro progetto. Se non chiedo troppo passo passo, e scusate se esagero :( se possibile screenshots

    RispondiElimina
    Risposte
    1. Ciao Carlo,

      in un commento è un po' complicato scrivere dettagliatamente quello che chiedi.
      Vedremo se fare un post a riguardo... tempo permettendo.

      Elimina
    2. interessa anche a me, sarebbe fantastico !

      Elimina
  17. Ciao, grazie per i vs template. Ho potuto constatare che se non sai utilizzare i codici con il prg website x5 fai siti non professionali, quindi grazie ancora.....Ho scaricato questo template (composite) e vorrei sapere che dimensioni in pixel devono essere le foto x flexslider? Inoltre come fare per modificare le scritte sopra queste slide di flexslider? grazie ancora ciao

    RispondiElimina
    Risposte
    1. Ciao Simone, grazie per il tuo commento.
      Se vuoi andare sul sicuro, utilizza, per tutte le immagini, le stesse dimensioni delle immagini dell'esempio (1920x800).
      Il codice della slide che contiene tutti i testi si trova al "Passo 2 - Proprietà Pagina - Esperto - Dopo l'apertura del tag BODY".

      Elimina
  18. A dimenticavo...quando le immagini le carico sul mio router ( register ) devo metterle in una cartella e non serve? Grazie

    RispondiElimina
    Risposte
    1. Si può fare tutto attraverso il programma: al "Passo 4 - Statistiche, SEO e Codice - Esperto" allega le tue immagini indicando come "Percorso relativo sul server" la cartella slider. Poi nel codice della slide che trovi, come detto in risposta al tuo precedente commento, al Passo 2, dovrai modificare il nome delle immagini nell'attributo src.
      Comunque ti consigliamo, in caso di ulteriori dubbi, di leggere anche i commenti: avresti trovato, per esempio, le risposte alle tue domande :)

      Elimina
  19. Ciao, inanzitutto complimenti per il template che è favoloso, molto performante e interessante per poterlo customizzare senza perder lo stile tuo, ho website x5 professional 12 e caricandolo ho notato la prima volta che se andavo sulle statistiche SEO e codice trovavo non solo la parte di codice relativa al font che risulta esser sotto la "prima della chiusura del tag HEAD" ma anche tutto il codice per far funzionare la flexslider che risultava "dopo l'apertura del tag body" , cosa che adesso non compare più. il template funziona regolarmente ma sono impossibilitato da website a modificare la slider in cima e potrei farlo solo da codice una volta esposrtato sul disco. HELP ME

    grazie

    Chris

    RispondiElimina
    Risposte
    1. Ciao Chris,
      grazie per il commento.
      Stai guardando la sezione sbagliata: il codice della slideshow si trova al Passo 2, in Proprietà della pagina Home, Sezione esperto, Dopo l'apertura del tag body.

      Elimina
  20. Buongiorno, vorrei sapere come cambiare il colore dei tasti su questo modello composito.
    Voglio cambiare il colore dei tasti cursore ei pulsanti sono a piè di pagina.
    Vado alla cartella in cui il progetto, posso cambiare i colori in custom.css,
    salvato e il tempo di aprire il progetto di nuovo al colore precedente,
    vale a dire, non è cambiata a colori.
    Che cosa sto facendo di sbagliato? Grazie.

    RispondiElimina
    Risposte
    1. Ciao portátil,
      per memorizzare le modifiche fatte al file custom.css devi rimuovere il file dal progetto e riallegarlo con le modifiche effettuate.

      Elimina
  21. MAeSI, grazie per il vostro aiuto, ma penso che risolverà il problema.

    Vediamo se ho capito, modificare, salvare custom.css.

    Dopo il programma, al punto 4,
    statistiche, SEO e codice, Avanzate, rimuovere custom.css
    e lo aggiunge le modifiche apportate.

    Sarebbe?

    Grazie.

    RispondiElimina
    Risposte
    1. Sì, se abbiamo capito bene quello che ci stai scrivendo, stai seguendo il procedimento corretto.

      Elimina
    2. MAeSI, grazie per aiuto, quando il progetto è pronto, io ti mando il link per voi a vedere. Abbracci.

      Elimina
  22. ciao
    sto utilizzando il template, molto bello, ma ho dovuto ovviamente fare modifiche. uso la v12 pro. ho il problema che riguarda il menu hamburger che mi appare solo nella risoluzione da 900 a999 px circa. ho provato a modificare le varie impostazioni dal passo 1 e poi responsive e mi sono accorto che il problema lo ho sola sulla home page. Nelle altre va. ho provato a guardare il file custom css ma non conoscendo bene il codice non ci salto fuori
    se mi potete autare, immetto anche il link per la prova
    grazie
    FAbio

    RispondiElimina
    Risposte
    1. Ciao Fabio,

      come hai intuito, il template, per essere utilizzato nella 12, va modificato.
      Non sapendo quali modifiche hai fatto, non possiamo aiutarti se non vedendo qualcosa.
      Se vuoi, metti pure il link alla tua prova.

      Elimina
    2. grazie
      eccolo www.pcwin.it/lapiazza/index.html
      molto gentile

      Elimina
    3. Ciao Fabio,
      devi eliminare questa regola presente alla riga 541 del file custom.css:
      #imMnMn {
      display: none;
      }

      Elimina
    4. risolto grazie 1000 davvero

      Elimina
  23. Buona sera installando il template composite su website x5 evo11 se creo nuove pagine mi crea una sorta di menu azzurro sotto il menu principale del sito come posso risolvere tale problema. Come posso aggiungere nuove pagine interne senza che mi si crei lo stesso errore????
    grazie in anticipo.

    RispondiElimina
    Risposte
    1. Ciao,
      il template è nato come template monopagina, se vuoi aggiungere altre pagine dovrai "sporcarti un po' le mani": nelle proprietà della pagina Home, sezione Esperto trovi tutti i codici personalizzati utilizzati che dovrai spulciare ed inserire quelli relativi alla struttura del sito nelle nuove pagine.

      Elimina
  24. Ciao, complimenti, bel template. Ho una richiesta: come posso creare un collegamento ad una immagine che si apre con showbox nella parte del codice presente all'interno degli oggetti "testo" della prima riga?

    RispondiElimina
    Risposte
    1. Ciao Francesco,
      grazie per il commento.
      Se intendi inserire il link con showbox ad uno dei pulsanti della flexslider, devi aggiungere al tag <a> l'attributo onclick generato da WebSite.
      QUI puoi vedere un esempio di codice da utilizzare; le parti in rosso sono da personalizzare. Dovrai anche collegare al progetto l'immagine che visualizzerai in showbox con gli strumenti del programma.
      Se hai ancora problemi posta il link alla tua prova online.

      Elimina
    2. Ho provato e premetto che lo showbox funziona ma insieme all'icona rotonda (che si è spostata verso il basso) vengono visualizzate due bande rettangolari.

      Elimina
    3. Quindi non ti stavi riferendo alla flexslider!
      Per gli oggetti presenti in "Creazione della Pagina" puoi fare tutto da programma.
      Altrimenti puoi togliere dal codice postato le classi relative ai pulsanti della flexslider.

      Elimina
  25. Carissimi
    vi scrivo per chiedere gentilmente un vostro consiglio ed eventualmente una soluzione. Sto cercando di inserire lo slider di flexslider dentro il template Onetel. Premetto che non sono un esperto di css ma sono riuscito ad inserirlo correttamente (come avete fatto nel template composite) riportando la parte di flexslider dentro custom.css di Onetel tranne che io avrei bisogno che il menu rimanesse all'inizio della pagina come nel template Onetel: mi spiego desidero che il menu e l'intestazione scrollino con la pagina e non rimangano come l'attributo "fixed".
    Credo di aver capito che dopo l'inserimento dello slider come <div subito dopo l'apertura di <body di fatto altera la sequenza degli oggetti creati da WSX5 e questo credo renda necessaria la ridefinizione degli attributi di imMnMn nel custom.css
    Mi potete aiutare quando trovate qualche minuto? ve ne sarei davvero grato

    un saluto e complimenti

    Nik
    Ho provato in tutti i modi ma non ci sono riuscito. Credo che

    RispondiElimina
    Risposte
    1. Ciao Nicola,
      i modi possono essere diversi, ti indichiamo quello che ci sembra più semplice spiegare in un commento: puoi provare a spostare il codice HTML della slider "Prima della chiusura del tag BODY" avvolgendolo in un div con position:absolute e top:0
      Dovrai poi regolare il margine alto del contenuto della pagina (da programma o con i CSS) per lasciare spazio alla slider; se il sito è responsive dovrai anche ridefinire questo valore con media query.
      Se hai problemi, posta un link alla tua prova online.

      Elimina
  26. Carissimi,
    grazie per la pronta risposta. Ho fatto come indicato ed ho provato diverse soluzioni. Come suggerito incartare lo slider in div con attributi Absolute e top:0 mette lo slider in testa alla pagina. Lo stesso risultato lo si ottiene se invece si modifica nel css di flexslider l'attributo da relative ad absolute. In quel caso non importa se lo slider lo si definisce prima della chiusura del body o dopo l'apertura.
    Invece che definire lo spazio per lo slider come margine sup della pagine (che condizionerebbe le altre pagine) ho inserito un oggetto HTML vuoto nella pagina di interesse con altezza fissa. Questo consente di spostare verso il basso gli altri oggetti della pagina

    Tuttavia lo slider di fatto sta davanti a tutti gli alti oggetti della pagina. Vorrei che i container del template onetel (ovvero quelli che si muovono al passaggio del mouse) fossero davanti ed in leggera sovrapposizione (come avete fato voi nel template dove però l'immagine e è fissa. Si può fare?
    fatemi sapere quando potete. Ho preparato la pagina prova su www.techdyn.it/appo/index.html
    a presto
    Nik

    RispondiElimina
    Risposte
    1. Ciao Nicola,
      si sta andando un po' fuori tema visto che questo articolo riguarda il template Composite :)
      Comunque, potresti assegnare position:relative e aumentare lo z-index del div che contiene gli oggetti testo che si alzano all'hover (nella tua prova #imGroup_2).

      Elimina
  27. Devo aggiungere icone nel piè di pagina di "tripadvisor"
    Scrivo fa fa-tripadvisor ma mi da errore!
    Come devo fare??
    Grazie in anticipo

    RispondiElimina
    Risposte
    1. Ciao Antonio,
      devi aggiornare i file legati a font Awesome. Nella versione di font Awesome integrata nel Composite quell'icona non era ancora presente. Scarica dal sito ufficiale la nuova versione e sostituisci da programma i file presenti nella cartella fonts e il file font-awesome.min.css.

      Elimina
  28. Salve, sto usando la versione di website 13 professional, e quando carico il progetto naturalmente me lo adegua alla mia versione, ma perdo parte delle immagini di sfondo e non lo carica bene. La mia domanda è: Cosa è cambiato nella versione successiva che , caso mai, non avrebbe piu bisogno di interventi esterni al programma?? Cosa posso fare perchè il progetto si possa vedere corretamente?? Grazie per la vostra eventuale risposta e complimenti per questo forum veramente ben fatto.

    RispondiElimina
    Risposte
    1. Ciao,
      dalla versione 11 alla attuale 13 sono cambiate molte cose.
      Sicuramente dovrai rimuovere tutto il codice personalizzato inserito che gestisce il responsive (la versione 11 non lo prevedeva ancora) e tanto altro.
      Se non sai dove mettere le mani ti conviene rifarlo da zero utilizzando le numerose funzionalità introdotte da quest'ultima versione.

      Elimina
    2. grazie per la risposta celerissima.
      Volevo, se non ne approfitto troppo, naturalmente il problema non è più il responsive, sapere con la versione 13 come realizzare il sito in righe orizzontali , in un unica pagina. C'è bisogno comunque di codice esterno o si puo realizzare anche solo con gli strumenti del programma? Grazie ancora per l'interessamento.

      Elimina
    3. Ciao,
      con la 13 puoi gestire le righe da programma (vedi guida).

      Elimina