Vai al contenuto principale

Integrare il widget Lokki sul proprio sito web

Aggiungi un pulsante che reindirizzi al tuo negozio online Lokki. Il codice da copiare è disponibile in questo articolo. Compatibile con Wix, WordPress e Squarespace.

Scritto da Federica Campilongo

Per integrare Lokki nel tuo sito web, aggiungi un pulsante di reindirizzamento: quando i clienti fanno clic sul pulsante, vengono indirizzati al tuo negozio online. Qui sotto trovi due versioni: copia quella più adatta alla tua attività e incollala sul tuo sito.

Pulsante di reindirizzamento

Facendo clic sul pulsante, i clienti vengono indirizzati al tuo negozio online Lokki. Prima di incollare il codice, sostituisci {url_boutique_en_ligne} con l’URL del tuo negozio, disponibile in Impostazioni > Negozio online > Contatti.

Rimuovi le parentesi graffe { }, lasciando soltanto l’URL.

Versione solo noleggio

<div style="position: fixed; bottom: 2rem; right: 2rem; width: 30%; max-width: 200px; min-width: 175px; z-index: 200000; background-color: white; border-radius: 10px; box-shadow: 0px 0px 30px rgba(48, 35, 173, 0.15); padding: 15px 20px; text-align: center; line-height: 24px; display: flex; justify-content: space-between; flex-direction: column; font-family: 'Rubik', 'Helvetica', 'sans-serif'">

<span style="color: #8D8AAB; font-weight: 500; border-bottom: 1px solid #E9E7FA; padding-bottom: 6px; font-size: 16px">

PRENOTA ONLINE

</span>

<a style="width: 100%; padding: 9px 0px; border-radius: 5px; box-shadow: rgba(48, 35, 173, 0.13) 2px 2px 6px 0px; background-color: #3023ad; border: none; overflow: hidden; text-decoration: none; color: white; font-weight: 500; line-height: 20px; font-size: 16px;" href="{url_boutique_en_ligne}" target="_blank">

Noleggio biciclette

</a>

</div>

Versione noleggio e officina

Due pulsanti: uno per il noleggio e uno per la riparazione. Sostituisci anche {url_atelier} con l’URL della tua officina, eliminando le parentesi graffe.

<div style="position: fixed; bottom: 2rem; right: 2rem; width: 30%; max-width: 200px; min-width: 175px; height: 130px; z-index: 200000; background-color: white; border-radius: 10px; box-shadow: 0px 0px 30px rgba(48, 35, 173, 0.15); padding: 15px 20px; text-align: center; line-height: 24px; display: flex; justify-content: space-between; flex-direction: column; font-family: 'Rubik', 'Helvetica', 'sans-serif'">

<span style="color: #8D8AAB; font-weight: 500; border-bottom: 1px solid #E9E7FA; padding-bottom: 6px; font-size: 16px">

PRENOTA ONLINE

</span>

<a style="width: 100%; padding: 9px 0px; border-radius: 5px; box-shadow: rgba(48, 35, 173, 0.13) 2px 2px 6px 0px; background-color: #3023ad; border: none; overflow: hidden; text-decoration: none; color: white; font-weight: 500; line-height: 20px; font-size: 16px;" href="{url_boutique_en_ligne}" target="_blank">

Noleggio biciclette

</a>

<a style="width: 100%; padding: 9px 0px; border-radius: 5px; box-shadow: rgba(48, 35, 173, 0.13) 2px 2px 6px 0px; background-color: #2ad29b; border: none; overflow: hidden; text-decoration: none; color: white; font-weight: 500; line-height: 20px; font-size: 16px;" href="{url_atelier}" target="_blank">

Riparazione biciclette

</a>

</div>


Domande frequenti

Come integrare il codice su WordPress?

Nell’editor della tua pagina WordPress, aggiungi un blocco HTML personalizzato, incolla il codice Lokki e pubblica la pagina. Se il tuo tema non prevede questo tipo di blocco, cerca l’opzione Codice o HTML grezzo tra le opzioni disponibili.

Come integrare il codice su Squarespace?

Nell’editor di Squarespace, aggiungi un blocco Codice nel punto desiderato della pagina, incolla il codice Lokki e salva.

Come integrare il codice su Wix?

Nell’editor di Wix, aggiungi un elemento Codice HTML dalla sezione Incorpora, quindi incolla il codice Lokki. Se il pulsante viene visualizzato solo in parte, aumenta l’altezza del blocco nelle impostazioni dell’elemento. Puoi anche seguire il video disponibile in fondo a questo articolo.

Dove trovo l’URL del mio negozio online?

Vai su Impostazioni > Negozio online > Contatti. L’URL del tuo negozio è indicato in questa sottosezione. Copialo e sostituisci {url_boutique_en_ligne} nel codice, eliminando le parentesi graffe.

Posso affidare l’integrazione alla mia agenzia web?

Sì. Puoi inviare direttamente il codice presente in questo articolo alla tua agenzia o al tuo sviluppatore. Avranno bisogno solo del codice e dell’URL del tuo negozio online.


Da ricordare

  • Sostituisci {url_boutique_en_ligne} con l’URL disponibile in Impostazioni > Negozio online > Contatti.

  • Il codice funziona su WordPress, Wix, Squarespace e su qualsiasi CMS che supporti l’HTML personalizzato.

Hai ricevuto la risposta alla tua domanda?