{"id":367,"date":"2015-03-25T23:24:31","date_gmt":"2015-03-25T23:24:31","guid":{"rendered":"http:\/\/razonartificial.com\/themes\/reason-wp\/?page_id=367"},"modified":"2015-03-25T23:24:31","modified_gmt":"2015-03-25T23:24:31","slug":"thumbnails","status":"publish","type":"page","link":"http:\/\/re-test.ru\/?page_id=367","title":{"rendered":"Thumbnails"},"content":{"rendered":"<section class=\"css-section\">\n<h2 class=\"section-title no-margin-top\">Simple Thumbnails<\/h2>\n<div class=\"row\">\n<div class=\"col-xs-6 col-md-4\">\n                    <a href=\"#\" class=\"thumbnail\"><br \/>\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w7.jpg\" alt=\"...\"><br \/>\n                    <\/a>\n                  <\/div>\n<div class=\"col-xs-6 col-md-4\">\n                    <a href=\"#\" class=\"thumbnail\"><br \/>\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w8.jpg\" alt=\"...\"><br \/>\n                    <\/a>\n                  <\/div>\n<div class=\"col-xs-6 col-md-4\">\n                    <a href=\"#\" class=\"thumbnail\"><br \/>\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w9.jpg\" alt=\"...\"><br \/>\n                    <\/a>\n                  <\/div>\n<div class=\"col-xs-6 col-md-4\">\n                    <a href=\"#\" class=\"thumbnail\"><br \/>\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w10.jpg\" alt=\"...\"><br \/>\n                    <\/a>\n                  <\/div>\n<div class=\"col-xs-6 col-md-4\">\n                    <a href=\"#\" class=\"thumbnail\"><br \/>\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w11.jpg\" alt=\"...\"><br \/>\n                    <\/a>\n                  <\/div>\n<div class=\"col-xs-6 col-md-4\">\n                    <a href=\"#\" class=\"thumbnail\"><br \/>\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w12.jpg\" alt=\"...\"><br \/>\n                    <\/a>\n                  <\/div>\n<\/p><\/div>\n<p>                <!-- Panel Code --><\/p>\n<div class=\"panel panel-default\">\n<div class=\"panel-heading panel-heading-link\">\n                        <a data-toggle=\"collapse\" data-parent=\"#accordion\" href=\"#collapse1\" class=\"collapsed\"><i class=\"fa fa-terminal\"><\/i> Show Code<\/a>\n                    <\/div>\n<div id=\"collapse1\" class=\"panel-collapse collapse\">\n<div class=\"panel-body panel-body-no-padding\">\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\n&lt;a href=&quot;#&quot; class=&quot;thumbnail&quot;&gt;\n&lt;img src=&quot;...&quot; alt=&quot;...&quot;&gt;\n&lt;\/a&gt;\n                            <\/pre>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- panel show code --><\/p>\n<h2 class=\"section-title\">Round Thumbnails<\/h2>\n<div class=\"row\">\n<div class=\"col-xs-6 col-md-3\">\n                    <a href=\"#\" class=\"thumbnail thumbnail-round\"><br \/>\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w4.jpg\" alt=\"...\"><br \/>\n                    <\/a>\n                  <\/div>\n<div class=\"col-xs-6 col-md-3\">\n                    <a href=\"#\" class=\"thumbnail thumbnail-round\"><br \/>\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w8.jpg\" alt=\"...\"><br \/>\n                    <\/a>\n                  <\/div>\n<div class=\"col-xs-6 col-md-3\">\n                    <a href=\"#\" class=\"thumbnail thumbnail-round\"><br \/>\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w1.jpg\" alt=\"...\"><br \/>\n                    <\/a>\n                  <\/div>\n<div class=\"col-xs-6 col-md-3\">\n                    <a href=\"#\" class=\"thumbnail thumbnail-round\"><br \/>\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w6.jpg\" alt=\"...\"><br \/>\n                    <\/a>\n                  <\/div>\n<\/p><\/div>\n<p>                <!-- Panel Code --><\/p>\n<div class=\"panel panel-default\">\n<div class=\"panel-heading panel-heading-link\">\n                        <a data-toggle=\"collapse\" data-parent=\"#accordion\" href=\"#collapse2\" class=\"collapsed\"><i class=\"fa fa-terminal\"><\/i> Show Code<\/a>\n                    <\/div>\n<div id=\"collapse2\" class=\"panel-collapse collapse\">\n<div class=\"panel-body panel-body-no-padding\">\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\n&lt;a href=&quot;#&quot; class=&quot;thumbnail thumbnail-round&quot;&gt;\n&lt;img src=&quot;...&quot; alt=&quot;...&quot;&gt;\n&lt;\/a&gt;\n                            <\/pre>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- panel show code --><\/p>\n<h2 class=\"section-title\">Thumbnails caption<\/h2>\n<div class=\"row\">\n<div class=\"col-sm-6 col-md-4\">\n<div class=\"thumbnail\">\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w10.jpg\" alt=\"...\"><\/p>\n<div class=\"caption\">\n<h3>Thumbnail label<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem, repellat, vitae porro ex expedita cumque nulla velit consequuntur recusandae animi.<\/p>\n<p><a href=\"#\" class=\"btn btn-ar btn-primary\" role=\"button\">Button<\/a> <a href=\"#\" class=\"btn btn-ar btn-default\" role=\"button\">Button<\/a><\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"col-sm-6 col-md-4\">\n<div class=\"thumbnail\">\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w11.jpg\" alt=\"...\"><\/p>\n<div class=\"caption\">\n<h3>Thumbnail label<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Distinctio, repudiandae, possimus autem delectus consequatur minima ducimus odit rem fugit.<\/p>\n<p><a href=\"#\" class=\"btn btn-ar btn-primary\" role=\"button\">Button<\/a> <a href=\"#\" class=\"btn btn-ar btn-default\" role=\"button\">Button<\/a><\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"col-sm-6 col-md-4\">\n<div class=\"thumbnail\">\n                      <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w12.jpg\" alt=\"...\"><\/p>\n<div class=\"caption\">\n<h3>Thumbnail label<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iure, repudiandae expedita natus eaque magnam tempore saepe delectus perferendis atque.<\/p>\n<p><a href=\"#\" class=\"btn btn-ar btn-primary\" role=\"button\">Button<\/a> <a href=\"#\" class=\"btn btn-ar btn-default\" role=\"button\">Button<\/a><\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p>                <!-- Panel Code --><\/p>\n<div class=\"panel panel-default\">\n<div class=\"panel-heading panel-heading-link\">\n                        <a data-toggle=\"collapse\" data-parent=\"#accordion\" href=\"#collapse3\" class=\"collapsed\"><i class=\"fa fa-terminal\"><\/i> Show Code<\/a>\n                    <\/div>\n<div id=\"collapse3\" class=\"panel-collapse collapse\">\n<div class=\"panel-body panel-body-no-padding\">\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\n&lt;div class=&quot;thumbnail&quot;&gt;\n&lt;img src=&quot;..&quot; alt=&quot;...&quot;&gt;\n&lt;div class=&quot;caption&quot;&gt;\n&lt;h3&gt;Thumbnail label&lt;\/h3&gt;\n&lt;p&gt;...&lt;\/p&gt;\n&lt;\/div&gt;\n&lt;\/div&gt;\n                            <\/pre>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- panel show code --><\/p>\n<h2 class=\"section-title\">Thumbnails hover caption<\/h2>\n<div class=\"row\">\n<div class=\"col-md-4\">\n<div class=\"img-caption-ar\">\n                            <img src=\"..\/assets\/js\/holder.js\/100%x200\/sky\" class=\"img-responsive\" alt=\"Image\"><\/p>\n<div class=\"caption-ar\">\n<div class=\"caption-content\">\n                                    <a href=\"#\" class=\"animated fadeInDown\"><i class=\"fa fa-search\"><\/i>More info<\/a><\/p>\n<h4 class=\"caption-title\">Title Caption<\/h4>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"col-md-4\">\n<div class=\"img-caption-ar\">\n                            <img src=\"..\/assets\/js\/holder.js\/100%x200\/lava\" class=\"img-responsive\" alt=\"Image\"><\/p>\n<div class=\"caption-ar\">\n<div class=\"caption-content\">\n<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nam, quas<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"col-md-4\">\n<div class=\"img-caption-ar\">\n                            <img src=\"..\/assets\/js\/holder.js\/100%x200\/vine\" class=\"img-responsive\" alt=\"Image\"><\/p>\n<div class=\"caption-ar\">\n<div class=\"caption-content\">\n<h4 class=\"caption-title\">Title Caption<\/h4>\n<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illo, repellendus?<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p>                <!-- Panel Code --><\/p>\n<div class=\"panel panel-default\">\n<div class=\"panel-heading panel-heading-link\">\n                        <a data-toggle=\"collapse\" data-parent=\"#accordion\" href=\"#collapse4\" class=\"collapsed\"><i class=\"fa fa-terminal\"><\/i> Show Code<\/a>\n                    <\/div>\n<div id=\"collapse4\" class=\"panel-collapse collapse\">\n<div class=\"panel-body panel-body-no-padding\">\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\n&lt;div class=&quot;img-caption-ar&quot;&gt;\n&lt;img src=&quot;...&quot; class=&quot;img-responsive&quot; alt=&quot;Image&quot;&gt;\n&lt;div class=&quot;caption-ar&quot;&gt;\n&lt;div class=&quot;caption-content&quot;&gt;\n    &lt;a href=&quot;#&quot; class=&quot;animated fadeInDown&quot;&gt;&lt;i class=&quot;fa fa-search&quot;&gt;&lt;\/i&gt;More info&lt;\/a&gt;\n    &lt;h4 class=&quot;caption-title&quot;&gt;Title Caption&lt;\/h4&gt;\n&lt;\/div&gt;\n&lt;\/div&gt;\n&lt;\/div&gt;\n\n&lt;div class=&quot;img-caption-ar&quot;&gt;\n&lt;img src=&quot;...&quot; class=&quot;img-responsive&quot; alt=&quot;Image&quot;&gt;\n&lt;div class=&quot;caption-ar&quot;&gt;\n&lt;div class=&quot;caption-content&quot;&gt;\n    &lt;p&gt;....&lt;\/p&gt;\n&lt;\/div&gt;\n&lt;\/div&gt;\n&lt;\/div&gt;\n\n&lt;div class=&quot;img-caption-ar&quot;&gt;\n&lt;img src=&quot;...&quot; class=&quot;img-responsive&quot; alt=&quot;Image&quot;&gt;\n&lt;div class=&quot;caption-ar&quot;&gt;\n&lt;div class=&quot;caption-content&quot;&gt;\n    &lt;h4 class=&quot;caption-title&quot;&gt;Title Caption&lt;\/h4&gt;\n    &lt;p&gt;...&lt;\/p&gt;\n&lt;\/div&gt;\n&lt;\/div&gt;\n&lt;\/div&gt;\n                            <\/pre>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- panel show code --><\/p>\n<div class=\"row\">\n<div class=\"col-md-4 col-sm-6\">\n<div class=\"img-caption-ar\">\n                            <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w1.jpg\" class=\"img-responsive\" alt=\"Image\"><\/p>\n<div class=\"caption-ar\">\n<div class=\"caption-content\">\n                                    <a href=\"#\" class=\"animated fadeInDown\"><i class=\"fa fa-search\"><\/i>More info<\/a><\/p>\n<h4 class=\"caption-title\">Title Work<\/h4>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"col-md-4 col-sm-6\">\n<div class=\"img-caption-ar\">\n                            <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w2.jpg\" class=\"img-responsive\" alt=\"Image\"><\/p>\n<div class=\"caption-ar\">\n<div class=\"caption-content\">\n                                    <a href=\"#\" class=\"animated fadeInDown\"><i class=\"fa fa-search\"><\/i>More info<\/a><\/p>\n<h4 class=\"caption-title\">Title Work<\/h4>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"col-md-4 col-sm-6\">\n<div class=\"img-caption-ar\">\n                            <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w3.jpg\" class=\"img-responsive\" alt=\"Image\"><\/p>\n<div class=\"caption-ar\">\n<div class=\"caption-content\">\n                                    <a href=\"#\" class=\"animated fadeInDown\"><i class=\"fa fa-search\"><\/i>More info<\/a><\/p>\n<h4 class=\"caption-title\">Title Work<\/h4>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"col-md-6 col-sm-6\">\n<div class=\"img-caption-ar\">\n                            <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w5.jpg\" class=\"img-responsive\" alt=\"Image\"><\/p>\n<div class=\"caption-ar\">\n<div class=\"caption-content\">\n                                    <a href=\"#\" class=\"animated fadeInDown\"><i class=\"fa fa-search\"><\/i>More info<\/a><\/p>\n<h4 class=\"caption-title\">Title Work<\/h4>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"col-md-3 col-sm-6\">\n<div class=\"img-caption-ar\">\n                            <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w8.jpg\" class=\"img-responsive\" alt=\"Image\"><\/p>\n<div class=\"caption-ar\">\n<div class=\"caption-content\">\n<h4 class=\"caption-title\">Title Work<\/h4>\n<p>Lorem ipsum dolor sit amet consectetur.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"col-md-3 col-sm-6\">\n<div class=\"img-caption-ar\">\n                            <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w4.jpg\" class=\"img-responsive\" alt=\"Image\"><\/p>\n<div class=\"caption-ar\">\n<div class=\"caption-content\">\n<h4 class=\"caption-title\">Title Work<\/h4>\n<p>Lorem ipsum dolor sit amet consectetur.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"col-md-3 col-sm-6\">\n<div class=\"img-caption-ar\">\n                            <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w1.jpg\" class=\"img-responsive\" alt=\"Image\"><\/p>\n<div class=\"caption-ar\">\n<div class=\"caption-content\">\n<h4 class=\"caption-title\">Title Work<\/h4>\n<p>Lorem ipsum dolor sit amet consectetur.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"col-md-3 col-sm-6\">\n<div class=\"img-caption-ar\">\n                            <img src=\"http:\/\/re-test.ru\/wp-content\/uploads\/2015\/03\/w9.jpg\" class=\"img-responsive\" alt=\"Image\"><\/p>\n<div class=\"caption-ar\">\n<div class=\"caption-content\">\n<h4 class=\"caption-title\">Title Work<\/h4>\n<p>Lorem ipsum dolor sit amet consectetur.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/section>\n","protected":false},"excerpt":{"rendered":"<p>Simple Thumbnails Show Code Round Thumbnails Show Code Thumbnails caption Thumbnail label Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem, repellat, vitae porro ex expedita cumque nulla velit consequuntur recusandae animi. Button Button Thumbnail label Lorem ipsum dolor sit amet, consectetur adipisicing elit. Distinctio, repudiandae, possimus autem delectus consequatur minima ducimus odit rem fugit. &hellip; <a href=\"http:\/\/re-test.ru\/?page_id=367\" class=\"more-link\">\u0427\u0438\u0442\u0430\u0442\u044c \u0434\u0430\u043b\u0435\u0435 <span class=\"screen-reader-text\">Thumbnails<\/span><\/a><\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"open","template":"page-left-menu.php","meta":{"spay_email":""},"_links":{"self":[{"href":"http:\/\/re-test.ru\/index.php?rest_route=\/wp\/v2\/pages\/367"}],"collection":[{"href":"http:\/\/re-test.ru\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/re-test.ru\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/re-test.ru\/index.php?rest_route=\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"http:\/\/re-test.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=367"}],"version-history":[{"count":0,"href":"http:\/\/re-test.ru\/index.php?rest_route=\/wp\/v2\/pages\/367\/revisions"}],"wp:attachment":[{"href":"http:\/\/re-test.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=367"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}