Join our Community in its new Home - The Datorama Trailblazer Community Group!

It's been an amazing 3 years coming together in this forum to collaborate, innovate, support, and inspire each other about our shared usage of Datorama. While this is not quite a goodbye, we are excited to announce that we are getting a fresh start in our new home within the Salesforce Trailblazer Community. We have a ton of fun new content planned and you may even see the revival of some of our most popular posts from the past few years.

We’ll be keeping this group around for a bit for you to peruse, but as of November 15, we will no longer be allowing new posts or comments. Be sure to join our new group at https://www.salesforce.com/success-datorama to keep the conversation going.

We can’t wait to see you there!

Custom Widget for Top Performing Facebook Creative

EmilyEmily New YorkSYS_ADMIN IMG42

Locate and Isolate the Creative Image Data

1.  Find the unique field in the Facebook data streams for the creative image (ex. csv['ad_creative_image'] )

2.  Create a calculated dimension to produce high res images of the creative.  

var str = [Creative_Image];<br>var end_pos = '';<br>var url = '';if (str contains '%2F')<br>{<br>end_pos = FIND('&url=',str) + 5;<br>url = SUBSTRING(str,end_pos,LEN(str));<br>url = REPLACE(url,'%2F','/');<br>url = REPLACE(url,'%3A',':');<br>url = REPLACE(url,'%3F','?');<br>url = REPLACE(url,'%3D','=');<br>url = REPLACE(url,'%26','&');<br>return url;<br>}<br>else<br>{<br>[Creative_Image]<br>}

Construct the Custom Widget

1.  Create a Custom Widget and use 'add data' to add the Creative Image dimension/calculated dimension made above. 

2. HTML in Custom Widget Editor (Note that the HTML below includes a line for number of clicks which could be brought in with another query if desired). 

<p><img id="creative-image" height="350" src="about:blank"></img></p><p><h4>Total Clicks:</h4></p><p><p id="numberClicks"></p></p>

3.  Javascript in Custom Widget Editor: 

<p>var queryResult = DA.query.getQueryResult();</p><p>var result = queryResult["rows"][0][0]['value'];</p><p>var clicks = queryResult["rows"][0][1]['value'];</p><p>console.log(JSON.stringify(queryResult));<br>console.log(DA.query.getQueryResult());<br>console.log(clicks);</p><p>document.getElementById('creative-image').src = result;</p><p>document.getElementById('numberClicks').innerHTML = clicks;</p>

4.  Save your custom widget

5.  Sort Method: by the KPI that is most important in determining the creative's success:

6. Filter out any null values:

Notice that you can change the rows value to index each row of data coming into the custom widget based on the sorting method defined in the custom widget  So this example gives us the first row based on the sorting the creative images by top clicks descending in other words it gives us the best performing creative image based on clicks
You can change the rows value to index each row of data coming into the custom widget (based on the sorting method defined in the custom widget). So this example gives us the first row, based on the sorting the creative images by top clicks descending; in other words, it gives us the best performing creative image based on clicks.

7.  Test the widget to ensure you are seeing a creative image (Note that you may need to open up the console to see your creative image data) 

8.   If you cannot gather your unique creative image, or are having trouble with it, try changing the index values (in relation to the console log values) to query the value:

Below is the example code for pulling the top performing creative image: 

Below is the example code for pulling the second top performing creative image (notice that the value in the rows has changed to '1' for the second row of data coming in according to the custom widget's sort method):

Sign In or Register to comment.