dynamic form button based on segment | Community
Skip to main content
M
MoritzTr
Level 3
November 25, 2022
Solved

dynamic form button based on segment

  • November 25, 2022
  • 4 replies
  • 3635 views

Whats the best way to dynamically change the text on Marketo webform button based on a customer segment ?

Use case: 
We are looking to place 1 Marketo form on a single Marketo LP and expose an audience from various countries to those pages (existing records only). 

The content on the LP will change dynamically based on a language segment. 

How do I setup the same on the webform button (labels are not used) ?

 

The form and LPs are currently stored in Design studio which is why I dont believe a dynamic token will work (unless we move everything under a program in marketing activities). 

 

 

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by SanfordWhiteman

Use Dynamic Content to segment this script:

window.mktoFormTranslations = { ButtonText: "Go", ButtonSubmissionText: "Going..." };

 

This can be a separate static script, to not repeat yourself:

MktoForms2.whenReady(function(mktoForm){ let formEl = mktoForm.getFormElem()[0]; let submitButton = formEl.querySelector("button.mktoButton"); let currentTranslations = window.mktoFormTranslations; submitButton.innerHTML = currentTranslations.ButtonText; mktoForm.onSubmit(function(mktoForm){ submitButton.innerHTML = currentTranslations.ButtonSubmissionText; }); })

 

4 replies

Darshil_Shah1
Community Advisor and Adobe Champion
Darshil_Shah1Community Advisor and Adobe Champion
Community Advisor and Adobe Champion
November 25, 2022

One way is to use web segments for personalizing the button text! Unfortunately, Marketo web segments don't support referencing lead segmentation data, but you add similar filter logic using the same lead fields in Marketo web segments as your lead segmentation (or if your lead segmentation has complex logic, you can have a custom field that'd store the segment of a person and reference that field in your web segmentation). For known people, you can reference their web segment membership data, and personalize LP elements (including form button text) based on that. Of course, you'd need to have the Web personalization (RTP) module for this approach.

 

Alternatively, you can also create dynamic content based on the lead segmentation data on your LP and place JS on each version that would update the button text using Forms 2.0 API - just the way you'd add dynamic content for all the required modules for each segment on an LP. This method would be simple, ideal, and much quicker to implement if you want to do personalization for a one-off page, but I think the first method is more scalable as you don't need to create dynamic content at the individual LP level.

 

Disha_Goyal6
Community Advisor
Disha_Goyal6Community Advisor
Community Advisor
November 25, 2022

Hi @moritztr, I can you can do the same by using langauage translation jquery as MArketo does not provide dynamic segmentations for forms.

 

Thanks,

Disha

Darshil_Shah1
Community Advisor and Adobe Champion
Darshil_Shah1Community Advisor and Adobe Champion
Community Advisor and Adobe Champion
November 25, 2022

AFAIK, you cannot query lead segmentation data via API for you to be able to update form button text based on the segment membership of a person on the fly. You can use geolocation data to update the form button text, but that may not be the same as a person's segment membership in Marketo.

 

SanfordWhiteman
SanfordWhiteman
Level 10
November 25, 2022

Segment a mktoText area that holds JS to change the button text. This is extremely simple and uses native Dynamic Content™.

    M
    MoritzTrAuthor
    Level 3
    November 28, 2022

    Thx Sanford, 

     

    do you have a sample that I can look at ?

     

    SanfordWhiteman
    SanfordWhitemanAccepted solution
    Level 10
    November 28, 2022

    Use Dynamic Content to segment this script:

    window.mktoFormTranslations = { ButtonText: "Go", ButtonSubmissionText: "Going..." };

     

    This can be a separate static script, to not repeat yourself:

    MktoForms2.whenReady(function(mktoForm){ let formEl = mktoForm.getFormElem()[0]; let submitButton = formEl.querySelector("button.mktoButton"); let currentTranslations = window.mktoFormTranslations; submitButton.innerHTML = currentTranslations.ButtonText; mktoForm.onSubmit(function(mktoForm){ submitButton.innerHTML = currentTranslations.ButtonSubmissionText; }); })

     

    Michael_Florin-2
    Michael_Florin-2
    Level 10
    November 28, 2022

    Doesn't just exchanging the submit button on a form fall short? You mentioned you didn't need field labels (why btw? Don't they need to be translated too?), but what about error messages?

     

    Although I like the idea of using just one form and making it as dynamic as the language page they appear on, I found it easier to exchange forms based on segmentation. Which would mean: One LP, but as many forms as there are segments.

    Terms & ConditionsAccessibility statement

    Loading footer...