Siuntimo rinkodaros formų išplėtimas naudojant kodą

Straipsnis
09/13/2023

Pastaba.

2023 m. rugsėjo 1 d. „Dynamics 365 Marketing“ ir „Dynamics 365 Customer Insights“ bus parduodami kartu kaip vieno produkto SKU pavadinimu „Dynamics 365 Customer Insights“. Atskiros programos bus atitinkamai pervardytos į „Dynamics 365 Customer Insights – veiklos ciklai“ ir „Dynamics 365 Customer Insights – duomenys“. Išsamesnės informacijos žr. DUK apie „Dynamics 365 Customer Insights“

Be to, 2023 m. rugsėjo 1 d. nauji „Dynamics 365 Marketing“ klientai gaus tik rinkodaros realiuoju laiku funkcijas. Norėdami gauti daugiau informacijos, žr. Numatytosios rinkodaros realiuoju laiku diegimas. Daugelis instrukcijų puslapių šiuo metu nurodo į siunčiamas funkcijas, kurios gali būti neprieinamos arba veikti kitaip nei rinkodara realiuoju laiku. Instrukcijų turinys bus atnaujintas rugsėjo mėnesį, siekiant pažymėti, ar jis taikomas realiojo laiko, ar tradicinei rinkodarai.

Svarbu

Šis straipsnis taikomas tik siunčiamai rinkodarai.

Rinkodaros forma apibrėžia įvesties laukus, sudarančius formos maketą. Jūs tikriausiai sukursite nedidelę daugkartinių formų, kurias galėsite naudoti visuose savo rinkodaros puslapiuose, biblioteką. Norėdami įtraukti rinkodaros formą į konkretų rinkodaros puslapis, formai išdėstyti naudokite formos elementą ir pasirinkite vietinius jos parametrus, kurie taikomi tik tam puslapiui. Daugiau informacijos Siuntimo rinkodaros formos

Siunčiamos rinkodaros formas galima išplėsti naudojant "JavaScript", kad būtų galima atlikti pasirinktinius verslo veiksmus Dynamics 365 Customer Insights kelionėse. Toliau pateikiami metodai, kuriais galima išplėsti siunčiamos rinkodaros formas.

JavaScript API

Naudojame naujausią "JavaScript" API versiją. Įsitikinkite, kad jūsų nuorodos form-loader.js arba scenarijus atrodo kaip loader.js arba https://mktdplp102cdn.azureedge.net/public/latest/js/form-loader.js?v=[version tag]https://mktdplp102cdn.azureedge.net/public/latest/js/loader.js?v=[version tag] atitinkamai. Skyrių ?v=[version tag] galima praleisti. Senesni scenarijai (scenarijai, kurie atrodo kaip https://mktdplp102cdn.azureedge.net/public/static/[version tag]/js/form-loader.js arba https://mktdplp102cdn.azureedge.net/public/static/[version tag]/js/loader.js) yra pasenę ir nebepalaikomi.

Įdėkite pasirinktinį kodą iškart po form-loader.js scenarijaus.

Kodo pavyzdys:

<script src="https://mktdplp102cdn.azureedge.net/public/latest/js/form-loader.js?v=..."></script>
<script>
// correct - the script will attach event handlers right after form loader script
MsCrmMkt.MsCrmFormLoader.on("afterFormLoad", function() {});

// wrong - the script will attach event handlers after window has finished loading, form already might have been loaded in the meantime and no events will trigger anymore
// window.onload = function() { MsCrmMkt.MsCrmFormLoader.on("afterFormLoad", function() {}); };
</script>

MsCrmMkt.MsCrmFormLoader metodai

Funkcijos pavadinimas	Aprašą	Parametro pavadinimas	Parametro tipas	Parametro aprašymas	Grąžinimai
`.on(eventType,callback)`	Registruoja atgalinį iškvietimą į formos palaikymo trukmės įvykio tipą	`eventType`	`string`, vienas iš `"afterFormLoad"`,,,,, `"afterFormRender""afterFormSubmit""formLoad""formRender""formSubmit"`	Įvykio tipas, prie kurio reikia kabintis	`undefined`
`callback`	Atgalinio iškvietimo funkcija		`Function`
`.off(eventType)`	Išregistruoti duotos formos ciklo įvykio atgalinius skambučius	`eventType` Pasirinktinai	`string`, vienas iš `"afterFormLoad"`,,,,, `"afterFormRender""afterFormSubmit""formLoad""formRender""formSubmit"`	Įvykio tipas, prie kurio reikia kabintis	`undefined`
`.sendFormCaptureToCrm(form)`	Formos pateikimo siuntimas į Dynamics 365 Customer Insights - Kelionės, palaikomos tik formų fiksavimo scenarijuje	`form`	DOM elementas, vaizduojantis formą, arba JQuery išrinkiklis, vaizduojantis formą	Formos DOM elementas	`Promise<string>`

Formuoti įvykius

