Czy mogę zaprogramować swój legacy formularz pop over tak, by pojawiał się na stronie po kliknięciu w link lub przycisk?

Poniższy artykuł dotyczy formularzy legacy.

Formularze legacy nie są już rozwijane i nie są dostępne na kontach utworzonych po 18 lipca 2023.

Kreator formularzy GetResponse pomoże Ci w stworzeniu formularza, który pokaże się odwiedzającym w momencie otwarcia strony. Dzięki niewielkiej zmianie kodu możesz go również zaprogramować tak, by pojawiał się przy kliknięciu w dany link lub przycisk na stronie.

Tworzenie formularza pop-over
Otwórz istniejący plik lub stwórz nowy. Kliknij w dowolny szablon, a następnie w „layout” po prawej. W „widoku” wybierz pop over, dostosuj go do swoich potrzeb, a następnie zaznacz “zapisz i opublikuj”.

Konfiguracja skryptu formularza
Jeśli chcesz, by formularz pojawiał się przy kliknięciu w wybrany link na stronie, skorzystaj z API JS. Umieść konfigurację kodu w formacie JSON wewnątrz taga [], skopiowanego w kroku „zapisz i opublikuj” w kreatorze formularzy.

Poniżej znajdują się przykładowe fragmenty kodu, ilustrujące jak poprawnie skonfigurować formularz przez API JS.

Konfiguracja
{
„name”: „myuniqueformname”,
„selector”: {
„clickToShow”: „#id_click_to_show_element”,
„clickToHide”: „#id_click_to_hide_element”
}
}

Opis
„name” – REQUIRED – String – unique identifier
„selector” – OPTIONAL – Object
-> „clickToShow” – OPTIONAL – String – DOM element selector (html element on your website, when clicked shows form)
-> „clickToHide” – OPTIONAL – String – DOM element selector (html element on your website, when clicked close form)

Przykład

<!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>

Ważne:

  1. JSON wewnątrz tagów „ musi być poprawny, kliknij w http://jsonlint.com by sprawdzić swój skrypt.
  2. Powyższej konfiguracji nie można stosować w formularzach inline.

Możesz również użyć klucza API bezpośrednio w kodzie Javascript (odnosząc się do obiektu GRWF2)**
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" >Mostrarlo</button>
            <script type="text/javascript" src="https://app.getresponse.com/view_webform_v2.js?u=Xun&amp;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>

Twoja satysfakcja jest dla nas najważniejsza, nie jesteśmy jednak w stanie zapewnić wsparcia dla edycji HTML Twojej strony. Jeśli masz wątpliwości, jak ją skonfigurować, skontaktuj się ze swoim programistą.

Uwaga: Formularz nie wyświetli się ponownie dla użytkowników, którzy już go wypełnili, nawet jeśli klikną ponownie w przycisk.

Powiązane artykuły

Popularne materiały