{"id":576,"date":"2016-04-13T21:56:18","date_gmt":"2016-04-14T01:56:18","guid":{"rendered":"https:\/\/2016.asheville.wordcamp.org\/?post_type=wcb_session&#038;p=576"},"modified":"2016-06-06T17:28:35","modified_gmt":"2016-06-06T21:28:35","slug":"using-the-rest-api-for-better-responsive-images","status":"publish","type":"wcb_session","link":"https:\/\/asheville.wordcamp.org\/2016\/session\/using-the-rest-api-for-better-responsive-images\/","title":{"rendered":"Using the REST API for Better Responsive Images"},"content":{"rendered":"<p>WordPress 4.4 was a milestone release, with the addition of both responsive images and a REST API. In this session, I&#8217;ll demonstrate API endpoints and JavaScript I&#8217;ve written for using the REST API and AJAX to load responsive background images into sites.<\/p>\n<p>This technique has several advantages: first, using the background-image property is more semantic and powerful than traditional &lt;img\/&gt;s. Second, you can have a dynamic background on an otherwise cached page. Third, you have more information available about how your user is viewing your site than just their viewport width.<\/p>\n<p>The session will include three short demos: First, a basic demonstration of the technique. Second, using array_rand on the server to pull in a random background image. And as a finale, using the ambient light API in OSX Firefox to load in &#8220;day time&#8221; and &#8220;night time&#8221; images.<\/p>\n<p>Take aways:<\/p>\n<ul>\n<li>The addition of responsive images into the WordPress core was powerful, but it doesn&#8217;t solve every problem and isn&#8217;t always semantic.<\/li>\n<li>Using AJAX to load images has many benefits because you can know more about the client.<\/li>\n<li>The WordPress REST API can be used for more than you realize.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>WordPress 4.4 was a milestone release, with the addition of both responsive images and a REST API. In this session, I&#8217;ll demonstrate API endpoints and JavaScript I&#8217;ve written for using the REST API and AJAX to load responsive background images into sites. This technique has several advantages: first, using the background-image property is more semantic &hellip; <a href=\"https:\/\/asheville.wordcamp.org\/2016\/session\/using-the-rest-api-for-better-responsive-images\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Using the REST API for Better Responsive Images<\/span> <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":8712975,"featured_media":0,"template":"","meta":{"_crdt_document":"","jetpack_post_was_ever_published":false,"_wcpt_session_time":1465065900,"_wcpt_session_duration":3000,"_wcpt_session_type":"session","_wcpt_session_slides":"https:\/\/docs.google.com\/presentation\/d\/13Mw-_jK9awxs7fK0JGNwXbNgsBi82FvgVhaMqgQ6RQc\/edit#slide=id.g12f74b6109_0_0","_wcpt_session_video":"","_wcpt_speaker_id":[444],"footnotes":""},"session_track":[5041],"session_category":[],"class_list":["post-576","wcb_session","type-wcb_session","status-publish","hentry","wcb_track-developer"],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p7abZV-9i","session_date_time":{"date":"June 4, 2016","time":"2:45 pm"},"session_speakers":[{"id":"444","slug":"ethan-butler","name":"Ethan Butler","link":"https:\/\/asheville.wordcamp.org\/2016\/speaker\/ethan-butler\/"}],"session_cats_rendered":null,"_links":{"self":[{"href":"https:\/\/asheville.wordcamp.org\/2016\/wp-json\/wp\/v2\/sessions\/576","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/asheville.wordcamp.org\/2016\/wp-json\/wp\/v2\/sessions"}],"about":[{"href":"https:\/\/asheville.wordcamp.org\/2016\/wp-json\/wp\/v2\/types\/wcb_session"}],"author":[{"embeddable":true,"href":"https:\/\/asheville.wordcamp.org\/2016\/wp-json\/wp\/v2\/users\/8712975"}],"version-history":[{"count":6,"href":"https:\/\/asheville.wordcamp.org\/2016\/wp-json\/wp\/v2\/sessions\/576\/revisions"}],"predecessor-version":[{"id":2263,"href":"https:\/\/asheville.wordcamp.org\/2016\/wp-json\/wp\/v2\/sessions\/576\/revisions\/2263"}],"speakers":[{"embeddable":true,"href":"https:\/\/asheville.wordcamp.org\/2016\/wp-json\/wp\/v2\/speakers\/444"}],"wp:attachment":[{"href":"https:\/\/asheville.wordcamp.org\/2016\/wp-json\/wp\/v2\/media?parent=576"}],"wp:term":[{"taxonomy":"wcb_track","embeddable":true,"href":"https:\/\/asheville.wordcamp.org\/2016\/wp-json\/wp\/v2\/session_track?post=576"},{"taxonomy":"wcb_session_category","embeddable":true,"href":"https:\/\/asheville.wordcamp.org\/2016\/wp-json\/wp\/v2\/session_category?post=576"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}