Как сделать, чтобы форма всплывала при клике на кнопку?

Мастер форм от GetResponse может помочь Вам в создании стандартной формы, которая появляется на Вашей странице, когда посетитель заходит на нее. При дополнительной настройке кода, Вы также можете настроить форму так, чтобы она появлялась при нажатии на ссылку или кнопку на Вашем сайте.

Всплывание формы при клике на кнопку

Откройте существующую форму или создайте новую. В Мастере форм нажмите на тело формы, а затем перейдите в меню справа. В свойствах отображения выберите Pop over, отредактируйте форму и нажмите Сохранить и опубликовать.

Редактирование скрипта

Для того чтобы форма всплывала при клике на какой-либо их элементов Вашего сайта, Вам необходимо использовать API JS. Вам необходимо разместить настройки в JSON формате внутри скрипта, скопированого из GetResponse (после сохранения и публикации).

Ниже В можете найти сниппеты, которые смогут помочь Вам в конфигурации данного кода API JS.

Настройка

{
  "name": "myuniqueformname",
  "selector": {
    "clickToShow": "#id_click_to_show_element",
    "clickToHide": "#id_click_to_hide_element"
  }
}

Описание

«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)

Пример

            <a href="#" id="id_click_to_show_element">Show it</a>

                {
                    "name": "myuniqueform1",
                    "selector": {
                        "clickToShow": "#id_click_to_show_element"
                    }
                }

Примечание:

  1. JSON внутри тегов « должны быть корректны, нажмите http://jsonlint.com/ чтобы проверить скрипт.
  2. Конфигурация не может быть использована для форм inline.

Вы также можете использовать API напрямую в JavaScript Code (отсылая к GRWF2 Object):

var myform = GRWF2.get("myuniqueformname") - get refference to "myuniqueformname" instance of Form object    

myform.show() - show form    

myform.hide() - hide form 







            <button id="button">Exibir</button>

                {
                    "name": "myuniqueform2"
                }

             var myform = GRWF2.get('myuniqueform2'),
                element = document.getElementById('button');
                element.addEventListener("click", function(){
                    myform.show();
                });

Ваш успех является нашим наивысшим приоритетом, но мы, к сожалению, не предоставляем поддержки при редактирования HTML-кода Вашей формы и страницы. Если у Вас возникли трудности, обратитесь к своему веб-разработчику.