# Technical Guides # Variables From Tags to_Custom_Codes This document explains how to define variables inside ****INS tags**** and ****VAST tags****, and how these variables are accessed inside your ****custom methods****. It also includes syntax, examples, naming conventions, usage flow, and best practices. #### ****1. Overview**** Variables allow you to pass dynamic values from the ****ad tag**** (INS or VAST) directly into your custom code logic. You can control creative behavior such as: - Colors - Text - URLs - Durations - Images & assets - Screen properties - Widget-level properties This helps make creatives dynamic without re-uploading or editing visuals. #### ****2. Variables in INS Tags**** INS tags use the following syntax: data-var-{name}="{value}" ****Rules**** - Replace ****{name}**** with your variable name - Replace ****{value}**** with your desired value - Use lowercase, hyphen-friendly variable names - Add unlimited variables - All variables become available in your custom code ``` ``` How variables appear inside your custom method ```html variables.bgcolor variables.img ``` #### ****3. Variables in VAST Tags**** VAST tags support variables by appending them as query parameters: &var-{name}={value} Example — VAST URL https://example.com/vast.xml?creative=123&placement=45 &var-theme=dark &var-autoplay=true &var-volume=0.5 Inside your custom logic ```javascript variables.theme // "dark" variables.autoplay // "true" variables.volume // "0.5" ``` #### ****4. Accessing Variables Inside Custom Methods**** Below are the steps required to apply tag variables inside your creative. ##### ****4.1 Select “Events” Tab**** ![](https://docs.adctv.com/uploads/images/gallery/2025-12/embedded-image-khcj7vhu.png) ##### ****4.2 Select a Trigger from the List**** ![](https://docs.adctv.com/uploads/images/gallery/2025-12/embedded-image-16hgfhbw.png) ![](https://docs.adctv.com/uploads/images/gallery/2025-12/embedded-image-mdhwotoz.png) ##### ****4.4 Create a New Method**** You can now write your own custom code. ![](https://docs.adctv.com/uploads/images/gallery/2025-12/embedded-image-xmvx5bro.png) ##### ****4.5 Writing Custom Code (Example)**** In this example, the creative uses two components: ****Countdown Timer**** ****Image Component**** The image component has ****no uploaded asset****. Instead, we inject the image ****dynamically**** using a variable from the tag. We use: - img → for image URL - bgcolor → for screen background color ****Accessing variables**** ```html variables.img variables.bgcolor ``` ****Important:**** To apply variables to a specific component, ****select the element by its ID**** first.The widget and screen IDs will visible on custom method codeblocks ![](https://docs.adctv.com/uploads/images/gallery/2025-12/embedded-image-jtpvfmss.png) Sample Custom Code ```html /* Layers and their IDs Screen list Screen 1 = #s10001_14318 Widget list Countdown = #w10006_74144 Image = #w10007_24899 */ let img = document.querySelector("#w10007_24899"); img.children[0].setAttribute("source", variables.img); let screen = document.querySelector("#s10001_14318"); screen.style.background = variables.bgcolor; ``` ##### ****4.6 Save the Custom Event**** ![](https://docs.adctv.com/uploads/images/gallery/2025-12/embedded-image-0kvkwcoo.png) ##### ****4.7 Export the Creative**** ![](https://docs.adctv.com/uploads/images/gallery/2025-12/embedded-image-aaioojn1.png) #### ****5. Updating Variables in the Tag**** Use the exported INS/VAST tag on your domain and append the variables you want to control. These variables will be available inside your custom code through: ```javascript variables.{name} // or variables["{name}"] ``` Example INS Tag with Variables ```javascript ``` ****Variables used**** - data-var-img - data-var-bgcolor ****Preview**** [![variables preview.gif](https://docs.adctv.com/uploads/images/gallery/2025-12/variables-preview.gif)](https://docs.adctv.com/uploads/images/gallery/2025-12/variables-preview.gif) #### ****6. Usage**** Variables make creatives dynamic and reusable ****without modifying the creative****. By simply changing the variables inside the tag, you can deliver different versions instantly. ****This eliminates the need to:**** - Create multiple creatives - Upload separate assets - Manage separate placements - Duplicate analytics Analytics remain ****centralized in a single placement****. #### ****7. What Users Can Do With This**** ##### ****7.1 Update Widget-Specific Properties**** Change component properties using variables: - Text - Colors - Images - Sizes - Timings - Visibility - URLs ##### ****7.2 Create Region-Specific or Partner-Specific Content**** Output variations for different: - Headlines - Offers - CTAs - Images Perfect for large-scale distribution. ##### ****7.3 Enable Real-Time Content Updates**** Marketing teams can change content instantly by editing tag variables. - No rebuild - No re-upload - No developer needed ##### ****7.4 Reduce Operational Overhead**** One creative → unlimited variations Cuts down asset creation time and maintenance. ##### ****7.5 Support Dynamic Personalization**** Variables allow personalization based on: - Domain - Audience segment - Publisher - Geo - Campaign logic Everything becomes adjustable from the tag. # Context Variables #### Overview Context Variables are values describing the user's current environment. They are resolved before the creative is rendered and are available for binding directly in components. Context variables are divided into two categories: - ****Context Variables**** – Values obtained directly from backend services (Geo, Weather, Network, Bot, Time). - ****Advanced Context Variables**** – Values computed from one or more raw context variables. --- #### Variable Categories

