How to tie entered data from a form to a user?

[big_smile]

Your problem
I have a series of books. The user can visit a landing page for each book and then sign up for my newsletter. On the landing page, there is an option for the user to enter which book they have purchased. By knowing this info, I can divide my contacts into segments and send out specific newsletters to particular segments of user.

I have created a “Standalone Form” in Mautic and put in a field for the user to enter the purchased book.

However, how do I set it up so the data in this field is tied to their contact profile?

Also, a user could sign up multiple times (for different books), so I would want new data in the purchased book field to append the existing data rather than replacing it.

Your software
My Mautic version is: 2.16.0
My PHP version is: 7.2

[big_smile]

Update:
A contact already has a ‘tag’ field, which allows multiple bits of data to be attached to it. So I tried adding the “Contact: Tag” field to the form, but that doesn’t seem to be possible.

I instead created a new field in the Contact section called “Book Purchased”. I then linked this new field to my form. This now works: When the user enters the book title on my form, it appears in the field. However, if they sign up for a second book, it overwrites the first book in the field. How can I fix this?

Also, when using this method, it doesn’t seem possible to filter users by book title. I tried creating a segment that filters the “Book Purchased” field. But then it always says “no contacts”.

[renzof]

Hi

You should be able to use tags for this, in you form you can add an action for modify the contacts tag. Maybe am have a form pero book or category?

[big_smile]

This is what I have done:

Thank you so much for your help. This is what I have done:

1. I created a Campaign Form. In that form, I created a new field called “Books Purchased”. I linked that new field to a similarly named field that is on the “Contact screen”:

2. I then created a new Campaign. In New Campaign Builder, I created a condition of “Form Field Value”:

3. In the “Form Field Value” condition, I use the equals operator. But, under Value, there is no way to link this to what the user has entered.

It seems like I would have to enter each book title here manually and create a separate condition for each. Because I have many book titles, I would prefer not to enter any titles. I want all the info to come from the form the user has submitted*

4. I have also tried creating a “Modify Contact Tag’s condition”. However, again, there is no way to link this to what the user has submitted:

It again looks like I would have to manually enter the book title on this screen.

*An explanation of how my user process works:

1. I have hundreds of books. Each book has a landing page which a unique URL. The landing page is a custom one I have made (It is not a landing page in Mautic). However, I have used the “Manual Copy” function of Mautic to embed the Mautic form code into my landing page.

2. When the user enters the URL to go to the landing page, a javascript on the page automatically enters the name of the book from the URL into the relevant form. So the user doesn’t have to enter any titles. And I also don’t have to spend time entering titles into Mautic. The title will go into Mautic when the user submits the form.

[renzof]

Good explanation and screenshots help though still I am not sure I follow.

You collect the information with forms about what book the customer bought (and this works ok right?)

Then with this you want send a different email based on what book they purchased?

I am not sure if you are using the campaigns correctly, the campaign filter will match the contact field to match anything you add (that’s why you don’t what the user selected on the filter, because is the campaign context not the user)

Again I might be understanding this wrong, It might help if you give us an idea of what your target is

[alban]

It’s a good use case for tags. Here’s my idea for the implementation.

1. You make a form, where one of the fields gives the name of the book they purchased/viewed/bookmarked/whatever. At this point, you are free for how to do it, the user fills the data, or it could even be a JS script that prefills a field and sends a form, etc…
2. You make a campaign that is triggered whenever this specific form is submitted. So it’s a campaign with your form as the campaign’s source. The role of this campaign is only to assign tags. Let’s not use it for more than that.
3. In the campaign you build a decision tree with on top a condition that compares the value for the field of the form that includes the name of the book. In the action path, you have an action that assigns the appropriate tag.
4. You make one tag for each book. 4 books = 4 tags = 4 branches in your campaign decision tree
5. Now, you want users to be able to come back and be processed again in the campaign next time they buy a second book. So, after you assign the tag, you remove them from the campaign. 4 books = 4 branches = 4 contacts remove action.
6. Don’t forget to set the campaign in way that user can start over it again (it will work only when they have been removed from it first)
7. You create segments of contacts with one or more particular tags, and use them as source for any campaigns where you want to act on the information.

