استفاده از یک اسکریپت واحد:

یا با استفاده از iframe:

همچنین می‌توانید هنگام استفاده از اسکریپت، یک شناسه کانتینر («div» id) تعیین کنید:

<div id='widget1' style='text-align: center'></div>

ادغام اولیه ساده و مستقیم است. ابتدا باید کد زیر را اضافه کنید:

<script  src='https://aqicn.org/widgets/js/waqi-feed.v1.js'></script>

سپس، فقط این کد دیگر را برای اضافه کردن ویجت اضافه کنید:

تابع `_waqiFeed` پیکربندی ویجت را به عنوان آرگومان می گیرد. فقط باید ایستگاه و سبک نمایش ویجت ( size ) را تعریف کنید. این چیزی است که تولید می کند:

همچنین می‌توانید شناسه کانتینر («div» id) را که در آن ویجت باید نشان داده شود را مشخص کنید:

<div id='widget2' style='text-align: center;border: 1px dashed #ccc;'></div>

فرمت نمایش را می توان با تغییر پارامتر size به یکی از موارد زیر تغییر داد:

با تعیین گزینه display ، می توان متنی را که در ویجت نمایش داده می شود، سفارشی کرد. به عنوان مثال، برای نمایش با نام متنی "AQI" و همچنین زمان به روز رسانی (همانطور که در ویجت سمت چپ نشان داده شده است)، می توانید از کد زیر استفاده کنید:

_waqiFeed({    
	display:"%cityname  AQI  is  <span  style='%style'>%impact  (%aqiv)</span>  <small>on  %date</small>",  
	station:"A373120"  
});  

display پارامتر یک رشته مبتنی بر HTML است و می تواند حاوی هر یک از کلمات کلیدی زیر باشد:

• «% cityname» برای نام شهر (مثلاً Beijing )،
• «%aqi» برای مقدار AQI تزئین شده (به عنوان مثال 58 )،
• «%aqiv» برای مقدار AQI بدون تزئین (متن خام) (مثلاً 58 )،
• «%style» برای اعلان css جزئیات AQI تزئین شده (به عنوان مثال background-color: #ffde33;color:#000000; )،
• «%date» برای زمانی که AQI به‌روزرسانی شد (مثلا Wed 20:00 )،
• «% تأثیر» برای تأثیر سلامت مرتبط (مثلاً Good ، Moderate ...)
• «%attribution» برای انتساب داده های AQI (مثلاً Beijing Environmental Protection Monitoring Center )
• `%details` برای جزئیات کامل AQI (محتوای پنجره بازشو که هنگام حرکت ماوس روی مقدار AQI نمایش داده می شود).

در اینجا چند نمونه هستند:

همچنین می توانید زبان مورد استفاده را با تنظیم گزینه lang مشخص کنید. به عنوان مثال، برای گنجاندن ویجت به زبان چینی (همانطور که در سمت راست نشان داده شده است)، از کد زیر استفاده کنید:

زبان های پشتیبانی شده در حال حاضر عبارتند از:

برای مشاهده کد مربوطه روی هر یک از ویجت های زیر کلیک کنید: