Customization
Injecting HTML

Injecting HTML

You may need to inject your own custom HTML content inside of a WeatherBlox view or layout, such as inserting ads or other analytics content. Inserting your custom HTML into a WeatherBlox view is simple by using JavaScript for prepending or appending your HTML content into an existing DOM element within a rendered view or layout. Note that you will need to insert your HTML within an event handler for the view's render:done event:

const $ = aeris.wxblox.$;
const view = new aeris.wxblox.layouts.local.Main(target);
view.on('render:done', function(e) {
    $('.awxb-view-obs .obs').append('<div>This is just an custom content block area.</div>');
});
view.load({
    p: 'seattle,wa'
});

The WeatherBlox library exposes its internal DOM selector utility via the Aeris.wxblox.$ property that functions similarly to jQuery for you to use to select and insert HTML content. Alternatively, you can use jQuery or your method of choice for accessing and manipulating the DOM.