Department for Environment, Food and Rural Affairs How to Embed UK-AIR Forecasts in your website (http://uk-air.defra.gov.uk/forecasting/forecastembed) Date in format: June 2013 Contents Purpose ............................................................................................................................... 1 Functions ............................................................................................................................. 1 Instructions .......................................................................................................................... 1 Purpose This Beta development currently in evaluation allows users to embed up to date forecasts into their own websites, tailored towards specific regions if required. The plug-in is aimed at making it easier for forecast information to be disseminated to a wider audience, and to increase the profile of UK air pollution forecasts. Functions All the options come with a link to the UK-AIR website for further information and data. Where forecast pollution levels are given, a direct link to health advice and full forecasting summaries is also provided. There are three different sizes of plug-in available, to allow you to tailor the forecast to the style and space requirements of your website. Instructions The options are summarised in the table from the webpage illustrated below. The table defines the plug-in selections available on the website. A worked example of how to create a plug-in is given below. Step 1 – Select the options required To embed the latest UK air pollution forecast in webpages, users should first select the required size and detail of plug-in from the table as shown above (examples of each are shown at the end of this guide). Step 2 – Register for Updates Then select the region required, by allowing the website to detect it automatically or by ticking the default box, as shown below, for a full UK map. An email address is required to 1 allow you to be contacted if any upgrades to the site are released. This will not be shared with any third parties under any circumstances. Step 3 – Create the HTML code By clicking the Create HTML code to embed button, an HTML code is created based on the users selections above, as shown. Step 4- Save the code To preview the code you can copy and paste it into Notepad. Open a new, blank notepad document and paste in the generated code from the Your code box. Add <html> To the front of the code, and </html> to the end. This then needs to be saved as an .html file. To do this go to save as, select All Files (*.*) from the save type and add .html to the file name as shown. 2 Step 5 – Preview and Testing The html file saved under step 4 can then be opened in your browser or word for preview and testing of the plug-in functionality. The example forecast plug-in created in this worked example is a large map for the whole of the UK as illustrated in the figure below. By clicking on any region you will get a more detailed forecast for that region, in the same format as the Slim plug-in, illustrated for the South West region below. Examples of the two other available plug-ins, Slim and Button are shown to the right. Clockwise from Right, Button plug in, Slim for North East and the regional output for the South West from the worked example. 3 Step 6 - Implementation To add the code to a website it will need to be copied and then given to the respective webmaster to be added to the relevant page. For more help please contact the developers by email through [email protected]. 4 © Crown copyright [2013] You may re-use this information (not including logos) free of charge in any format or medium, under the terms of the Open Government Licence. To view this licence, visit www.nationalarchives.gov.uk/doc/open-government-licence/ or write to the Information Policy Team, The National Archives, Kew, London TW9 4DU, or e-mail: [email protected] This document/publication is also available on our website at: http://uk-air.defra.gov.uk/forecasting/forecast-embed Any enquiries regarding this document/publication should be sent to us at: [email protected] 5