Note: Depending on your cron settings and frequency at which the user buy 2 books, you can face some issues. But it should work just fine in most cases.

Good luck

[big_smile]

You collect the information with forms about what book the customer bought (and this works ok right?)

Yup, and it works fine. The book title transfers from my landing page to Mautic.

Then with this you want send a different email based on what book they purchased?
It’s so I can segment the addresses based on the book they purchased. (The email doesn’t get sent out straight away when they sign up. However, let’s say a reader purchases a recipe book. A couple of months later, If I launch a new recipe book, then I would want to be able to target an email about this book exclusively to readers who signed up via a recipe book).

[big_smile]

1. You make one tag for each book. 4 books = 4 tags = 4 branches in your campaign decision tree
2. Now, you want users to be able to come back and be processed again in the campaign next time they buy a second book. So, after you assign the tag, you remove them from the campaign. 4 books = 4 branches = 4 contacts remove action.

Is there anyway to automate this. E.g. Have Mautic automatically apply a tag based on the value of the “Book Purchased field”?
I have hundreds of books with more being added, so I don’t want to enter all the tags into Mautic.

[alban]

Unfortunately, I don’t see any easy way to do this. If you go that way, I think you will need to manually define the many branches of your campaign. Only once though. Every branch will “encode” a rule such as "when the form submitted field value equals to “bookABC”, then assign the tag “purchasedBookABC”, and so on.

You could create programmatically your hundreds of tags by API, but note that you will have to assign these tags in the campaign manually. Besides, in the UI of the campaign action that is dedicated to assign a tag to a contact, you can create a tag on the fly, so it won’t make a sensible difference to create all your tags beforehand with the API.

[renzof]

@big_smile

The email doesn’t get sent out straight away when they sign up.

Ok if would leave the value to use it later, rather than creating a segment for each book (which since you have many it would be a nightmare without automation)
When the time comes and you release that recipe book you can create the campaign for all contacts that submitted your form and just send email to those the purchase matches the ones that submitted using the recipe book form.

As per adding a tag for each book you can modify the javascript that you are using to prefill the book and submit it to mautic use the tracking api it would look something like this mt('send', 'pageview', {'tags':'bookname'}); this will solve your problem of people having purchased multiple books.

More info about the tracking api here

Contact tracking

[big_smile]

@renzof
Thanks you so much for your help! This has been a tricky problem, so I greatly appreciate your solution.

This is the code that I put on my HTML landing page:

<script>
    (function(w,d,t,u,n,a,m){w['MauticTrackingObject']=n;
        w[n]=w[n]||function(){(w[n].q=w[n].q||[]).push(arguments)},a=d.createElement(t),
        m=d.getElementsByTagName(t)[0];a.async=1;a.src=u;m.parentNode.insertBefore(a,m)
    })(window,document,'script','http://newsletter.smile.ws/mtc.js','mt');
    mt('send', 'pageview', {'tags':'sunshine-book'});

</script>

To test it out, I submitted a test contact on my HTML landing page.

When I log-into Mautic, and go to the contact page for the contact, the tag field is blank:

However, the tag does appear as an option in the tag menu:

How can I make it so the tag field is automatically filled with the tag?

On the tracking API page you linked to, it says the following:

The contact’s tags can be changed by using the tags query parameter. Multiple tags can be separated by comma. To remove a tag, prefix it with a dash (minus sign).

For example, mtracking.gif?tags=ProductA,-ProductB would add the ProductA tag to the contact and remove ProductB.

However, where would I put the mtracking.gif?tags=ProductA,-ProductB code? Do I need to set up a tracking pixel or can it be done via Javascript? Thanks!

[renzof]

That’s weird, maybe is not identifying the same contact from the javascript that the one submitting the code.

I guess that because you are the one testing this, the tags will be getting assigned to your profile/contact?

I just tested on my side with your code and I can see the tag applied

@big_smile

Do I need to set up a tracking pixel or can it be done via Javascript?

