Created
April 10, 2024 12:02
-
-
Save lephleg/31cb1f3691c2ef17ba7d8c55297f2b44 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "campaigns":[ | |
| { | |
| "campaign_id":200030, | |
| "creative":"<iframe style=\"width: 100%; height: 200px; border: 0; margin: 0; padding: 0;\" onload='\\''javascript:(function(o){o.style.height=o.contentWindow.document.body.scrollHeight+\"px\";}(this));'\\'' srcdoc='\\''<html lang=en> <head> <style> html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, img { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } body { line-height: 1; overflow: hidden; } </style> <style> h1, h3 { font-family: system-ui, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"; font-style: normal; margin: 0; } h1 { color: rgba(0, 0, 0, 0.60); font-size: 12px; font-weight: 400; line-height: 125%; word-break: break-word; } h3 { color: #000; font-size: 16px; font-weight: 600; line-height: 135%; margin-top: 8px; word-break: break-word; } .creative-container { width: 100%; } .creative-area { border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 4px; padding: 12px; display: flex; flex-direction: column; box-sizing: border-box; overflow: hidden; margin: 0 auto; background-color: #fff; text-decoration: none; color: #000; } .creative-area:hover { cursor: pointer; } .creative-image img { width: 100%; display: block; } .creative-content { display: flex; flex-direction: row; align-items: stretch; justify-content: center; margin-top: 16px; flex-grow: 1; } .creative-copy { display: flex; flex-direction: column; justify-content: center; } .creative-cta { width: 42px; height: 42px; margin-left: 16px; align-self: center; } /* Mobile */ .mobile.creative-container .creative-area{ max-width: 350px; } .mobile .creative-copy { flex-grow: 1; } /* Tablet */ .tablet h1 { font-size: 13px; } .tablet h3 { font-size: 16px; } .tablet.creative-container .creative-area{ flex-direction: row; gap: 16px; justify-content: space-between; max-width: 550px; } .tablet .creative-image img { width: 235px; height: 235px; } .tablet .creative-content { flex-direction: column; margin-top: 4px; flex-grow: 1; } .tablet .creative-cta { margin-top: 14px; margin-left: 0; margin-bottom: 0; align-self: normal; } /* Desktop */ .desktop h1 { font-size: 14px; } .desktop h3 { font-size: 18px; } .desktop.creative-container .creative-area{ max-width: 800px; flex-direction: row; gap: 24px; justify-content: space-between; } .desktop .creative-image img { width: 136px; height: 136px; } .desktop .creative-copy { flex-grow: 1; } .desktop .creative-content { flex-direction: row; margin: 0; /* height: 128px;*/ flex-grow: 1; max-width: unset; } .desktop .creative-cta { margin-top: 0; margin-left: 24px; margin-bottom: 0; align-self: center; } </style> </head> <body> <div class=\"creative-container\"> [tracking_pixel] <a href=\"https://github.com/Automattic/blaze-ad-server-poc\" target=\"_blank\" class=\"creative-area\"> <div class=\"creative-image\"> <img crossorigin=\"anonymous\" src=\"https://thyagotest.wpcomstaging.com/wp-content/uploads/2024/04/ads-core.png\" id=\"imageUrl\" alt=\"image\" /> </div> <div class=\"creative-content\"> <div class=\"creative-copy\"> <h1 class=\"creative-title\" id=\"title\">Ads Core in Dubai</h1> <h3 class=\"creative-snippet\" id=\"snippet\">Hello World! This ad is being delivered to you by <b>Blaze Ad Server</b>.</h3> </div> <div class=\"creative-cta\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"42\" height=\"43\" viewBox=\"0 0 42 43\" fill=\"none\"> <circle cx=\"21\" cy=\"21.5\" r=\"21\" fill=\"#0038FF\" /> <circle cx=\"21\" cy=\"21.5\" r=\"20.5\" stroke=\"#333333\" stroke-opacity=\"0.33\" /> <path d=\"M18 12.5L26.2929 20.7929C26.6834 21.1834 26.6834 21.8166 26.2929 22.2071L18 30.5\" stroke=\"white\" stroke-width=\"1.5\" /> </svg> </div> </div> </a> </div> </body> <script> function fixSizes() { const el = document.getElementsByClassName(\"creative-container\")[0]; const height = el.getBoundingClientRect().height; const maxWidth = getComputedStyle(document.getElementsByClassName(\"creative-area\")[0]).maxWidth; window.parent.postMessage({ type: \"wa-inline-frame\", action: \"resize\", height: height, maxWidth: maxWidth }, \"*\"); const width = el.getBoundingClientRect().width; if(width < 490) { el.classList.remove(\"tablet\", \"desktop\"); el.classList.add(\"mobile\"); } else if( width < 640 ){ el.classList.remove(\"mobile\", \"desktop\"); el.classList.add(\"tablet\"); } else { el.classList.remove(\"mobile\", \"tablet\"); el.classList.add(\"desktop\"); } } fixSizes(); window.setInterval(fixSizes, 100); </script></html>'\\'' />", | |
| "start_at":"2024-04-08T16:00:00.00Z", | |
| "end_at":"2025-04-20T00:00:00.00Z", | |
| "bidding":{ | |
| "price_model":"cpm", | |
| "rate":130 | |
| }, | |
| "daily_budget":1000, | |
| "frequency_capping":10000 | |
| }, | |
| { | |
| "campaign_id":200031, | |
| "creative":"<iframe style=\"width: 100%; height: 200px; border: 0; margin: 0; padding: 0;\" onload='\\''javascript:(function(o){o.style.height=o.contentWindow.document.body.scrollHeight+\"px\";}(this));'\\'' srcdoc='\\''<html lang=en> <head> <style> html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, img { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } body { line-height: 1; overflow: hidden; } </style> <style> h1, h3 { font-family: system-ui, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"; font-style: normal; margin: 0; } h1 { color: rgba(0, 0, 0, 0.60); font-size: 12px; font-weight: 400; line-height: 125%; word-break: break-word; } h3 { color: #000; font-size: 16px; font-weight: 600; line-height: 135%; margin-top: 8px; word-break: break-word; } .creative-container { width: 100%; } .creative-area { border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 4px; padding: 12px; display: flex; flex-direction: column; box-sizing: border-box; overflow: hidden; margin: 0 auto; background-color: #fff; text-decoration: none; color: #000; } .creative-area:hover { cursor: pointer; } .creative-image img { width: 100%; display: block; } .creative-content { display: flex; flex-direction: row; align-items: stretch; justify-content: center; margin-top: 16px; flex-grow: 1; } .creative-copy { display: flex; flex-direction: column; justify-content: center; } .creative-cta { width: 42px; height: 42px; margin-left: 16px; align-self: center; } /* Mobile */ .mobile.creative-container .creative-area{ max-width: 350px; } .mobile .creative-copy { flex-grow: 1; } /* Tablet */ .tablet h1 { font-size: 13px; } .tablet h3 { font-size: 16px; } .tablet.creative-container .creative-area{ flex-direction: row; gap: 16px; justify-content: space-between; max-width: 550px; } .tablet .creative-image img { width: 235px; height: 235px; } .tablet .creative-content { flex-direction: column; margin-top: 4px; flex-grow: 1; } .tablet .creative-cta { margin-top: 14px; margin-left: 0; margin-bottom: 0; align-self: normal; } /* Desktop */ .desktop h1 { font-size: 14px; } .desktop h3 { font-size: 18px; } .desktop.creative-container .creative-area{ max-width: 800px; flex-direction: row; gap: 24px; justify-content: space-between; } .desktop .creative-image img { width: 136px; height: 136px; } .desktop .creative-copy { flex-grow: 1; } .desktop .creative-content { flex-direction: row; margin: 0; /* height: 128px;*/ flex-grow: 1; max-width: unset; } .desktop .creative-cta { margin-top: 0; margin-left: 24px; margin-bottom: 0; align-self: center; } </style> </head> <body> <div class=\"creative-container\"> [tracking_pixel] <a href=\"https://github.com/Automattic/blaze-ad-server-poc\" target=\"_blank\" class=\"creative-area\"> <div class=\"creative-image\"> <img crossorigin=\"anonymous\" src=\"https://thyagotest.wpcomstaging.com/wp-content/uploads/2024/04/DALL·E-2024-04-09-12.29.14-Revise-the-server-room-scene-to-include-racks-of-computers-and-networking-equipment-with-the-soft-blue-and-green-lights-of-server-activity.-This-time.webp\" id=\"imageUrl\" alt=\"image\" /> </div> <div class=\"creative-content\"> <div class=\"creative-copy\"> <h1 class=\"creative-title\" id=\"title\">Hello World! This is Blaze Ad Server</h1> <h3 class=\"creative-snippet\" id=\"snippet\">Blaze Ad Server stands as the premier ad serving solution globally, boasting unparalleled efficiency and reliability.</h3> </div> <div class=\"creative-cta\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"42\" height=\"43\" viewBox=\"0 0 42 43\" fill=\"none\"> <circle cx=\"21\" cy=\"21.5\" r=\"21\" fill=\"#0038FF\" /> <circle cx=\"21\" cy=\"21.5\" r=\"20.5\" stroke=\"#333333\" stroke-opacity=\"0.33\" /> <path d=\"M18 12.5L26.2929 20.7929C26.6834 21.1834 26.6834 21.8166 26.2929 22.2071L18 30.5\" stroke=\"white\" stroke-width=\"1.5\" /> </svg> </div> </div> </a> </div> </body> <script> function fixSizes() { const el = document.getElementsByClassName(\"creative-container\")[0]; const height = el.getBoundingClientRect().height; const maxWidth = getComputedStyle(document.getElementsByClassName(\"creative-area\")[0]).maxWidth; window.parent.postMessage({ type: \"wa-inline-frame\", action: \"resize\", height: height, maxWidth: maxWidth }, \"*\"); const width = el.getBoundingClientRect().width; if(width < 490) { el.classList.remove(\"tablet\", \"desktop\"); el.classList.add(\"mobile\"); } else if( width < 640 ){ el.classList.remove(\"mobile\", \"desktop\"); el.classList.add(\"tablet\"); } else { el.classList.remove(\"mobile\", \"tablet\"); el.classList.add(\"desktop\"); } } fixSizes(); window.setInterval(fixSizes, 100); </script></html>'\\'' />", | |
| "start_at":"2024-04-08T16:00:00.00Z", | |
| "end_at":"2025-04-20T00:00:00.00Z", | |
| "bidding":{ | |
| "price_model":"cpm", | |
| "rate":140 | |
| }, | |
| "daily_budget":1000, | |
| "frequency_capping":10000 | |
| } | |
| ] | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment