marketoFormExtension.json

{
  "plugin_type": "widget",
  "name": "Marketo Form",
  "edit_page_url": "optimizely.com",
  "form_schema": [
    {
      "name": "selector",
      "field_type": "selector",
      "options": null,
      "label": "Selector",
      "default_value": ".pt-5"
    },
    {
      "name": "formId",
      "field_type": "text",
      "options": null,
      "label": "Form ID",
      "default_value": "1076"
    }
  ],
  "description": "",
  "options": {
    "html": "",
    "css": "",
    "apply_js": "var utils = window.optimizely.get('utils');\n\nvar appDomain = \"subdirectory.exampledomain.com\"; // Replace with your Marketo app domain\n\nvar munchkinId = \"XXX-XXX-XXX\"; // Replace with your Marketo Munchkin ID\n\nutils.waitForElement(extension.selector).then(function(){  \nvar marketoJS = document.createElement('script');\nvar marketoScript = '//'+appDomain+'/js/forms2/js/forms2.min.js';\nmarketoJS.setAttribute('src', marketoScript);\ndocument.querySelector(extension.selector).insertAdjacentElement('afterend',marketoJS);\n\nvar marketoForm = document.createElement('form');\nvar formId = 'mktoForm_' + extension.formId;\nmarketoForm.setAttribute('id',formId);\ndocument.querySelector(extension.selector).nextSibling.insertAdjacentElement('afterend',marketoForm);\n});\nutils.waitUntil(function(){\n\treturn !!window.MktoForms2;\n}).then(function() {\n  window.MktoForms2.loadForm('//'+appDomain, munchkinId, parseInt(extension.formId), function(form) { \n  \t// Any custom JS\n  }); \n});",
    "undo_js": "/*\n * Editor now supports ES6 compliant code. Note that adding ES6\n * specific code to an experiment will break for users running\n * ES5-only browsers as code entered is not transpiled down to ES5.\n */\n \n  const extensionElement = document.getElementById('optimizely-extension-' + extension.$instance);\n  if (extensionElement) {\n    extensionElement.parentElement.removeChild(extensionElement);\n  }\n"
  }
}