{"_id":"55e7720796131b2f00bf4b7b","version":{"_id":"5429beef1163360800ed31fd","__v":22,"project":"5429beef1163360800ed31fa","createdAt":"2014-09-29T20:19:59.904Z","releaseDate":"2014-09-29T20:19:59.904Z","categories":["5429beef1163360800ed31fe","55e74e1f5d36b32b002563fa","55e7500a73169617001f2e86","55e76b8196131b2f00bf4b72","55e89569cdbb8a350096df9c","55f8935eb089b71700a8364e","55f8a67d3bb4bb0d0022d093","55f9dbefc7ef770d00d9bf6d","5601c21a22ecf60d002b27b3","5601c21ff12aee0d001bb06e","5601c2256c7b610d00280db5","5601c22c22ecf60d002b27b4","5603738d0c78b00d0039af47","5626f70bfcbbc621004ebf52","566f7a1ae144ab0d00e9732f","566f85ca7820960d00c3b93d","56708ce43a32d20d00c45cbf","56708d436995210d003aad8e","5736471abe10a9200030732c","57a82c7aff9bd30e00a6f1c1","591b8500e3992319007190f4","5a3718305c66a60012d960ba"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"","version_clean":"1.0.0","version":"1.0"},"__v":8,"category":{"_id":"55e89569cdbb8a350096df9c","__v":14,"project":"5429beef1163360800ed31fa","pages":["55e896ac4535442d00ccacf3","55e8b205f0f1850d00d24a59","55e8b243720fde1700659a0e","55e8b4258c0c601700f978e0","55e8b5537cdf7119002d2e3a","55e8b5737cdf7119002d2e3c","55e8b5863fef5017000dbd9f","55e8b59ef0f1850d00d24a63","563b50349e3f2225009fd296","5640d891d4b2e00d00bb3d48","564cfd4e2248461700bd4021","5660e89689e82f0d008f6832","5668d3428ff3da0d0079092f","56abb944f25f160d00e17f40"],"version":"5429beef1163360800ed31fd","sync":{"url":"","isSync":false},"reference":true,"createdAt":"2015-09-03T18:46:01.692Z","from_sync":false,"order":1,"slug":"sdk-integrations","title":"Integrating for Web"},"githubsync":"","user":"55e74aae73169617001f2e78","project":"5429beef1163360800ed31fa","parentDoc":null,"updates":[],"next":{"pages":[],"description":""},"createdAt":"2015-09-02T22:02:47.652Z","link_external":false,"link_url":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","auth":"required","params":[],"url":""},"isReference":true,"order":7,"body":"## Ad Content Information ##\n\n**1. Creative Title\n**\n{{ creative_title() }} \n[block:parameters]\n{\n  \"data\": {\n    \"h-0\": \"Name\",\n    \"h-1\": \"Type\",\n    \"h-2\": \"Default\",\n    \"h-3\": \"Description\",\n    \"0-0\": \"class\",\n    \"1-0\": \"style\",\n    \"2-0\": \"a\",\n    \"3-0\": \"h\",\n    \"4-0\": \"h_class\",\n    \"5-0\": \"h_style\",\n    \"0-1\": \"String\",\n    \"1-1\": \"CSS\",\n    \"2-1\": \"Boolean\",\n    \"3-1\": \"String\",\n    \"4-1\": \"String\",\n    \"5-1\": \"CSS\",\n    \"0-2\": \"null\",\n    \"1-2\": \"null\",\n    \"3-2\": \"null\",\n    \"4-2\": \"null\",\n    \"5-2\": \"null\",\n    \"2-2\": \"true\",\n    \"0-3\": \"Class applied to the <a> \\n tag\",\n    \"1-3\": \"CSS styling applied to the <a>  tag\",\n    \"2-3\": \"Hyperlinks the element\",\n    \"3-3\": \"Specify the h element of the title\",\n    \"4-3\": \"Class applied to the h element of the title\",\n    \"5-3\": \"Specify the h element of the title\"\n  },\n  \"cols\": 4,\n  \"rows\": 6\n}\n[/block]\n**Usage of Creative Title formatting:**\n1. Polymorph Markup: \n{{ creative_title(class=\"testclass\", style=\"line-height: 1em;color: red\") }}\nRendered HTML tag:\n<a href=\"http://bevo-eu-west-1.adsnative.com/ck?url=https%3A%2F%2Fdev.getpolymorph.com%2Fdocs%2Fgetting-started&data=YjAyZmIxYTkyNzFkOWUxNjQwOGE4MGVlZjkxZjc0ODcwMjY0ZGRhYzQ3YjA1N2NjYTViYjQ4MGRjNDU2NjFjNjMxMzg3OWRkMzg0YzdiMzk0NzFkOGJkYTM5MWUxNTEyODY4ZGRkZWRlZDQxY2E2NDVkYWY3M2FiNmJiYWI4YjMyZjk2MGQ1ZWEwN2QwMWFiNzcwMDcyYzI2ODc2OTY1NjkzMGQ1Yjc2NDFkMjhlNzIyOTNkOGNhYjdjZDhlZjBkZTA2YjIxNjUwZjE3YjA0NGY1MzFiOTc5NmE0ZDZkZjI5MGI5ZTFhYWE0NjE4YTVjYzBmMzlhNjNmNzA5YjFhNTUzMzYxNzVlMWY4NmJjODUzOWEzZWY2YzRiYzk4OGZjMmRmZDIzNzRiNWZiMzcyYmUzOWEzMjViM2I4NWFmZDAwY2QyNzVkMzE1MWEwMTk5OTc4NWQ2NTVjNGNmZGEwZg%3D%3D&sid=1513273f3b684e70bc738a3afb226d52_e5227c72\" target=\"_blank\" class=\"testclass\" style=\"line-height: 1em;color: red\" rel=\"nofollow\">Title-Cars<div class=\"adsnative-icon-external-link\"></div></a>\n2. Polymorph Markup: \n{{ creative_title(a=false, h=\"h3\", h_class=\"large_title\", h_style=\"color:#a2b2a2;\") }}\nRendered HTML tag:\n<h3 class=\"large_title\" style=\"color:#a2b2a2;\">Title-Cars <div class=\"adsnative-icon-external-link\"></div></h3>\n\n**2. Creative Summary\n**\n{{ creative_summary() }}\n[block:parameters]\n{\n  \"data\": {\n    \"h-0\": \"Name\",\n    \"h-1\": \"Type\",\n    \"h-2\": \"Default\",\n    \"h-3\": \"Description\",\n    \"0-0\": \"class\",\n    \"0-1\": \"string\",\n    \"0-2\": \"null\",\n    \"0-3\": \"Class applied to the element tag\",\n    \"1-0\": \"style\",\n    \"1-1\": \"CSS\",\n    \"1-2\": \"null\",\n    \"1-3\": \"styling applied to element tag\",\n    \"2-0\": \"tagName\",\n    \"2-1\": \"String\",\n    \"2-2\": \"null\",\n    \"2-3\": \"Specifies the element tag, otherwise it is injected as a raw test\"\n  },\n  \"cols\": 4,\n  \"rows\": 3\n}\n[/block]\n**Usage of Creative Summary formatting:**\n1. Polymorph Markup: \n{{ creative_summary(class=\"short-description\",style=\"background-color:powderblue;\",tagName=\"p\") }}\nRendered HTML tag:\n<p class=\"short-description\" style=\"background-color:powderblue;\">Cars came into global use during the 20th century, and developed economies depend on them. The year 1886 is regarded as the birth year of the modern car when German inventor Karl Benz built his Benz Patent-Motorwage...</p>\n\n**3.Creative Media**\n\n{{ creative_media() }}\n[block:parameters]\n{\n  \"data\": {\n    \"h-0\": \"Name\",\n    \"h-1\": \"Type\",\n    \"h-2\": \"Default\",\n    \"h-3\": \"Description\",\n    \"0-0\": \"class\",\n    \"0-1\": \"String\",\n    \"0-2\": \"null\",\n    \"0-3\": \"Class applied to the <img> tag\",\n    \"1-0\": \"style\",\n    \"1-1\": \"CSS\",\n    \"1-2\": \"null\",\n    \"1-3\": \"styling applied to the <img> tag\",\n    \"2-0\": \"a\",\n    \"2-1\": \"Boolean\",\n    \"2-2\": \"false\",\n    \"2-3\": \"Hyperlinks the element\",\n    \"3-0\": \"a_class\",\n    \"4-0\": \"a_style\",\n    \"5-0\": \"resize\",\n    \"3-1\": \"String\",\n    \"4-1\": \"CSS null\",\n    \"5-1\": \"boolean\",\n    \"3-2\": \"null\",\n    \"4-2\": \"null\",\n    \"5-2\": \"false\",\n    \"3-3\": \"Class assigned to the hyperlink\",\n    \"4-3\": \"styling applied to the hyperlink\",\n    \"5-3\": \"Will set the image as a background-img of a div and crop it to specified dimentions\"\n  },\n  \"cols\": 4,\n  \"rows\": 6\n}\n[/block]\n**Usage of Creative Media formatting:**\n1. Polymorph Markup: \n{{ creative_media(class=\"an-media\", a=true, resize=true) }}\nRendered HTML tag would look like this:\n<a href=\"http://bevo-eu-west-1.adsnative.com/ck?url=https%3A%2F%2Fdev.getpolymorph.com%2Fdocs%2Fgetting-started&data=ZGMxZDcxZjI4YTkyYmYxMjg0MWI2Y2JjNTk5YmJiYmVlOTc2ZTZiZDQyYTRhOWEzMzNkYWZlNjQ3MmU2ZjJkM2U3MjMyYmFkZTNmNTE4MTQyZDhjZGFiNTYxOTg1YWIzMjVlNzg0NmMwN2NiNjUzMGVkZDA1ZWY2ZDUyMzk4NmYyNDMzZmI3YzA5OTU4ZmRkZWI5ZmE1NTk3ZGY3NzJhZWVjOWFkYWE0OTY1MDA0NGIyNmM1MTM1ZjM3NmNmMjljODcxYjE1OTQyZjkxOTJhMTQ1YmEyZDA1YzFkMzg5NDc2ZTQzMDg5NTUwY2JhMWNjNjI5ZDVmZTUyY2Q1MGFjNTJkOWQ4NGJiNDNkNGI0YjMwYWFhYjY3OGNjMTdjNjgxMzRjZDJhYTg5YWZjNDE0YjZiMjU2NWQyZjU3OTZmMzZmZjAwYjFmZWQwMzQxZWM4YzJhZmNlNDIwNGZkNTg1OA%3D%3D&sid=2a4440878c2b43a08b7c853e3fdecccf_c8635ae3\" target=\"_blank\" class=\"\" style=\"\" rel=\"nofollow\"><div class=\"an-media\" style=\";background-image:url('http://cdn.adsnative.com/media/nw-523/a7df085b-42ec-4f11-a7d6-778376aa2749.jpg');width:30;height:40;background-repeat: no-repeat;;background-position:center center;background-color:red;background-size: cover\"></div></a>\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<div class=\\\"an-media\\\" style=\\\";background-image:url('http://cdn.adsnative.com/media/nw-523/a7df085b-42ec-4f11-a7d6-778376aa2749.jpg');width:400;height:800;background-repeat: no-repeat;;background-position:center center;background-color:white;background-size: cover\\\"></div></a>\",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]\n\n##4.Brand Information ##\n\n**Brand Icon**\n\n{{ brand_icon() }}\n[block:parameters]\n{\n  \"data\": {\n    \"h-0\": \"Name\",\n    \"h-1\": \"Type\",\n    \"h-2\": \"Default\",\n    \"h-3\": \"Description\",\n    \"0-0\": \"class\",\n    \"0-1\": \"String\",\n    \"0-2\": \"null\",\n    \"0-3\": \"Class applied to the <img> tag\",\n    \"1-0\": \"style\",\n    \"2-0\": \"a\",\n    \"3-0\": \"a_class\",\n    \"4-0\": \"a_style\",\n    \"5-0\": \"width\",\n    \"6-0\": \"height\",\n    \"1-1\": \"CSS\",\n    \"2-1\": \"Boolean\",\n    \"3-1\": \"String\",\n    \"4-1\": \"CSS\",\n    \"5-1\": \"String\",\n    \"6-1\": \"String\",\n    \"1-2\": \"null\",\n    \"2-2\": \"false\",\n    \"3-2\": \"null\",\n    \"4-2\": \"null\",\n    \"5-2\": \"null\",\n    \"6-2\": \"null\",\n    \"1-3\": \"CSS styling applied to the <img> tag\",\n    \"2-3\": \"Hyperlinks the element\",\n    \"3-3\": \"Class assigned to the hyperlink\",\n    \"4-3\": \"styling applied to the hyperlink\",\n    \"5-3\": \"Specifies the width of the brand image\",\n    \"6-3\": \"Specifies the height of the brand image\"\n  },\n  \"cols\": 4,\n  \"rows\": 7\n}\n[/block]\n**Usage of Creative Media formatting:**\n1. Polymorph Markup: \n{{ brand_icon(a=false,resize=true,class=\"an\",width=\"30\",height=\"30\") }}\nRendered HTML tag:\n<img src=\"http://cdn.adsnative.com/media/nw-523/0f3a12c5-3b01-4628-9450-124e21243caf.jpg\" class=\"an\" width=\"30\" height=\"30\" alt=\"\" style=\"\" />\n\n**5.Brand Title**\n\n{{ brand_title() }}\n[block:parameters]\n{\n  \"data\": {\n    \"h-0\": \"Name\",\n    \"h-1\": \"Type\",\n    \"h-2\": \"Default\",\n    \"h-3\": \"Description\",\n    \"0-0\": \"class\",\n    \"1-0\": \"style\",\n    \"2-0\": \"tagName\",\n    \"3-0\": \"a\",\n    \"4-0\": \"a_class\",\n    \"5-0\": \"a_style\",\n    \"6-0\": \"prefix\",\n    \"0-1\": \"String\",\n    \"1-1\": \"CSS\",\n    \"2-1\": \"String\",\n    \"3-1\": \"Boolean\",\n    \"4-1\": \"String\",\n    \"5-1\": \"CSS\",\n    \"6-1\": \"Boolean\",\n    \"0-2\": \"null\",\n    \"1-2\": \"null\",\n    \"2-2\": \"null\",\n    \"3-2\": \"false\",\n    \"4-2\": \"null\",\n    \"5-2\": \"null\",\n    \"6-2\": \"true\",\n    \"0-3\": \"Class applied to the element tag\",\n    \"1-3\": \"CSS styling applied to the element tag\",\n    \"2-3\": \"Specifies the element tag, otherwise injected as raw test\",\n    \"3-3\": \"Hyperlinks the element\",\n    \"4-3\": \"Class assigned to the hyperlink\",\n    \"5-3\": \"styling applied to the hyperlink\",\n    \"6-3\": \"Add prefix such as ‘Promoted by’ and then brand name\"\n  },\n  \"cols\": 4,\n  \"rows\": 7\n}\n[/block]\n**Usage of Creative Media formatting:**\n1. Polymorph Markup: \n{{ brand_title(a=false, prefix=true, class=\"story-ad_attribution-link\") }}\nRendered **HTML** tag:\n<p class=\"story-ad_attribution-link\" style=\"\">Promoted by Brand Name - volkswagen</p>\n\n\n##6.Creative \"Custom Data\" Information ##\n\nCustom data can be used to customize your placement. Any custom data added to campaign -> creative, will be accessible via custom data markup within your placement HTML. In the below example, I have set custom data as `refresh interval`. This attribute is used to refresh the placement every 20s and get a new ad.\n\n**Usage of custom data for web placement** \n\n1. Create a campaign with creative custom data to **refresh_interval** \nYou can find the field in the creative create/update page\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/436be28-Screen_Shot_2018-03-23_at_12.49.08.png\",\n        \"Screen Shot 2018-03-23 at 12.49.08.png\",\n        2432,\n        1278,\n        \"#e4e6e5\"\n      ]\n    }\n  ]\n}\n[/block]\n2. Update the placement with Custom Field i.e ***refresh_interval*** to use it on your end\nPolymorph Markup:  {{ custom_tag(key=<Custom data key name>) }}\nExample from above : {{ custom_tag(key=\"refresh_interval\") }}\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/04be00f-Screen_Shot_2018-03-23_at_13.02.52.png\",\n        \"Screen Shot 2018-03-23 at 13.02.52.png\",\n        2400,\n        512,\n        \"#1d4661\"\n      ]\n    }\n  ]\n}\n[/block]\n3. When the ad is rendered, custom key - **refresh_interval** value is 20\n\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"customFields: - {\\nproviderName: \\\"AdsNative\\\",\\nrefresh_interval: \\\"20\\\"\\n}\",\n      \"language\": \"json\"\n    }\n  ]\n}\n[/block]","excerpt":"Native markup language helps you to create placements that will be trafficking your ad campaigns. You need to include these tags in your HTML markup as given below in the examples. \n\nNote: Tags follow strict syntax. If space or comma is off, it will throw an error. Additionally, all variable values, except booleans, need to be in quotations.","slug":"native-markup-language","type":"basic","title":"Native Markup Language"}

Native Markup Language

Native markup language helps you to create placements that will be trafficking your ad campaigns. You need to include these tags in your HTML markup as given below in the examples. Note: Tags follow strict syntax. If space or comma is off, it will throw an error. Additionally, all variable values, except booleans, need to be in quotations.

## Ad Content Information ## **1. Creative Title ** {{ creative_title() }} [block:parameters] { "data": { "h-0": "Name", "h-1": "Type", "h-2": "Default", "h-3": "Description", "0-0": "class", "1-0": "style", "2-0": "a", "3-0": "h", "4-0": "h_class", "5-0": "h_style", "0-1": "String", "1-1": "CSS", "2-1": "Boolean", "3-1": "String", "4-1": "String", "5-1": "CSS", "0-2": "null", "1-2": "null", "3-2": "null", "4-2": "null", "5-2": "null", "2-2": "true", "0-3": "Class applied to the <a> \n tag", "1-3": "CSS styling applied to the <a> tag", "2-3": "Hyperlinks the element", "3-3": "Specify the h element of the title", "4-3": "Class applied to the h element of the title", "5-3": "Specify the h element of the title" }, "cols": 4, "rows": 6 } [/block] **Usage of Creative Title formatting:** 1. Polymorph Markup: {{ creative_title(class="testclass", style="line-height: 1em;color: red") }} Rendered HTML tag: <a href="http://bevo-eu-west-1.adsnative.com/ck?url=https%3A%2F%2Fdev.getpolymorph.com%2Fdocs%2Fgetting-started&data=YjAyZmIxYTkyNzFkOWUxNjQwOGE4MGVlZjkxZjc0ODcwMjY0ZGRhYzQ3YjA1N2NjYTViYjQ4MGRjNDU2NjFjNjMxMzg3OWRkMzg0YzdiMzk0NzFkOGJkYTM5MWUxNTEyODY4ZGRkZWRlZDQxY2E2NDVkYWY3M2FiNmJiYWI4YjMyZjk2MGQ1ZWEwN2QwMWFiNzcwMDcyYzI2ODc2OTY1NjkzMGQ1Yjc2NDFkMjhlNzIyOTNkOGNhYjdjZDhlZjBkZTA2YjIxNjUwZjE3YjA0NGY1MzFiOTc5NmE0ZDZkZjI5MGI5ZTFhYWE0NjE4YTVjYzBmMzlhNjNmNzA5YjFhNTUzMzYxNzVlMWY4NmJjODUzOWEzZWY2YzRiYzk4OGZjMmRmZDIzNzRiNWZiMzcyYmUzOWEzMjViM2I4NWFmZDAwY2QyNzVkMzE1MWEwMTk5OTc4NWQ2NTVjNGNmZGEwZg%3D%3D&sid=1513273f3b684e70bc738a3afb226d52_e5227c72" target="_blank" class="testclass" style="line-height: 1em;color: red" rel="nofollow">Title-Cars<div class="adsnative-icon-external-link"></div></a> 2. Polymorph Markup: {{ creative_title(a=false, h="h3", h_class="large_title", h_style="color:#a2b2a2;") }} Rendered HTML tag: <h3 class="large_title" style="color:#a2b2a2;">Title-Cars <div class="adsnative-icon-external-link"></div></h3> **2. Creative Summary ** {{ creative_summary() }} [block:parameters] { "data": { "h-0": "Name", "h-1": "Type", "h-2": "Default", "h-3": "Description", "0-0": "class", "0-1": "string", "0-2": "null", "0-3": "Class applied to the element tag", "1-0": "style", "1-1": "CSS", "1-2": "null", "1-3": "styling applied to element tag", "2-0": "tagName", "2-1": "String", "2-2": "null", "2-3": "Specifies the element tag, otherwise it is injected as a raw test" }, "cols": 4, "rows": 3 } [/block] **Usage of Creative Summary formatting:** 1. Polymorph Markup: {{ creative_summary(class="short-description",style="background-color:powderblue;",tagName="p") }} Rendered HTML tag: <p class="short-description" style="background-color:powderblue;">Cars came into global use during the 20th century, and developed economies depend on them. The year 1886 is regarded as the birth year of the modern car when German inventor Karl Benz built his Benz Patent-Motorwage...</p> **3.Creative Media** {{ creative_media() }} [block:parameters] { "data": { "h-0": "Name", "h-1": "Type", "h-2": "Default", "h-3": "Description", "0-0": "class", "0-1": "String", "0-2": "null", "0-3": "Class applied to the <img> tag", "1-0": "style", "1-1": "CSS", "1-2": "null", "1-3": "styling applied to the <img> tag", "2-0": "a", "2-1": "Boolean", "2-2": "false", "2-3": "Hyperlinks the element", "3-0": "a_class", "4-0": "a_style", "5-0": "resize", "3-1": "String", "4-1": "CSS null", "5-1": "boolean", "3-2": "null", "4-2": "null", "5-2": "false", "3-3": "Class assigned to the hyperlink", "4-3": "styling applied to the hyperlink", "5-3": "Will set the image as a background-img of a div and crop it to specified dimentions" }, "cols": 4, "rows": 6 } [/block] **Usage of Creative Media formatting:** 1. Polymorph Markup: {{ creative_media(class="an-media", a=true, resize=true) }} Rendered HTML tag would look like this: <a href="http://bevo-eu-west-1.adsnative.com/ck?url=https%3A%2F%2Fdev.getpolymorph.com%2Fdocs%2Fgetting-started&data=ZGMxZDcxZjI4YTkyYmYxMjg0MWI2Y2JjNTk5YmJiYmVlOTc2ZTZiZDQyYTRhOWEzMzNkYWZlNjQ3MmU2ZjJkM2U3MjMyYmFkZTNmNTE4MTQyZDhjZGFiNTYxOTg1YWIzMjVlNzg0NmMwN2NiNjUzMGVkZDA1ZWY2ZDUyMzk4NmYyNDMzZmI3YzA5OTU4ZmRkZWI5ZmE1NTk3ZGY3NzJhZWVjOWFkYWE0OTY1MDA0NGIyNmM1MTM1ZjM3NmNmMjljODcxYjE1OTQyZjkxOTJhMTQ1YmEyZDA1YzFkMzg5NDc2ZTQzMDg5NTUwY2JhMWNjNjI5ZDVmZTUyY2Q1MGFjNTJkOWQ4NGJiNDNkNGI0YjMwYWFhYjY3OGNjMTdjNjgxMzRjZDJhYTg5YWZjNDE0YjZiMjU2NWQyZjU3OTZmMzZmZjAwYjFmZWQwMzQxZWM4YzJhZmNlNDIwNGZkNTg1OA%3D%3D&sid=2a4440878c2b43a08b7c853e3fdecccf_c8635ae3" target="_blank" class="" style="" rel="nofollow"><div class="an-media" style=";background-image:url('http://cdn.adsnative.com/media/nw-523/a7df085b-42ec-4f11-a7d6-778376aa2749.jpg');width:30;height:40;background-repeat: no-repeat;;background-position:center center;background-color:red;background-size: cover"></div></a> [block:code] { "codes": [ { "code": "<div class=\"an-media\" style=\";background-image:url('http://cdn.adsnative.com/media/nw-523/a7df085b-42ec-4f11-a7d6-778376aa2749.jpg');width:400;height:800;background-repeat: no-repeat;;background-position:center center;background-color:white;background-size: cover\"></div></a>", "language": "html" } ] } [/block] ##4.Brand Information ## **Brand Icon** {{ brand_icon() }} [block:parameters] { "data": { "h-0": "Name", "h-1": "Type", "h-2": "Default", "h-3": "Description", "0-0": "class", "0-1": "String", "0-2": "null", "0-3": "Class applied to the <img> tag", "1-0": "style", "2-0": "a", "3-0": "a_class", "4-0": "a_style", "5-0": "width", "6-0": "height", "1-1": "CSS", "2-1": "Boolean", "3-1": "String", "4-1": "CSS", "5-1": "String", "6-1": "String", "1-2": "null", "2-2": "false", "3-2": "null", "4-2": "null", "5-2": "null", "6-2": "null", "1-3": "CSS styling applied to the <img> tag", "2-3": "Hyperlinks the element", "3-3": "Class assigned to the hyperlink", "4-3": "styling applied to the hyperlink", "5-3": "Specifies the width of the brand image", "6-3": "Specifies the height of the brand image" }, "cols": 4, "rows": 7 } [/block] **Usage of Creative Media formatting:** 1. Polymorph Markup: {{ brand_icon(a=false,resize=true,class="an",width="30",height="30") }} Rendered HTML tag: <img src="http://cdn.adsnative.com/media/nw-523/0f3a12c5-3b01-4628-9450-124e21243caf.jpg" class="an" width="30" height="30" alt="" style="" /> **5.Brand Title** {{ brand_title() }} [block:parameters] { "data": { "h-0": "Name", "h-1": "Type", "h-2": "Default", "h-3": "Description", "0-0": "class", "1-0": "style", "2-0": "tagName", "3-0": "a", "4-0": "a_class", "5-0": "a_style", "6-0": "prefix", "0-1": "String", "1-1": "CSS", "2-1": "String", "3-1": "Boolean", "4-1": "String", "5-1": "CSS", "6-1": "Boolean", "0-2": "null", "1-2": "null", "2-2": "null", "3-2": "false", "4-2": "null", "5-2": "null", "6-2": "true", "0-3": "Class applied to the element tag", "1-3": "CSS styling applied to the element tag", "2-3": "Specifies the element tag, otherwise injected as raw test", "3-3": "Hyperlinks the element", "4-3": "Class assigned to the hyperlink", "5-3": "styling applied to the hyperlink", "6-3": "Add prefix such as ‘Promoted by’ and then brand name" }, "cols": 4, "rows": 7 } [/block] **Usage of Creative Media formatting:** 1. Polymorph Markup: {{ brand_title(a=false, prefix=true, class="story-ad_attribution-link") }} Rendered **HTML** tag: <p class="story-ad_attribution-link" style="">Promoted by Brand Name - volkswagen</p> ##6.Creative "Custom Data" Information ## Custom data can be used to customize your placement. Any custom data added to campaign -> creative, will be accessible via custom data markup within your placement HTML. In the below example, I have set custom data as `refresh interval`. This attribute is used to refresh the placement every 20s and get a new ad. **Usage of custom data for web placement** 1. Create a campaign with creative custom data to **refresh_interval** You can find the field in the creative create/update page [block:image] { "images": [ { "image": [ "https://files.readme.io/436be28-Screen_Shot_2018-03-23_at_12.49.08.png", "Screen Shot 2018-03-23 at 12.49.08.png", 2432, 1278, "#e4e6e5" ] } ] } [/block] 2. Update the placement with Custom Field i.e ***refresh_interval*** to use it on your end Polymorph Markup: {{ custom_tag(key=<Custom data key name>) }} Example from above : {{ custom_tag(key="refresh_interval") }} [block:image] { "images": [ { "image": [ "https://files.readme.io/04be00f-Screen_Shot_2018-03-23_at_13.02.52.png", "Screen Shot 2018-03-23 at 13.02.52.png", 2400, 512, "#1d4661" ] } ] } [/block] 3. When the ad is rendered, custom key - **refresh_interval** value is 20 [block:code] { "codes": [ { "code": "customFields: - {\nproviderName: \"AdsNative\",\nrefresh_interval: \"20\"\n}", "language": "json" } ] } [/block]