Скрипт для значений pu sh UTM из URL в скрытые поля (Webflow) - PullRequest
Новая
       19

Скрипт для значений pu sh UTM из URL в скрытые поля (Webflow)

1 голос
/ 05 мая 2020

Я только что выпустил наш новый веб-сайт в Webflow, но нет простого способа собрать значения UTM из URL-адреса и отправить их sh в поля формы. Я создал 5 скрытых полей UTM (UTM Medium, UTM Source, UTM Campaign, UTM Content, UTM Term). Теперь мне нужно добавить код HTML на страницу, чтобы sh значения из URL-адреса.

Мне дали этот скрипт: 

<script>
const urlParams = new URLSearchParams(window.location.search);
const utmParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content'];

let utmFieldValue = '';

utmParams.forEach(function (param) {
    const paramValue = urlParams.get(param);
    if (paramValue) {
        utmFieldValue += `${param}=${paramValue} `
    }
});

const utmField = document.getElementById('utm-field');
utmField.value = utmFieldValue.trim();

Однако похоже, что все значения помещены в одно поле. Может ли кто-нибудь переписать этот сценарий, чтобы отразить, что каждое значение должно быть добавлено в правильное поле?

Это пример URL-адреса с UTM: google.com/?utm_source=crowdcast&utm_medium=webinar&utm_campaign=blog&utm_content=how-we -use-linkedin-ads

URL-адрес формы: https://saasmql.com/contact-us

Это код формы: 

<div id="w-node-07aa8d855a85-8d855a85" class="form-wrap"><h2 class="h2 center white">Book an Intro Call</h2><div><div class="w-form">

1 Ответ

1 голос
/ 05 мая 2020

Это должно работать 

const urlParams = new URLSearchParams(window.location.search);
const utmParams = [
  'utm_source',
  'utm_medium',
  'utm_campaign',
  'utm_term',
  'utm_content'
];

let paramValue, utmField;

utmParams.forEach(function (param) {
  paramValue = urlParams.get(param);
  utmField = document.querySelector("input[name='"+param+"']");

  if (paramValue && utmField) {
    utmField.value = paramValue.trim();
  }
});

Убедитесь, что все ваши поля строго следуют этому названию:
utm_source
utm_medium
utm_campaign
utm_term
utm_content

...