Website builder drag & drop

Puoi progettare il tuo sito web trascinando e rilasciando blocchi di costruzione, poi modificandoli per adattarli alle tue esigenze di contenuto e layout.

Vedi anche

Tutorial Odoo: Progetta il tuo sito web: testo e colori

Aggiungere un blocco di costruzione

Per aggiungere un blocco a una pagina del sito web, accedi alla pagina, fai clic su Modifica, quindi trascina e rilascia il blocco di costruzione desiderato nella posizione appropriata. Sono disponibili due tipi di blocchi di costruzione: Categorie e Contenuto interno. I blocchi di costruzione Contenuto interno possono essere aggiunti solo all’interno dei blocchi di costruzione Categorie.

Quando si clicca su un blocco categoria, appare un popup che consente di scegliere tra più modelli per ogni categoria.

Suggerimento

Cerca un blocco specifico nel popup Inserisci un blocco utilizzando la barra di ricerca.

Una volta posizionato il blocco categoria, puoi trascinare e rilasciare i blocchi Contenuto interno al suo interno. I blocchi Contenuto interno ti permettono di aggiungere elementi, come video, immagini, pulsanti dei social media, ecc., all’interno di blocchi categoria preesistenti.

Nota

• Puoi anche aggiungere un blocco sulla pagina di login. Per farlo, naviga alla homepage del sito web, aggiungi /web/login all’URL e premi Invio.

• L’accesso a determinati blocchi richiede l’installazione della rispettiva applicazione o modulo (ad esempio, E-commerce per il blocco Prodotti).

Example

Aggiungi tutti i tuoi account di social media in un unico posto con il blocco contenuto interno Social Media. Attiva o disattiva l’interruttore accanto alla piattaforma desiderata e copia/incolla l’URL del tuo account.

modulo

Il blocco Modulo viene utilizzato per raccogliere informazioni dai visitatori del sito web e, se applicabile, creare record nel database. Per aggiungere un modulo a una pagina del sito web, trascina e rilascia il blocco della categoria Contatti e moduli, quindi seleziona un blocco nel popup.

Azione

Per impostazione predefinita, quando il modulo viene inviato, viene automaticamente inviata un’email contenente le informazioni inserite dal visitatore. A seconda delle app installate nel database, potrebbero diventare disponibili azioni aggiuntive che possono creare automaticamente record. Per scegliere un’azione diversa, fai clic su Modifica, fai clic sul modulo, vai alla scheda Stile e seleziona l”Azione desiderata:

• Candidati per un lavoro (Assunzioni)

• Crea un cliente (E-commerce)

• Crea un ticket (Helpdesk)

• Crea un’opportunità (CRM)

• Iscriviti alla newsletter (E-mail marketing)

• Crea un’attività (Progetti)

• Altri modelli: per generare altri tipi di record

Per impostazione predefinita, l’invio del modulo reindirizza i visitatori a una pagina Grazie. Usa il campo URL per inviarli a una pagina diversa. In alternativa, puoi scegliere di non reindirizzare e mantenerli sulla pagina del modulo selezionando Niente o Mostra messaggio nel campo Al successo.

Campi

Per aggiungere un nuovo campo al modulo, vai alla scheda Stile e fai clic sul pulsante + Campo accanto alla sezione Modulo o Campo. Per modificare qualsiasi campo del modulo, seleziona il campo, quindi utilizza le opzioni disponibili nella sezione Campo della scheda Stile. Ad esempio, puoi:

• Modifica il campo Tipo.

  Suggerimento

  È anche possibile selezionare un Campo esistente dal database e utilizzare i dati che contiene. I campi disponibili dipendono dall’azione selezionata. Possono essere utilizzati anche i campi proprietà aggiunti al database.

  Click here to preview all field types.

  

  Alcuni campi sono visivamente simili, ma i dati inseriti devono seguire un formato specifico.

• Modifica l”Etichetta del campo e adatta la sua Posizione.

• Abilitare una Descrizione del campo. Attiva l’interruttore e fai clic sulla descrizione predefinita nel modulo per modificarla.

• Aggiungi un Segnaposto o un Valore predefinito.

• Specifica se il campo è Obbligatorio.

• Modifica le impostazioni di visibilità del campo.

• Aggiungi un”animazione.

Una volta apportate le modifiche desiderate, fai clic su Salva.

Aggiungere un modulo di contatto Odoo su un sito web non-Odoo

Puoi visualizzare un modulo di contatto Odoo su un altro sito web utilizzando un iframe. Per farlo, segui questi passaggi:

1. Prepare the Odoo form: Create a contact form on a page in Odoo Website and remove the header and footer. Make sure only the contact form remains on the page.

2. Generare un codice incorporabile: copia l’URL della pagina del modulo Odoo e incollalo in un generatore di iframe, come La Digitale.dev o iFrame Generator. Regola larghezza e altezza per una visualizzazione corretta.

3. Aggiungere il codice incorporato al sito web non-Odoo: apri l’HTML della pagina pertinente (nell’editor di codice o nel CMS) e inserisci il codice incorporato nel punto in cui deve essere visualizzato il modulo.

Example

Esempio di codice incorporato:

<iframe src="https://example.com/odoo-form"
        style="border:0;"
        name="odooForm"
        scrolling="no"
        frameborder="0"
        marginheight="0"
        marginwidth="0"
        height="400px"
        width="600px"
        allowfullscreen>
 </iframe>

