{"id":116,"date":"2014-06-19T05:43:33","date_gmt":"2014-06-19T05:43:33","guid":{"rendered":"http:\/\/html5box.com\/blog\/?p=116"},"modified":"2014-06-19T05:43:33","modified_gmt":"2014-06-19T05:43:33","slug":"how-to-make-the-gallery-responsive","status":"publish","type":"post","link":"https:\/\/html5box.com\/blog\/responsive-jquery-gallery\/how-to-make-the-gallery-responsive\/","title":{"rendered":"How to make the gallery responsive"},"content":{"rendered":"<p><strong>Question<\/strong>:<\/p>\n<p>You seem to have a unique gallery that will do exactly what I need. One of the things mentioned on your site is that it is responsive. The page on your site that I want to emulate is:<\/p>\n<p><a href=\"http:\/\/html5box.com\/html5gallery\/demo_mediacenter.php\" target=\"_blank\">http:\/\/html5box.com\/html5gallery\/demo_mediacenter.php<\/a><\/p>\n<p>but this isn\u2019t responsive.<\/p>\n<p>What I want to achieve with your gallery:<\/p>\n<p>There has a video container at the top with potentially unlimited rows of three thumbs under, that break to a single column on mobile devices.<\/p>\n<p>So the question is, if I buy a licence will I be able to make your gallery responsive and style it to look identical to my test page.<\/p>\n<p><strong>Answer<\/strong>:<\/p>\n<p>Yes, you can achieve that with HTML5 Gallery.<\/p>\n<p>The reason <a href=\"http:\/\/html5box.com\/html5gallery\/demo_mediacenter.php\" target=\"_blank\">http:\/\/html5box.com\/html5gallery\/demo_mediacenter.php<\/a> is not responsive is because our website itself is not responsive.<\/p>\n<p>You just need to add the following data tag to your DIV, then the gallery will be responsive. Of course, your website itself must be responsive too.<\/p>\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\r\ndata-responsive=&quot;true&quot;\r\n<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Question: You seem to have a unique gallery that will do exactly what I need. One of the things mentioned on your site is that it is responsive. The page on your site that I want to emulate is: http:\/\/html5box.com\/html5gallery\/demo_mediacenter.php but this isn\u2019t responsive. What I want to achieve with your gallery: There has a &hellip; <a href=\"https:\/\/html5box.com\/blog\/responsive-jquery-gallery\/how-to-make-the-gallery-responsive\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">How to make the gallery responsive<\/span> <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9],"tags":[],"class_list":["post-116","post","type-post","status-publish","format-standard","hentry","category-responsive-jquery-gallery"],"_links":{"self":[{"href":"https:\/\/html5box.com\/blog\/wp-json\/wp\/v2\/posts\/116","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/html5box.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/html5box.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/html5box.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/html5box.com\/blog\/wp-json\/wp\/v2\/comments?post=116"}],"version-history":[{"count":1,"href":"https:\/\/html5box.com\/blog\/wp-json\/wp\/v2\/posts\/116\/revisions"}],"predecessor-version":[{"id":117,"href":"https:\/\/html5box.com\/blog\/wp-json\/wp\/v2\/posts\/116\/revisions\/117"}],"wp:attachment":[{"href":"https:\/\/html5box.com\/blog\/wp-json\/wp\/v2\/media?parent=116"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/html5box.com\/blog\/wp-json\/wp\/v2\/categories?post=116"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/html5box.com\/blog\/wp-json\/wp\/v2\/tags?post=116"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}