Įvykio pavadinimas	Suaktyvinta užfiksuotoms formoms	Sintaksė	Aprašą
`formLoad`	Taip	`MsCrmMkt.MsCrmFormLoader` `.on("formLoad", function(event) {})`	Paleidikliai, kai formos vietos rezervavimo ženklas atpažįstamas prieš gaunant faktinį formos turinį, užfiksuotų formų paleidikliai, kai forma atpažįstama
`formRender`	No	`MsCrmMkt.MsCrmFormLoader` `.on("formRender", function(event) {})`	Paleidikliai po to, kai formos turinys yra iškviečiamas ir prieš įterpiant formos turinį į puslapį.
`afterFormRender`	No	`MsCrmMkt.MsCrmFormLoader` `.on("afterFormRender", function(event) {})`	Paleidikliai po formos turinio įterpimo į puslapį prieš pridedant tikrinimo kabliukus.
`afterFormLoad`	No	`MsCrmMkt.MsCrmFormLoader` `.on("afterFormLoad", function(event) {})`	Paleidikliai po to, kai formos turinys įterpiamas į puslapį ir kai pridedami tikrinimo kabliukai.
`formSubmit`	No	`MsCrmMkt.MsCrmFormLoader` `.on("formSubmit", function(event) {})`	Formos pateikimo paleidikliai prieš išsiunčiant formos pateikimą į serverį.
`afterFormSubmit`	Taip	`MsCrmMkt.MsCrmFormLoader` `.on("afterFormSubmit", function(event) {})`	Formos pateikimo paleidikliai po to, kai formos pateikimas išsiunčiamas į serverį. Jis įsijungia tik tada, kai pateikimas yra sėkmingas. Jis suaktyvinamas prieš peradresavimą arba rodant patvirtinimo pranešimą.

Kiekvienam įvykiui galima perskambinti šiais būdais:

Metodo pavadinimas	Aprašą	Pateikimo tipas
`.getType()`	Gauna įvykio tipą	`string`, vienas iš `"afterFormLoad"`,,,,, `"afterFormRender""afterFormSubmit""formLoad""formRender""formSubmit"`
`.getFormPageId()`	Gauna formos puslapio ID – tai susiję su `msdyncrm_formpage` unikaliu objekto identifikatoriumi	`string`
`.getFormPlaceholder()`	Gauna formą atitinkantį DOM elementą	DOM elementas
`.preventDefault()`	Atšaukia formos pateikimą, galiojantį tik tipo įvykiui `formSubmit`	`undefined`
`.preventFormLoadingProgressBar()`	Paslepia suktuką, kol įkeliama forma, galioja tik įvykio `formLoad` tipui	`undefined`
`.setFormNotification(function (n) {})`	Nepaiso atgalinio skambinimo, kad būtų galima generuoti formos pranešimą (pvz., formos pateikimo pranešimą). Be funkcionuojančios įstaigos pranešimai nebus teikiami. Galioja tik tokio tipo `formLoad` įvykiui.	`undefined`

Formos fiksavimo veikimo būdo tinkinimas

Formos fiksavimą nukreipia konfigūracijos elementas, kuris atrodo kaip <div class="d365-mkt-config" style="display:none" data-website-id="..." data-hostname="...">. Galite keisti formos fiksavimo veikimą įtraukdami šiuos atributus:

Atributo pavadinimas	Aprašą
`data-ignore-prevent-default="true"`	Kai bus nurodyta, forma bus pateikta neatsižvelgiant į tai, kas `.preventDefault()` buvo panaudota renginyje.
`data-no-submit="true"`	Kai nurodyta, formos fiksavimo scenarijus neužfiksuos formos pateikimo įvykio, turėtumėte jį aiškiai suaktyvinti `MsCrmMkt.MsCrmFormLoader.sendFormCaptureToCrm(form)` . Tai naudinga tais atvejais, kai pirmiausia norite pateikti formą, o vėliau sinchronizuoti su Dynamics 365 Customer Insights kelionėmis.

Pastaba.

"Javascript" API galima tik formoms, priglobtoms kaip scenarijus, ji nepalaikoma "iframe" prieglobos parinktyje.

Įtraukite kodo fragmentas naudodami portalus

Norėdami pridėti "JavaScript" kodą, turite atlikti toliau nurodytus veiksmus.

Eikite į programą "Customer Insights – Journeys" ir eikite į "Marketing" puslapius.
Pasirinkite Naujas , kad sukurtumėte naują rinkodaros puslapis.
Nuvilkite elementą Forma iš skirtuko Įrankių rinkinys į skirtuką Dizaino įrankis ir pasirinkite norimą naudoti rinkodaros formą.
Perjunkite į HTML skirtuką ir savo kodo fragmentas.
Pasirinkite Įrašyti , kad išsaugotumėte pakeitimus, tada pasirinkite Paleisti.

Pridėkite savo kodo fragmentas, kai naudojate savo TVS ir formų prieglobą

Norėdami pridėti kodo fragmentas, turite atlikti toliau nurodytus veiksmus.

Eikite į programą "Customer Insights – Journeys" ir eikite į "Marketing" formassiuntimo rinkodaros srityje
Pasirinkite Naujas , kad sukurtumėte naują rinkodaros formą.
Pasirinkite Paleisti.
Pasirinkite skirtuką Formų išteklių nuoma ir dalyje Galimi formų išteklių nuomos domenai pasirinkite domeną, jei jis yra, arba pasirinkite + Kurti naują domeną.
Pridėkite savo TVS domeną ir pasirinkite Išsaugoti.
Skirtuko Iš prieglobos skirtuke Susiję rinkodaros formos puslapiai pasirinkite ... ir + Naujas formos puslapis , kad pridėtumėte rinkodaros formos puslapį.
Pasirinkite Įrašyti.
Dabar pasirinkite sukurtą formos puslapį ir nukopijuokite scenarijų į mainų sritį.
Dabar savo TVS redaguokite puslapį, į kurį norite įtraukti formą, pridėkite tinkinimus ir scenarijų.

Pavyzdžiai

Pavyzdžio tikrinimas - patikrina, ar teksto laukelis yra "Fabricam", ar Contoso, kitaip neleidžia pateikti formos.

MsCrmMkt.MsCrmFormLoader.on('formSubmit', function(event) {
  // sample validation - check if 
  document.getElementById('txt-company-name-message').style.visibility = 'hidden';
  var companyName = document.getElementById('txt-company-name').value;
  if (companyName !== 'Fabricam' && companyName != 'Contoso') 
  {
    document.getElementById('txt-company-name-message').style.visibility = 'visible';
    event.preventDefault();
  }
});

Gaunamos užklausos eilutės parametrų užpildymas paslėptuose laukuose.

MsCrmMkt.MsCrmFormLoader.on('afterFormLoad', function(event) {
  var self = window.location.toString();
  var queryString = self.split("?");
  var hiddenFields = document.querySelectorAll("input[type=hidden]");
  if (queryString.length > 1) 
  {
    var pairs = queryString[1].split("&");
    for (var pairIndex in pairs) 
    {
      var pair = pairs[pairIndex].split("=");
      if (pair.length !== 2) 
      {
        continue;
      }
      var key = pair[0];
      var value = pair[1];
      if (key && value) 
      {
        for (var i = 0; i < hiddenFields.length; i++) 
        {
          if (hiddenFields[i].id === key) 
          {
            hiddenFields[i].value = value;
          }
        }
      }
    }
  }
});

Lokalizuoti formą (išrinkimo sąrašą) – galite naudoti kliento pusės išplečiamumą, kad lokalizuotumėte siuntimo rinkodaros formas. Lokalizacija turi įvykti įkėlus formą (afterFormLoad įvykis). Viduje rinkodaros puslapis (arba TVS, kurioje priglobiate formą) pridėkite šį lokalizavimo scenarijų:

<script>
function translatePicklists(lcid) 
{
    var picklists = document.querySelectorAll("select");
    for(var i = 0; i < picklists.length; i++) 
    {
        var picklist = picklists[i];
        var relatedDatalist = document.getElementById("localize-" + picklist.name + "-" + lcid.toString());
        if (relatedDatalist) 
        {
            for(var j = 0; j < picklist.options.length; j++) 
            {
                if (j >= relatedDatalist.options.length) 
                {
                    break;
                }
                picklist.options[j].text = relatedDatalist.options[j].text;
            }
        }
    }
}
MsCrmMkt.MsCrmFormLoader.on("afterFormLoad", function(event) { translatePicklists(1029); });
</script>

Rinkodaros formoje įsitikinkite, kad paruošėte vertimus. Redaguokite rinkodaros formą HTML dizaino įrankyje, formatuokite ją (dešiniuoju pelės mygtuku spustelėkite dizaino įrankį, tada pasirinkite formatą) ir pridėkite reikiamus vertimus.

<div data-editorblocktype="Field-dropdown">
    <div class="marketing-field">
        <div class="lp-form-field" data-required-field="false">
            <label for="f7ae1a98-0d83-4592-afe0-272c85ce607d" class="lp-ellipsis" title="">Marital status</label>
            <select id="f7ae1a98-0d83-4592-afe0-272c85ce607d" name="f7ae1a98-0d83-4592-afe0-272c85ce607d" class="lp-form-fieldInput" title="" style="width: 100%; box-sizing: border-box;">
              <option value=""></option>
              <option value="1">Single</option>
              <option value="2">Married</option>
              <option value="3">Divorced</option>
              <option value="4">Widowed</option>
            </select>
        </div>
    </div>
</div>
<!-- format is localize-fieldid-lcid -->
<datalist id="localize-f7ae1a98-0d83-4592-afe0-272c85ce607d-1029">
    <option></option>
    <option>Svobodny(a)</option>
    <option>Zenaty(a)</option>
    <option>Rozvedeny(a)</option>
    <option>Vdovec(vdova)</option>
</datalist>

Bendrinti naudojant