Getting Started

Getting started with AerisWeather WeatherBlox is as simple as signing up for a free developer account and adding a few lines of HTML / CSS to your website. With the following steps you can quickly add WeatherBlox to your site today:

Step 1: Sign up for an AerisWeather API subscription service and setup your access keys as described in our AerisWeather API’s getting started guide. We offer a free developer account for you to give our weather API a test drive.

Step 2: Decide on your method of integration, either front-end using JavaScript, or backend using our PHP package.

Step 3: Review the library of available WeatherBlox views and layouts and their supported configuration/usage options.

Step 4: Integrate your selected blox into your application using the frontend or backend method.

Example View Integration

The following example demonstrates how you would add a 5-day weather forecast to your page using the frontend/JavaScript method:

[example]

<link href="https://cdn.aerisapi.com/wxblox/latest/aeris-wxblox.css" rel="stylesheet" />
<script src="https://cdn.aerisapi.com/wxblox/latest/aeris-wxblox.min.js"></script>

<!-- designate the view's target element -->
<div id="local-forecast"></div>

<script type="text/javascript">

// configure Aeris API access keys
const aeris = new AerisWeather('CLIENT_ID', 'CLIENT_SECRET');

// wait for the WeatherBlox library to be fully loaded and set up
aeris.on('ready', () => {

     // set widget variable
     var localForecast = new aeris.wxblox.views.Forecast('#local-forecast');

     // set API request parameters to be used when requesting data
     var params = { 
          p: ':auto',
          limit: 5
     };

     // load and render the view
     localForecast.load(params);
});

</script>

Client-Side vs Server-Side Integration

AerisWeather's WeatherBlox supports both JavaScript and API (server-side) integrations. Each method has its benefits depending on your application’s requirements and level of customization:

Last modified: June 18, 2021