Posso innescare un modulo pop-over con un pulsante o link?

Il wizard di creazione delle liste di GetResponse può aiutarti a creare un modulo standard che compare sulla tua pagina non appena il visitatore vi accede. Personalizzando il codice puoi anche innescarlo con un clic del link o di un pulsante sul sito web.

Come creare un modulo pop-over

Apri il modulo esistente o creane uno nuovo. Nel wizard clicca sul template e su Layout a destra. Nelle proprietà di visualizzazione seleziona Pop-over, modifica il modulo e clicca su Salva e pubblica.

Come configurare lo script del modulo

Per innescare il modulo facendo clic sul link in un particolare elemento sul sito web devi usare API JS. Dovrai inserire la configurazione del codice in formato JSON all’interno del tag “ copiato dal passaggio Salva e pubblica del wizard.

Di seguito trovi degli esempi di snippet di codice per configurare il modulo adeguatamente tramite API JS.

Configurazione

{

  "name": "myuniqueformname",

  "selector": {

    "clickToShow": "#id_click_to_show_element",

    "clickToHide": "#id_click_to_hide_element"

  }

}

Descrizione

“name” – REQUIRED – String – unique identifier

“selector” – OPTIONAL – Object

-> “clickToShow” – OPTIONAL – String – DOM element selector (elemento html sul tuo sito web, cliccandoci compare il modulo)

-> “clickToHide” – OPTIONAL – String – DOM element selector (elemento html sul tuo sito web, cliccandoci il modulo si chiude)

Esempio
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<a href="#" id="id_click_to_show_element">Show it</a>
<script type="text/javascript" src="https://app.getresponse.com/view_webform_v2.js?u=Xun&webforms_id=1023903">
{
"name": "myuniqueform1",
"selector": {
"clickToShow": "#id_click_to_show_element"
}
}
</script>
</body>
</html>

*Nota**:

  1. il JSON all’interno dei tag “ deve essere corretto, clicca sul link http://jsonlint.com/ per convalidare lo script.
  2. La configurazione non può essere usata per i moduli Inline

Puoi inoltre usare la nostra API direttamente nel codice JavaScript (facendo riferimento a GRWF2 Object):

var myform = GRWF2.get("myuniqueformname") - get refference to "myuniqueformname" instance of Form object
myform.show() - show form
myform.hide() - hide form
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<button id="button" >Show it</button>
<script type="text/javascript" src="https://app.getresponse.com/view_webform_v2.js?u=Xun&webforms_id=1023903">{
"name": "myuniqueform2"
}
</script>
<script>
var myform = GRWF2.get('myuniqueform2'),
element = document.getElementById('button');
element.addEventListener("click", function(){
myform.show();
});
</script>
</body>
</html>

Anche se abbiamo a cuore il tuo successo, purtroppo non possiamo fornirti assistenza su come modificare il codice HTML del tuo modulo e della tua pagina. Se non ti senti in grado di modificarlo da te, contatta uno sviluppatore web.