Adobe Target

ronnyfm · 10/15/15

Hello, is there any guidelines or tutorials on how to integrate Test&Target in a single page application section made with backbone.js (in this case specifically).

Thanks for you help.

shekhardhiman · 10/15/15

HI there,

Thanks a lot for reaching out to Adobe Community:

Upon discussing with the consulting team I have an example to share:

MVC frameworks can be very flexible, lightweight, and responsive in comparison to “traditional” sites. MVC frameworks are plentiful and deployments are increasingly common. There are certain fundamental differences between MVC and traditional sites - the most important one in respect of Adobe Target being that a full-page load is not required for the visitor to navigate through the site and perform key tasks. An example is navigating from home page to booking options having made a city/date search.

There is a Adobe Target core library file called mbox.js

There is a function called TNT.createGlobalMbox within this file. The function needs to run at the bottom of the file after all other functions in the file have been declared. More technical details of what is contained in this file and why is here - https://marketing.adobe.com/resources/help/en_US/target/ov/c_mbox_technical.html

This function will send a request to Target with an mbox name of target-global-mbox and some basic parameters. This function can be run at any time including after the page has loaded. The mbox name and/or the parameters can be modified.

This function needs to run every time a significant change is made to the page that might require the delivery of the new response from a live campaign in Adobe Target.

For example, the customer lands on the homepage. The Adobe Target library file loads and the mbox request will be sent (assuming the file has been updated as per the above steps). The response could be a modification of an element on the homepage.

The customer then searches for hotels in London on a particular date and clicks the Search now button. The controllers from the angular framework will render new data to the body of the page (the view). Once this operation has occurred the TNT.createGlobalMbox function will need to run in order to send a request to Adobe Target and receive a response from an active campaign.

You will need to define the most flexible and scalable approach to this and it depends largely on your angular deployment. Please work with Adobe to achieve this.

You can send additional parameters to Adobe Target with the request. Do this by utilising the targetPageParams function that resides in the mbox.js file.

In the file declare the following code block close to the bottom of the file to pick up any URL parameters and send them as mbox parameters:

if (document.location.search.length>0) {

function targetPageParams() {

var locationSearch = document.location.search

var targetPageParamsSetUp = locationSearch.slice(1);

return targetPageParamsSetUp;}

}

This is just one example and the function can also accept Arrays and JSON - https://marketing.adobe.com/resources/help/en_US/target/ov/c_pass_parameters_to_global_mbox.html

Hope this helps!

View solution in original post

popescu_cristi · 10/15/15

I hav e the same problem and I can`t find nowhere an answer

shekhardhiman · 10/15/15

Hi There,

Thanks for reaching out to Adobe Community.

Could you please elaborate a little on how do you wish to do this integration and what exactly you are trying to achieve?

Thanks!

popescu_ana · 10/15/15

popescu cristi wrote...

I hav e the same problem and I can`t find nowhere an answer

me too

ronnyfm · 10/15/15

Sure, the current application is a plain backbone.js, we have typical backbone views for content rendering. Now, client wants to perform A/B testing with Adobe Target. As far as I understand we would need to wrap our HTML inside mbox divs, but since views are loaded dynamically, I want to know what considerations should be taken into. For example, will we get the same result if we insert the view dynamically has the same effect, or if the backbone templates should have the mbox div tags in them.

shekhardhiman · 10/15/15