Jotform Anywhere.

Jotform Anywhere è un piccolo SDK JavaScript che porta le funzionalità del Costruttore di Moduli Jotform a tutte le app web.

Jotform Anywhere fornisce una serie di funzionalità lato client che ti consentono di aggiungere un Generatore di moduli all'interno della tua app web. I tuoi utenti possono creare/modificare e incorporare moduli senza lasciare il tuo sito.

Oltre 7500 modelli di moduli pronti per l'uso

Gli utenti possono incorporare direttamente moduli da oltre 7500 bellissimi modelli di modulo con pochi clic.

Costruttore Moduli

Consenti ai tuoi utenti di creare qualsiasi tipo di modulo web con oltre 25 tipi di domande e oltre 350 widget.

Copia e incolla questo codice per inizializzare la libreria javascriptDISABLED:

  <script type="text/javascript" src="//js.jotform.com/JotFormAnywhere.js"></script>

Copia e incolla il codice html di seguito per aggiungere un pulsante che avvii un generatore di moduli

  <button onclick="JotFormAnywhere.launchFormBuilder({});">Add Form</button>

Facendo clic su quel pulsante verrà avviato Jotform iframe (generatore di moduli incorporabile) e il modulo creato/selezionato verrà aggiunto al corpo per impostazione predefinita. Consulta la documentazione per ulteriori opzioni di personalizzazione.

• Come Breezi utilizza Jotform Anywhere on their website builder as a form builder.
• Sidengo utilizza Jotform Anywhere per consentire agli utenti di Creare Moduli personalizzati.

Cos'è Jotform Anywhere?

Jotform è un costruttore di moduli online. Utilizzando l'editor di moduli con funzione trascina e rilascia e i suoi oltre 7500 modelli di moduli pronti per l'uso, la creazione di moduli è rapida, facile e divertente.

Jotform Anywhere è un piccolo SDK JavaScript che porta le funzionalità di Jotform Form Builder a tutte le app web. Puoi incorporare facilmente Jotform Form Builder nella tua app e i tuoi utenti potranno avviare il generatore di moduli come una procedura guidata lightbox, creare i loro moduli e aggiungerli alle loro pagine web.

Per chi è Jotform Anywhere?

Jotform Anywhere è particolarmente utile per i creatori di siti Web e i fornitori di blog. Tuttavia, qualsiasi tipo di app Web che deve consentire agli utenti di creare moduli Web può utilizzarla.

Quali funzionalità ha attualmente Jotform Anywhere?

1. Aggiungi modulo
I tuoi utenti possono aggiungere un modulo in qualsiasi punto della pagina. L'aggiunta di un modulo avvierà una procedura guidata in una casella modale. I tuoi utenti possono scegliere da uno degli oltre 7500 modelli di modulo già pronti o utilizzare il generatore di moduli per creare il proprio modulo.

2. Modifica/Elimina modulo
Una volta aggiunto un modulo nell'editor, l'utente può passare il mouse sopra il modulo e fare clic sul pulsante Modifica per riavviare la procedura guidata per la creazione di moduli.

3. Ottieni codice modulo
La libreria javaScript di JotFormAnywhere restituisce un codice modulo in modo che tu possa inserirlo nella versione live del sito. Puoi anche ottenere dati aggiuntivi come larghezza/altezza del modulo da JotFormAnywhere.

Se hai altre esigenze, contattaci. Saremo lieti di implementare funzionalità aggiuntive per supportare un'integrazione più solida.

Ci sono requisiti o restrizioni?

Puoi utilizzare Jotform Anywhere senza autorizzazione. Non è necessario ottenere una chiave API o compilare un'applicazione. Copia e incolla semplicemente gli esempi di codice e sei pronto per partire.

Non ci sono restrizioni sulla quantità di utilizzo. Puoi posizionarlo su qualsiasi pagina della tua app web.

I miei utenti devono creare un profilo Jotform?

No, non è necessario che abbiano un profilo Jotform per creare moduli o ricevere i loro invii via email. Dal momento che inseriranno un indirizzo e-mail per ricevere i loro invii di moduli, accettiamo l'indirizzo e-mail come registrazione e creiamo profili ospiti in background.

Perché Dovrei usare Jotform Anywhere?

Se hai una piattaforma in cui gli utenti chiedono di poter creare moduli per le loro pagine, Jotform Anywhere è un ottimo modo per fornire loro questa funzionalità.

Cosa Devo Fare se ho Ulteriori Domande?

Non esitare a contattarci. Saremo lieti di aiutarti con le tue domande e se hai bisogno di ulteriore aiuto ti assegneremo uno sviluppatore che ti aiuti con l'integrazione.

Carica la libreria javascript di JotformAnywhere

  <script type="text/javascript" src="//js.jotform.com/JotFormAnywhere.js"></script>

Dopo aver caricato lo script sopra puoi usare l'oggetto JotformAnyhere. Questo oggetto JS fornisce i metodi necessari per consentire ai siti Web di creare e incorporare moduli tramite Jotform.

Methods

JotFormAnywhere.launchFormBuilder

Se non viene fornita alcuna opzione, JotformAnywhere.launchFormBuilder aprirà un modalbox che include iframe fornito da Jotform. Tutto il processo di creazione/modifica del modulo viene eseguito all'interno di questo iframe.

Molto probabilmente chiamerai questo metodo come callback di un evento click.

Esempio

JotFormAnywhere.launchFormBuilder({
builderMaskColor: "#FFFFFF"
})

Parametri

Opzioni

JotFormAnywhere.insertForm

JotformAnywhere.insertForm crea un div con id "jotform_form_container_{formID}" e incorpora il modulo all'interno.

L'utilizzo di questo metodo per inserire il modulo all'interno della tua pagina Web è fortemente raccomandato sia in fase di modifica che in diretta

Esempio

JotFormAnywhere.insertForm({
formID: "30647084188965",
insertTo: "#formHere",
putEditButton: false,
putDeleteButton: false
})

Parametri

Opzioni

JotFormAnywhere.createInstantForm

Usando il metodo JotformAnywhere.createInstantForm puoi indicare alla libreria JotformAnywhere di creare un modulo subito dopo aver caricato il file javascript. Nota che la chiamata a questo metodo pubblicherà l'evento jotform.formCreated a cui puoi iscriverti.

Esempio

JotFormAnywhere.createInstantForm({
email: "me@example.com",
templateName: "contact-us"
})

Parametri

Opzioni

JotformAnywhere.editForm

Puoi aprire la schermata di modifica dei moduli inseriti con questo metodo in modo che gli utenti non debbano modificare i loro moduli tramite il pulsante "Modifica modulo".

Esempio

JotFormAnywhere.editForm(
"31343042093342"
)

Parametri

Questo metodo accetta solo un parametro richiesto come form-id

JotFormAnywhere.deleteForm

Puoi eliminare i moduli inseriti con questo metodo in modo che gli utenti non debbano eliminare i loro moduli tramite il pulsante "Elimina modulo".

Esempio

JotFormAnywhere.deleteForm(
"31343042093342"
)

Parametri

Questo metodo accetta solo un parametro richiesto come form-id

JotFormAnywhere.subscribe

Il metodo JotformAnywhere.subscribe collega il gestore a un evento definito dalla libreria JS e richiama il callback quando l'evento viene attivato.

Esempio

Probabilmente vorrai essere avvisato con i dati correlati quando il modulo viene creato correttamente su Jotform.

JotFormAnywhere.subscribe("jotform.formCreated", 
function(response){
console.log("Form is created with properties:", response)
}
)

O quando il modulo è stato aggiornato

JotFormAnywhere.subscribe("jotform.formUpdated", 
function(response){
console.log("Form is updated with properties:", response)
}
)

Eventi

Eventi globali a cui puoi iscriverti:

• jotform.formCreated - attivato quando il modulo viene creato su Jotform
• jotform.formUpdated - attivato quando il modulo viene modificato e salvato su Jotform
• jotform.formDeleted: attivato quando il modulo viene eliminato
• jotform.formLoaded - attivato quando iframe del modulo è completamente caricato

L'oggetto risposta passato alla funzione di callback per gli eventi formCreated e formUpdated è simile al seguente:

{
formEmbedUrl:"https://form.jotformpro.com/jsform/30654794751967">", 
height:465, 
width:320, 
formID:"30654794751967", 
}

L'oggetto risposta passato alla funzione di callback per l'evento formDeleted e formLoaded è simile al seguente:

{
formID:"30654794751967", 
}

JotFormAnywhere.customize

Con il metodo JotformAnywhere.customize puoi personalizzare i colori predefiniti dell'iframe Jotform

Esempio

JotFormAnywhere.customize({
formBuilderBarColor: "#FFFFFF",
primaryButtonColor: "#FF00FF",
primaryButtonHoverColor: "blue"
})

Parametri

Opzioni