Incorpora codice

Il codice di incorporamento consente di integrare contenuti da servizi di terze parti in una pagina, come video da YouTube, mappe da Google Maps, post dai social media da Instagram, ecc.

Dopo aver trascinato e rilasciato il blocco Codice incorporato dalla sezione Contenuto interno in una pagina, fai clic sul blocco, quindi vai alla scheda Stile e fai clic su Modifica. Sostituisci il codice segnaposto con il tuo codice incorporato personalizzato.

Avvertimento

Non copiare/incollare codice che non capisci, poiché potrebbe mettere a rischio i tuoi dati.

Spostare, scambiare, duplicare o eliminare un blocco di costruzione

Trascina i bordi turchesi sul blocco per ridurre o aumentare lo spazio nella parte superiore o inferiore.

Cambia l’ordine dei blocchi facendo clic su (freccia su) o (freccia giù) e sposta il blocco sulla pagina facendo clic su (frecce). Quando hai più colonne, sposta una colonna a sinistra o a destra facendo clic su (freccia sinistra) o (freccia destra).

Per duplicare un blocco di costruzione, fai clic su (duplica). Una volta duplicato, il nuovo blocco appare sulla pagina sotto l’originale.

Suggerimento

In alternativa, fai clic sull’icona (duplica) nella parte superiore della scheda Stile per duplicare il blocco selezionato.

Per eliminare un blocco, fai clic su (cestino).

Modifica un blocco di costruzione

Per modificare il contenuto di un blocco di costruzione, fai clic su di esso e vai alla scheda Stile. Le opzioni di personalizzazione disponibili variano a seconda del tipo di blocco selezionato.

Vedi anche

• Elementi di web design

• Visibilità

Sfondo

Per modificare lo sfondo di un blocco di costruzione, seleziona il blocco, vai alla scheda Stile e fai clic sul punto colorato o su un’altra opzione Sfondo. Puoi cambiare il colore e/o aggiungere un’immagine, un video e/o una forma. Una volta selezionata una forma, appaiono nuovi campi per consentire di personalizzare la forma.

Suggerimento

• Posiziona un elemento (immagine, testo, ecc.) dietro o davanti a un altro utilizzando le icone Porta in secondo piano o Porta in primo piano.

  

• Per ridimensionare un blocco, fai clic e trascina i punti attorno ai suoi bordi per regolarlo secondo necessità.

  

Vedi anche

Tema generale

Layout: griglia e colonne

Per la maggior parte dei blocchi di costruzione, puoi scegliere tra due stili di layout: griglia o colonne (cols). Per modificare lo stile di layout predefinito, fai clic sul blocco, vai alla scheda Stile e imposta il campo Layout su Griglia o Cols.

Griglia

Il layout Griglia consente di riposizionare e ridimensionare elementi, come immagini o testo, trascinandoli e rilasciandoli. Quando Griglia è selezionato, sono disponibili opzioni aggiuntive per Aggiungere elementi cliccando su Immagine, Testo o Pulsante.

Colonne

La scelta del layout Cols consente di determinare il numero di elementi per riga all’interno del blocco. Per farlo, seleziona il blocco da modificare, fai clic sul menu a discesa accanto al campo Cols e regola il numero. Puoi quindi modificare le impostazioni di una colonna specifica utilizzando le opzioni nella sezione Colonna della scheda Stile.

Nota

Per impostazione predefinita, sui dispositivi mobili, è visibile solo un elemento (colonna) per riga per garantire che il contenuto rimanga facilmente leggibile e accessibile su schermi più piccoli. Per modificare il valore, cliccare su (icona mobile) nella parte superiore dell’editor del sito web e adattare il numero di colonne. Le forme sono nascoste per impostazione predefinita sui dispositivi mobili.

Salvare un blocco di costruzione personalizzato

Puoi salvare un blocco di costruzione personalizzato per riutilizzarlo altrove. Per farlo, selezionalo, vai alla scheda Stile e fai clic sull’icona (floppy disk). Fai clic sul pulsante Salva nel popup per confermare il salvataggio del blocco personalizzato.

Per aggiungere un blocco di costruzione salvato alla pagina, accedere alla scheda Blocchi e trascinare il blocco Personalizzato dalla sezione Categorie. Nel popup che si apre, cliccare sul blocco desiderato nella categoria Personalizzato.

Suggerimento

Nel popup Inserire un blocco, cliccare su (modifica) per rinominare il blocco personalizzato o su (elimina) per eliminarlo.

Creare un collegamento di ancoraggio

I collegamenti di ancoraggio sono collegamenti ipertestuali che indirizzano gli utenti a una sezione specifica di una pagina. Per creare un collegamento di ancoraggio per un blocco, seguire questi passaggi:

1. Cliccare su Modifica e selezionare il blocco a cui si desidera collegare.

2. Fai clic su (link) nella parte superiore della scheda Stile.

3. Per modificare il nome di ancoraggio predefinito, cliccare su Modifica nel messaggio popup verde che si apre.

4. Sostituire il nome dell’ancoraggio e cliccare su Salva e copia.

Una volta salvato l’ancoraggio, è possibile collegarlo da qualsiasi punto del sito web.