Category	Source	Description
Geo	Backend	User location
Weather	Backend	Current weather conditions
Network	Backend	ISP, protocol, RTT
Bot	Backend	Bot detection
Time	Backend	Local time information
Device	Browser	Device characteristics
Viewport	Browser	Viewport dimensions
Derived	Backend	Computed contextual values

--- #### Context Variables #### Geo

Variable	Type	Description
`geo.country`	String	ISO country code
`geo.city`	String	City name
`geo.region`	String	State or region
`geo.lat`	Number	Latitude
`geo.lng`	Number	Longitude
`geo.timezone`	String	IANA timezone

--- #### Weather

Variable	Type	Description
`weather.temp`	Number	Temperature (°C)
`weather.feels_like`	Number	Feels-like temperature
`weather.humidity`	Number	Humidity (%)
`weather.condition`	String	Weather condition
`weather.icon`	String	Icon URL
`weather.text`	String	Description
`weather.is_day`	Boolean	Day/Night
`weather.precip`	Number	Precipitation
`weather.wind_speed`	Number	Wind speed
`weather.uv_index`	Number	UV Index
`weather.visibility`	Number	Visibility
`weather.sunrise`	String	Sunrise
`weather.sunset`	String	Sunset

--- #### Time

Variable	Type	Description
`time.timestamp`	Number	Unix timestamp
`time.hour`	Number	Hour (0–23)
`time.day_of_week`	Number	Day index
`time.timezone`	String	IANA timezone

--- #### Network

Variable	Type	Description
`network.isp`	String	ISP name
`network.asn`	Number	ASN
`network.protocol`	String	HTTP protocol
`network.rtt`	Number	Round-trip time

--- #### Bot

Variable	Type	Description
`bot.score`	Number \| Null	Bot score
`bot.is_bot`	Boolean	Bot detection
`bot.is_corporate_proxy`	Boolean	Corporate proxy

--- ### Advanced Context Variables #### Overview Advanced Context Variables provide higher-level contextual information that creatives can consume directly without implementing business logic. --- #### Weather

Variable	Parameters	Type	Possible Values	Description
`weather.temperature_band`	`temp`	String	`hot` , `warm` , `cold`	Categorizes the current temperature.
`weather.condition_type`	`condition`	String	`sunny` , `cloudy` , `rainy` , `stormy` , `snowy` , `foggy`	Normalizes weather conditions into common categories.
`weather.uv_level`	`uv_index`	String	`low` , `moderate` , `high` , `extreme`	Classifies UV intensity.
`weather.comfort_level`	`temp` , `humidity`	String	`comfortable` , `humid` , `hot_humid` , `cold`	Indicates perceived outdoor comfort.
`weather.wind_level`	`wind_speed`	String	`calm` , `moderate` , `windy` , `stormy`	Categorizes wind intensity.
`weather.is_daylight`	`is_day`	Boolean	`true` , `false`	Indicates whether it is currently daytime.
`weather.precipitation_level`	`precip`	String	`none` , `light` , `moderate` , `heavy`	Classifies precipitation intensity.
`weather.visibility_level`	`visibility`	String	`clear` , `moderate` , `poor`	Categorizes current visibility.
`weather.activity_suitability`	`temp` , `precip` , `uv_index` , `wind_speed`	String	`excellent` , `good` , `poor`	Indicates suitability for outdoor activities.