The pixel is a fallback mechanism for browsers that don’t have Javascript enabled, so maybe you can look into it after you get the JavaScript version working

Also maybe try to enable Identify visitor by device fingerprint if not enabled yet
you can find this setting under Config> Tracking Settings

[big_smile]

Thanks for your continued help.

@renzof

That’s weird, maybe is not identifying the same contact from the javascript that the one submitting the code.

Is there a trick to making sure the contact is the same.

@renzof

I guess that because you are the one testing this, the tags will be getting assigned to your profile/contact?

I tried entering a new email address on the HTML landing page to create a new contact. The contact is created, but the tag isn’t applied.

I’ve checked the documentation carefully, so I am not sure what is up?

[renzof]

Hey,

Sorry that that didn’t work, I am not 100% sure why, though I am running out of ideas

Here is another possibility, hope you know some javascript
You can the tracking event on submitting and if you pass the email as well and set the email to publicly updatable then the email and tags should be associated with the same contact.

Here is the info for the javascript api
https://developer.mautic.org/#mtc.js

I think the code should looks something like this

if (typeof MauticFormCallback == 'undefined') {
    var MauticFormCallback = {};
}
MauticFormCallback['replaceWithFormName'] = {
    onValidateEnd: function (formValid) {
         // before form submit
         mt('send', 'pageview', {'email':'email_used_in_the_form',  'tags':'sunshine-book'});
    },
    onResponse: function (response) { 
         // after form submit
    }
};

[big_smile]

@ renzof Thanks for your help. I’ll have to set aside some time on how to integrate the code via the API!

Going back to the earlier Javascript tracking code. This is the settings I have:

Are the any other settings I need to use? Thanks!

[renzof]

@big_smile

Are the any other settings I need to use? Thanks!

It looks ok, though because you are always testing from the same browser the fingerprint will always be the same.

By sending the email with tracking in theory it should all associate to the same contact

After submitting the form try to paste this in your developer console to quick test if this would work
mt('send', 'pageview', {'email':'email_used_in_the_form', 'tags':'sunshine-book'});

[big_smile]

It’s working! I looked at the console and saw that the browser was blocking somethings, because my code used “Htttp” instead of “https”. I switched it all to “https” and it works! Thank you so much for your help. I greatly appreciated.

One final question. Regarding this code:

mt(‘send’, ‘pageview’, {‘tags’:‘sunshine-book’});

At the moment, the book name is hardcoded in. I have a script that gets the book name from the file name of the HTML file:

<script>
window.onload = function() {
    let val = location.pathname.split('/').pop().replace('.html', '');
    val = val.replace(/-/g, ' ');
    val = val.replace(/(^\w{1})|(\s{1}\w{1})/g, match => match.toUpperCase());
    document.getElementById('mauticform_input_club_book_purchased').value = val;
    document.getElementById('mauticform_club_book_purchased').style.display = "none";
}

The variable val contains the book name.
Is there any way, I can use val in the tracking code, so I don’t have to hard code in the book name.

E.g. something like:

mt(‘send’, ‘pageview’, {‘tags’:val});

I am not sure how to get at variables from the tracking code.

[renzof]

Hey great news!

@big_smile

E.g. something like:

mt(‘send’, ‘pageview’, {‘tags’:val});

yes you can, trial and error is now you friend

The tracking code that you are using is 2 parts one is this one
(function(w,d,t,u,n,a,m){w['MauticTrackingObject']=n; w[n]=w[n]||function(){(w[n].q=w[n].q||[]).push(arguments)},a=d.createElement(t), m=d.getElementsByTagName(t)[0];a.async=1;a.src=u;m.parentNode.insertBefore(a,m) })(window,document,'script','http://newsletter.smile.ws/mtc.js','mt');

Which register the tracking script

And the second is this
mt(‘send’, ‘pageview’, {‘tags’:val});
Which you can use anywhere

So you could either test adding the mt tracking line after you set the form values or add the code to get the bookname from the url again before you sent the value to mautic.

Anyway now is the easy part enjoy