{"id":1206,"date":"2020-05-01T15:24:31","date_gmt":"2020-05-01T15:24:31","guid":{"rendered":"http:\/\/jggdev.com\/?p=1206"},"modified":"2020-05-01T15:28:38","modified_gmt":"2020-05-01T15:28:38","slug":"weather-image-for-actiontiles","status":"publish","type":"post","link":"https:\/\/jggdev.com\/?p=1206","title":{"rendered":"Weather Image for ActionTiles"},"content":{"rendered":"\n<p><strong><span style=\"color:#ff0008\" class=\"has-inline-color\">These image generators are now available directly from the ActionTiles cloud. Links below have been updated accordingly.\u00a0\u00a0<\/span><\/strong><\/p>\n\n\n\n<p><strong>Introduction<\/strong><\/p>\n\n\n\n<p>ActionTiles is a great interface for managing and controlling SmartThings. Having previously created a&nbsp;<a href=\"http:\/\/web.archive.org\/web\/20190706130531\/https:\/\/jggdev.com\/2017\/05\/23\/calendar-image-for-actiontiles\/\" target=\"_blank\" rel=\"noreferrer noopener\">webpage that delivered a calendar image f<\/a>or use&nbsp;in ActionTiles I thought I\u2019d have a go at creating some more \u2018dynamic\u2019 images. &nbsp;Below are details for a&nbsp;Weather image.&nbsp; The dynamic image&nbsp;can be found at&nbsp;<a href=\"http:\/\/web.archive.org\/web\/20190706130531\/https:\/\/mtg.actiontiles.com\/weather.php\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/mtg.actiontiles.com\/weather.php<\/a><\/p>\n\n\n\n<p>Although it has a php extension the page returns a PNG image.<\/p>\n\n\n\n<p><strong>Parameters \/ Customising the look<\/strong><\/p>\n\n\n\n<p>Users can pass formatting options as URL parameters to override the default format. &nbsp;For example:<\/p>\n\n\n\n<p><a href=\"https:\/\/mtg.actiontiles.com\/weather.php?backgroundColor=FFFFFF&amp;bodyColor=00FF00&amp;titleColor=000000\">https:\/\/mtg.actiontiles.com\/weather.php?backgroundColor=FFFFFF&amp;bodyColor=00FF00&amp;titleColor=000000<\/a><\/p>\n\n\n\n<p>Colors are entered as&nbsp;<a href=\"http:\/\/web.archive.org\/web\/20190706130531\/http:\/\/www.color-hex.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">hex values<\/a>&nbsp;(without the # symbol \u2013 using a # symbol will cause formatting requests to be ignored). The above sets the background color to white, the body color (the weather details) to green and the title (location name) color to black. &nbsp;The full list of parameters is shown below.<\/p>\n\n\n\n<ul><li><em>layout \u2013<\/em>&nbsp;The size\/proportion of the tile. Matches ActionTiles values. Valid values are 1\u00d71, 1\u00d72, 1\u00d73, 2\u00d71, 2\u00d72, 2\u00d73, 3\u00d71, 3\u00d72, 3\u00d73 &nbsp;(3\u00d72 is default).<\/li><li><em>backgroundColor<\/em>&nbsp;\u2013 the background color of the image.<\/li><li><em>titleColor<\/em>&nbsp;\u2013 the color of the title containing the location name.<\/li><li><em>bodyColor<\/em>&nbsp;\u2013 the color of the text and icons showing the weather forecast.<\/li><li><em>loc \u2013&nbsp;<\/em>the location for which you want the weather. &nbsp;Accepts zip\/postal codes and city\/town names. It is recommended that you use a country code (see below) if outside of USA.<\/li><li><em>country<\/em>&nbsp;\u2013 the country of the location. This is given as a two letter ISO code. See&nbsp;<a href=\"http:\/\/web.archive.org\/web\/20190706130531\/http:\/\/www.nationsonline.org\/oneworld\/country_code_list.htm\">http:\/\/www.nationsonline.org\/oneworld\/country_code_list.htm<\/a>.<\/li><li><em>units<\/em>&nbsp;\u2013 whether to show temperature in metric or imperial units. &nbsp;Acceptable values are&nbsp;<em>metric<\/em>&nbsp;and&nbsp;<em>imperial<\/em>.&nbsp;Imperial is default.<\/li><li><em>static<\/em>&nbsp;\u2013 (valid values \u2013 true or false) by default the image will \u2018page\u2019 through an extended forecast. &nbsp;If you wish to have the image fix on the first \u2018page\u2019 of the forecast use static=true. False is default.<\/li><\/ul>\n\n\n\n<p><strong>Adding To ActionTiles<\/strong><\/p>\n\n\n\n<p>Once you have determined the exact formatting that you wish to use, copy the URL including parameters and then:<\/p>\n\n\n\n<ol><li>Go to&nbsp;<a href=\"http:\/\/web.archive.org\/web\/20190706130531\/https:\/\/app.actiontiles.com\/media#panels\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/app.actiontiles.com\/media#panels<\/a>&nbsp;(you must have an account and be logged in to view this page)<\/li><li>Click on the Plus symbol in the bottom-right-hand corner of the screen to add new media.<\/li><li>Select \u2018This Media is a still image or GIF\u2019<\/li><li>Enter the URL in the URL field.<\/li><li>Enter a refresh rate, if desired. &nbsp;We recommend every hour which would be a value of 3600 seconds. &nbsp;We strongly request that you don\u2019t refresh more regularly than every 900 seconds.<\/li><\/ol>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>These image generators are now available directly from the ActionTiles cloud. Links below have been updated accordingly.\u00a0\u00a0 Introduction ActionTiles is a great interface for managing and controlling SmartThings. Having previously created a&nbsp;webpage that delivered a calendar image for use&nbsp;in ActionTiles I thought I\u2019d have a go at creating some more \u2018dynamic\u2019 images. &nbsp;Below are details&hellip;&nbsp;<a href=\"https:\/\/jggdev.com\/?p=1206\" rel=\"bookmark\">Read More &raquo;<span class=\"screen-reader-text\">Weather Image for ActionTiles<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"off","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","_themeisle_gutenberg_block_has_review":false,"footnotes":""},"categories":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/jggdev.com\/index.php?rest_route=\/wp\/v2\/posts\/1206"}],"collection":[{"href":"https:\/\/jggdev.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jggdev.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jggdev.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jggdev.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1206"}],"version-history":[{"count":2,"href":"https:\/\/jggdev.com\/index.php?rest_route=\/wp\/v2\/posts\/1206\/revisions"}],"predecessor-version":[{"id":1210,"href":"https:\/\/jggdev.com\/index.php?rest_route=\/wp\/v2\/posts\/1206\/revisions\/1210"}],"wp:attachment":[{"href":"https:\/\/jggdev.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1206"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jggdev.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1206"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jggdev.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1206"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}