--- #### Time

Variable	Parameters	Type	Possible Values	Description
`time.daypart`	`hour`	String	`early_morning` , `morning` , `afternoon` , `evening` , `night`	Current part of the day.
`time.is_weekend`	`day_of_week`	Boolean	`true` , `false`	Indicates whether today is Saturday or Sunday.
`time.is_work_hours`	`hour` , `is_weekend`	Boolean	`true` , `false`	Indicates whether current time falls within typical work hours.
`time.is_commuting_hours`	`hour`	Boolean	`true` , `false`	Indicates typical commuting periods.
`time.meal_period`	`hour`	String	`breakfast` , `lunch` , `snack` , `dinner` , `late_night`	Current meal period.
`time.productivity_state`	`hour` , `is_work_hours`	String	`productive` , `relaxed` , `sleeping`	General activity state based on time.

--- #### Network

Variable	Parameters	Type	Possible Values	Description
`network.speed_tier`	`rtt` , `protocol`	String	`fast` , `moderate` , `slow`	Overall network performance classification.
`network.supports_rich_media`	`speed_tier` , `protocol`	Boolean	`true` , `false`	Indicates whether the connection is suitable for rich media.
`network.video_quality_tier`	`speed_tier`	String	`low` , `medium` , `high`	Recommended video quality tier.

--- #### Traffic

Variable	Parameters	Type	Possible Values	Description
`traffic.quality_tier`	`bot_score` , `is_bot` , `is_corporate_proxy`	String	`high` , `medium` , `low`	Overall traffic quality assessment.
`traffic.is_suspicious`	`bot_score` , `is_bot` , `is_corporate_proxy`	Boolean	`true` , `false`	Indicates potentially suspicious traffic.
`traffic.trust_score`	`bot_score` , `is_bot` , `is_corporate_proxy`	Number	`0–100`	Numeric trust score for the request.

--- #### Audience

Variable	Parameters	Type	Possible Values	Description
`audience.outdoor_score`	`temp` , `precip` , `uv_index` , `wind_speed` , `is_daylight`	Number	`0–100`	Indicates how suitable current conditions are for outdoor activity.
`audience.outdoor_likelihood`	`outdoor_score`	String	`high` , `medium` , `low`	Likelihood that the user is outdoors.
`audience.commerce_intent`	`hour` , `is_weekend` , `is_work_hours` , `daypart` , `temp` , `precip` , `condition_type`	String	`high` , `medium` , `low`	Estimated shopping intent.
`audience.engagement_likelihood`	`quality_tier` , `speed_tier` , `daypart` , `is_work_hours`	String	`high` , `medium` , `low`	Estimated likelihood of interacting with the creative.
`audience.mobility_state`	`hour` , `is_weekend` , `is_work_hours` , `daypart` , `activity_suitability`	String	`sleeping` , `commuting` , `working` , `leisure` , `stationary`	Estimated current mobility state.
`audience.session_mood`	`daypart` , `is_work_hours` , `is_weekend` , `mobility_state` , `condition_type`	String	`productive` , `relaxed` , `entertainment` , `rushed`	Estimated user mindset.
`audience.purchase_context`	`daypart` , `is_work_hours` , `is_weekend` , `mobility_state` , `condition_type`	String	`impulse` , `relaxed` , `functional`	Estimated purchasing context.

--- #### Device

Variable	Parameters	Type	Possible Values	Description
`device.rich_media_ready`	`speed_tier` , `trust_score`	Boolean	`true` , `false`	Indicates whether the device and connection are suitable for rich media experiences.
`device.experience_tier`	`speed_tier` , `trust_score` , `quality_tier` , `rich_media_ready`	String	`premium` , `standard` , `lite`	Recommended creative experience tier.

--- #### Media

Variable	Parameters	Type	Possible Values	Description
`media.video_quality`	`speed_tier` , `video_quality_tier`	String	`240p` , `480p` , `720p` , `1080p`	Recommended maximum video resolution for the current connection.