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

  
<script  type="text/javascript"  charset="utf-8">  
	(function  (w,  d,  t,  f)  {  
		w[f]  =  w[f]  ||  function  (c,  k,  n)  {  
			s  =  w[f],  k  =  s['k']  =  (s['k']  ||  (k  ?  ('&k='  +  k)  :  ''));  s['c']  =  
				c  =  (c  instanceof  Array)  ?  c  :  [c];  s['n']  =  n  =  n  ||  0;  L  =  d.createElement(t),  e  =  d.getElementsByTagName(t)[0];  
			L.async  =  1;  L.src  =  '//feed.aqicn.org/feed/'  +  (c[n].city)  +  '/'  +  (c[n].lang  ||  '')  +  '/feed.v1.js?n='  +  n  +  k;  
			e.parentNode.insertBefore(L,  e);  
		};  
	})(window,  document,  'script',  '_aqiFeed');    
</script>

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

  
<span  id="city-aqi-container"></span>  
  
<script  type="text/javascript"  charset="utf-8">  
	_aqiFeed({  container:  "city-aqi-container",  city:  "beijing"  });  
</script>

تابع «_aqiFeed» بلوک پیکربندی ویجت را به عنوان آرگومان می گیرد. پارامتر "container: "city-aqi-container"" به شناسه برچسبی که می‌خواهید ویجت را در آن درج کنید اشاره دارد (به عنوان مثال `<span id='city-aqi-container'></span>`)، و پارامتر city نام شهری است که می‌خواهید میزان فعلی کیفیت هوا را برای آن نشان دهید (به عنوان مثال «شهر: «لندن»).

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

  
_aqiFeed({  
	container:"city-aqi-container",  
	city:"beijing",  
	lang:"cn"  
});  

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

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

  
_aqiFeed({    
	display:"%cityname  AQI  is  %aqi<br><small>on  %date</small>",  
	container:"city-aqi-container-display",    
	city:"beijing"  
});  

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 نمایش داده می شود).

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

اگر ادغام DIY را ترجیح می دهید، همچنین می توانید یک فراخوانی تابع جاوا اسکریپت را مشخص کنید که هنگام بارگیری داده ها باشد. شما فقط باید گزینه callback را در بلوک پارامتر اضافه کنید، به عنوان مثال:

  
_aqiFeed({  city:"beijing",  callback:function(aqi){  
	/*  Do  whatever  you  want  with  the  AQI  object  */  
	console.log(aqi);    
}  });

به عنوان مثال، با فرض اینکه از jquery نیز استفاده می کنید، کد زیر را در نظر بگیرید:

  
<div  id='my-container'></div>  
<script  type="text/javascript"  charset="utf-8">  
	_aqiFeed({  
		city:  "beijing",  lang:  "pl",  callback:  function  (aqi)  {  
			$("#my-container").html(aqi.details);  
		}  
	});  
</script>

محتوای زیر را تولید خواهد کرد:

اشیاء aqi شامل کلیه کلمات کلیدی ذکر شده در بخش C (فرمت نمایش) می باشد.

گنجاندن چندین ویجت در یک صفحه امکان پذیر است. تنها چیزی که نیاز دارید این است که آرایه ای را با تمام ویجت هایی که باید در آن قرار دهید به تابع `_aqiFeed` منتقل کنید. به عنوان مثال، برای درج لندن، پاریس و نیویورک، می توانید از این کد استفاده کنید:

  
var  cities  =  ["london",  "newyork",  "seoul",  "guangzhou",  "tokyo",  "shanghai",  "paris","hongkong"];  
  
var  aqiWidgetConfig  =  [];    
cities.forEach(function(city)  {  aqiWidgetConfig.push({city:city,  callback:  displayCity});  });  
_aqiFeed(aqiWidgetConfig);  
  
function  displayCity(aqi)  {  
	$("#mutiple-city-aqi").append(aqi.text("<center>%cityname<br>%aqi<br><small>%date</small></center>"));  
}  

این فید ویجت به صورت رایگان و صرفاً با هدف ادغام فید در سایر وب‌سایت‌ها (یعنی برنامه‌ها مستثنی هستند) و به شرط استفاده معقول و قابل قبول ارائه می‌شود. ما حق تغییر ساختار فید (فرمت داده) را در هر زمان و بدون اطلاع قبلی محفوظ می داریم، بنابراین اگر قصد دارید یکپارچه سازی سفارشی انجام دهید، بهتر است با ما تماس بگیرید.

هنگام انجام ادغام، قوانین عمقی کمی وجود دارد که باید هنگام استفاده از خوراک داده اعمال شوند:

• اول، همیشه مطمئن شوید که انتساب به EPA مبدا وجود دارد. تمام داده‌های کیفیت هوا که می‌توانید در پروژه شاخص کیفیت هوای جهانی بیابید به لطف کار سخت همه سازمان‌های حفاظت محیط زیست در سرتاسر جهان است، بنابراین لطفاً مطمئن شوید که برای کار آنها نیز ذکر شده است. اگر از API برنامه‌ریزی شده استفاده می‌کنید، انتساب از قسمت attribution در دسترس است.
• اگر از مؤسسه ای هستید و از داده ها استفاده می کنید، لطفاً احترام بگذارید و اعتبار کار ما را پس دهید. اگر می‌خواهید فید داده‌ها را حذف کنید، لطفاً به خاطر داشته باشید که این پروژه به پروژه‌های حمایت مالی و همکاری متکی است، بنابراین به جای حذف ما از ما حمایت کنید ، به خصوص اگر مؤسسه یا دانشگاهی در مقیاس بزرگ هستید.
• در واقع، مانند WRI ( موسسه منابع جهانی ) عمل نکنید: فید داده‌های پروژه شاخص کیفیت هوای جهانی را از بین می‌برند و آنقدر ارزان هستند که حتی برای کار ما هیچ گونه انتسابی نمی‌دهند، و این با وجود 80 میلیون دلار بودجه سالانه ما را باور نمی کنید؟ این عکس فوری را بررسی کنید.

این اولین نسخه از این API فید ویجت جدید است. در حال حاضر چند پیشرفت در خط لوله وجود دارد، مانند عرض و ارتفاع گرافیکی قابل تنظیم، مقیاس AQI قابل انتخاب، و غیره.