Expand my Community achievements bar.

Applications for the 2024 Adobe Target Community Mentorship Program are open! Click to the right to learn more about participating as either an Aspirant, to professionally level up with a new Certification, or as a Mentor, to share your Adobe Target expertise and inspire through your leadership! Submit your application today.
SOLVED

AT.js and a HTML offer

Avatar

Level 4

Hello,

I am using Adobe DTM to deploy AT.js (0.9.6) and a Global MBox.

When I create my form based Experience in Adobe Target, and choose my HTML offer, I'm noticing that all of the HTML content is stripped away. Content inside an <style>, or <script> tags are preserved, but the HTML content is removed.

My guess is that AT.js inserts itself in the <HEAD> tags, and HTML content is not supported here. But how can I use a Global MBox but target the insertion in the page body, or alternatively, how can I configure the offer so all of the HTML content is safely encoded?

1 Accepted Solution

Avatar

Correct answer by
Employee Advisor

You are correct. The at.js fires the global mbox request from the HEAD of the document and so HTML content can't be rendered there. Depending on your use case there should be several options available for adding HTML with the visual composer:

  1. Use the code editor > custom code section and uncheck the "add to head" option.
  2. Find an element on the page just above to the place you want to add HTML and choose the insert element option.

The global mbox was designed for the visual composer so you may find those options work better for you. However, if you find that you must use the form composer you have these options available.

  1. Use global mbox and create an html offer but write a script to insert the HTML content you are trying load directly from the global mbox to somewhere on the body. Keep in mind you'll need to time the execution of your script to be after the DOM element you are manipulating is available.
  2. Add a regional mbox to the page (this would be in the body around the content you want to change) and then select that mbox in the location dropdown for the form composer. Create an regular HTML offer.

Here's a help doc on adding a regional mbox to your page: mboxCreate(mbox,params)

View solution in original post

4 Replies

Avatar

Level 10

Hi Joris,

When you are using a Form based experience Composer to create an experience , you will be definitely choose an mbox which will identify the location on your page where you are trying to deliver content of the experience and Hence the content ( Htrml offer or any thing else) will be delivered to the chosen mbox location. So your guess that  AT.js inserts itself in the <HEAD> tags, and HTML content is not supported here doesn't hold good here.

Also, Are you using document.write in the HTML offer ?.Can you please share Adobe Target Account credential & Activity URL in a private message on forum so that we can debug the issue at our end.

Regards

Parit

Avatar

Correct answer by
Employee Advisor

You are correct. The at.js fires the global mbox request from the HEAD of the document and so HTML content can't be rendered there. Depending on your use case there should be several options available for adding HTML with the visual composer:

  1. Use the code editor > custom code section and uncheck the "add to head" option.
  2. Find an element on the page just above to the place you want to add HTML and choose the insert element option.

The global mbox was designed for the visual composer so you may find those options work better for you. However, if you find that you must use the form composer you have these options available.

  1. Use global mbox and create an html offer but write a script to insert the HTML content you are trying load directly from the global mbox to somewhere on the body. Keep in mind you'll need to time the execution of your script to be after the DOM element you are manipulating is available.
  2. Add a regional mbox to the page (this would be in the body around the content you want to change) and then select that mbox in the location dropdown for the form composer. Create an regular HTML offer.

Here's a help doc on adding a regional mbox to your page: mboxCreate(mbox,params)

Avatar

Level 4

Hi Ryan,

Thanks for the detailed reply. I think your suggestion to use the global mbox, but write a script to insert the HTML content is my best option here.

I played around with regional mboxes, but there was just too much flashing.

I also want to avoid using the VEC. I have around 150 dynamically generated HTML offers which I'm uploading into Target using the API. When I use VEC to add custom code, I can't select a pre-existing offer, I can only paste in code.

Avatar

Employee Advisor

Glad that helped. One other thing that might work for you in the VEC is the swap offer option. If you can select the appropriate div/container on the page that matches the scope of your API uploaded HTML offers you should be able to then pick from the uploaded offer set which one you want to replace the container you selected in the VEC.