{"id":792,"date":"2017-06-06T03:29:08","date_gmt":"2017-06-06T03:29:08","guid":{"rendered":"https:\/\/demo.yolotheme.com\/finanzen\/?page_id=792"},"modified":"2017-06-27T02:19:47","modified_gmt":"2017-06-27T02:19:47","slug":"packery-layout","status":"publish","type":"page","link":"https:\/\/demo.yolotheme.com\/finanzen\/packery-layout\/","title":{"rendered":"Packery Layout"},"content":{"rendered":"<p>[vc_row layout=&#8221;wide&#8221;][vc_column]<div class=\"portfolio-container\">\r\n  <div class=\"portfolio overflow-hidden   paging\"  id=\"portfolio-69d2a9a331c52\">\r\n      <!-- Portfolio Filter -->\r\n            <div class=\"portfolio-tabs clearfix tag\">\r\n            <div class=\"tab-wrapper line-height-1 center\">\r\n      <ul class=\"filter_style_1\">\r\n        <li class=\"active\">\r\n          <a  class=\"isotope-portfolio ladda-button style2 button-dark button-2x active\"\r\n              data-section-id    =\"69d2a9a331c52\"\r\n              data-category      =\"\"\r\n              data-overlay-style =\"icon-title-category\"\r\n              data-source        =\"\"\r\n              data-portfolio-ids =\"\"\r\n              data-group         =\"all\" \r\n              data-filter        =\"*\"\r\n              data-thumbnail     =\"packery\"\r\n              data-tag           =\"accounting,banking,business,employee,financial,presentation\"\r\n              data-current-page  =\"1\"\r\n              data-offset        =\"0\"\r\n              data-post-per-page =\"6\"\r\n              data-order         =\"DESC\"\r\n              data-column        =\"4\"\r\n              data-show-paging   =\"\"\r\n              data-style         =\"zoom-out\"\r\n              data-spinner-color =\"#fff\"\r\n              href               =\"javascript:;\">\r\n              All          <\/a>\r\n        <\/li>\r\n                <li class=\"\">\r\n          <a  class=\"isotope-portfolio ladda-button style2 button-dark button-2x \"\r\n              href               =\"javascript:;\" \r\n              data-section-id    =\"69d2a9a331c52\"\r\n              data-category      =\"accounting\"\r\n              data-overlay-style =\"icon-title-category\"\r\n              data-source        =\"\"\r\n              data-portfolio-ids =\"\"\r\n              data-group         =\"accounting\"\r\n              data-filter        =\".accounting\"\r\n              data-thumbnail     =\"packery\"\r\n              data-tag           =\"accounting,banking,business,employee,financial,presentation\"\r\n              data-current-page  =\"1\"\r\n              data-offset        =\"0\"\r\n              data-post-per-page =\"6\"\r\n              data-order         =\"DESC\"\r\n              data-column        =\"4\"\r\n              data-show-paging   =\"\"\r\n              data-style         =\"zoom-out\"\r\n              data-spinner-color =\"#fff\">\r\n              Accounting          <\/a>\r\n        <\/li>\r\n                <li class=\"\">\r\n          <a  class=\"isotope-portfolio ladda-button style2 button-dark button-2x \"\r\n              href               =\"javascript:;\" \r\n              data-section-id    =\"69d2a9a331c52\"\r\n              data-category      =\"banking\"\r\n              data-overlay-style =\"icon-title-category\"\r\n              data-source        =\"\"\r\n              data-portfolio-ids =\"\"\r\n              data-group         =\"banking\"\r\n              data-filter        =\".banking\"\r\n              data-thumbnail     =\"packery\"\r\n              data-tag           =\"accounting,banking,business,employee,financial,presentation\"\r\n              data-current-page  =\"1\"\r\n              data-offset        =\"0\"\r\n              data-post-per-page =\"6\"\r\n              data-order         =\"DESC\"\r\n              data-column        =\"4\"\r\n              data-show-paging   =\"\"\r\n              data-style         =\"zoom-out\"\r\n              data-spinner-color =\"#fff\">\r\n              Banking          <\/a>\r\n        <\/li>\r\n                <li class=\"\">\r\n          <a  class=\"isotope-portfolio ladda-button style2 button-dark button-2x \"\r\n              href               =\"javascript:;\" \r\n              data-section-id    =\"69d2a9a331c52\"\r\n              data-category      =\"business\"\r\n              data-overlay-style =\"icon-title-category\"\r\n              data-source        =\"\"\r\n              data-portfolio-ids =\"\"\r\n              data-group         =\"business\"\r\n              data-filter        =\".business\"\r\n              data-thumbnail     =\"packery\"\r\n              data-tag           =\"accounting,banking,business,employee,financial,presentation\"\r\n              data-current-page  =\"1\"\r\n              data-offset        =\"0\"\r\n              data-post-per-page =\"6\"\r\n              data-order         =\"DESC\"\r\n              data-column        =\"4\"\r\n              data-show-paging   =\"\"\r\n              data-style         =\"zoom-out\"\r\n              data-spinner-color =\"#fff\">\r\n              Business          <\/a>\r\n        <\/li>\r\n                <li class=\"\">\r\n          <a  class=\"isotope-portfolio ladda-button style2 button-dark button-2x \"\r\n              href               =\"javascript:;\" \r\n              data-section-id    =\"69d2a9a331c52\"\r\n              data-category      =\"employee\"\r\n              data-overlay-style =\"icon-title-category\"\r\n              data-source        =\"\"\r\n              data-portfolio-ids =\"\"\r\n              data-group         =\"employee\"\r\n              data-filter        =\".employee\"\r\n              data-thumbnail     =\"packery\"\r\n              data-tag           =\"accounting,banking,business,employee,financial,presentation\"\r\n              data-current-page  =\"1\"\r\n              data-offset        =\"0\"\r\n              data-post-per-page =\"6\"\r\n              data-order         =\"DESC\"\r\n              data-column        =\"4\"\r\n              data-show-paging   =\"\"\r\n              data-style         =\"zoom-out\"\r\n              data-spinner-color =\"#fff\">\r\n              Employee          <\/a>\r\n        <\/li>\r\n                <li class=\"\">\r\n          <a  class=\"isotope-portfolio ladda-button style2 button-dark button-2x \"\r\n              href               =\"javascript:;\" \r\n              data-section-id    =\"69d2a9a331c52\"\r\n              data-category      =\"financial\"\r\n              data-overlay-style =\"icon-title-category\"\r\n              data-source        =\"\"\r\n              data-portfolio-ids =\"\"\r\n              data-group         =\"financial\"\r\n              data-filter        =\".financial\"\r\n              data-thumbnail     =\"packery\"\r\n              data-tag           =\"accounting,banking,business,employee,financial,presentation\"\r\n              data-current-page  =\"1\"\r\n              data-offset        =\"0\"\r\n              data-post-per-page =\"6\"\r\n              data-order         =\"DESC\"\r\n              data-column        =\"4\"\r\n              data-show-paging   =\"\"\r\n              data-style         =\"zoom-out\"\r\n              data-spinner-color =\"#fff\">\r\n              Financial          <\/a>\r\n        <\/li>\r\n                <li class=\"\">\r\n          <a  class=\"isotope-portfolio ladda-button style2 button-dark button-2x \"\r\n              href               =\"javascript:;\" \r\n              data-section-id    =\"69d2a9a331c52\"\r\n              data-category      =\"presentation\"\r\n              data-overlay-style =\"icon-title-category\"\r\n              data-source        =\"\"\r\n              data-portfolio-ids =\"\"\r\n              data-group         =\"presentation\"\r\n              data-filter        =\".presentation\"\r\n              data-thumbnail     =\"packery\"\r\n              data-tag           =\"accounting,banking,business,employee,financial,presentation\"\r\n              data-current-page  =\"1\"\r\n              data-offset        =\"0\"\r\n              data-post-per-page =\"6\"\r\n              data-order         =\"DESC\"\r\n              data-column        =\"4\"\r\n              data-show-paging   =\"\"\r\n              data-style         =\"zoom-out\"\r\n              data-spinner-color =\"#fff\">\r\n              Presentation          <\/a>\r\n        <\/li>\r\n              <\/ul>\r\n    <\/div>\r\n        <\/div>\r\n            <!-- End Portfolio Filter -->\r\n\r\n      <!-- Portfolio Wrapper -->\r\n      <div class=\"portfolio-wrapper finanzen-col-md-4 col-padding-15 packery hover-dir-on\"\r\n          data-section-id=\"69d2a9a331c52\"\r\n          id=\"portfolio-container-69d2a9a331c52\"\r\n          data-columns=\"4\">\r\n          \r\n          \r\n<div class=\"portfolio-item hover-dir employee presentation  hover-align-center \">\r\n    <!-- Title top -->\r\n    \r\n    <div class=\"entry-thumbnail icon-title-category effect_2\">\r\n    <img width=\"500\" height=\"500\" src=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/portx6-500x500.jpg\" alt=\"Dolorem eum fugiat\"\/>\r\n    <div class=\"entry-thumbnail-hover p-bg-rgba-color\">\r\n        <div class=\"entry-hover-wrapper\">\r\n            <div class=\"entry-hover-inner\">\r\n                <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/portfolio\/dolorem-eum-fugiat\/\" class=\"overlay-title\"><div class=\"title fc-white\">Dolorem eum fugiat<\/div><\/a>\r\n                <span class=\"category\">Employee &amp; Presentation<\/span>\r\n                                    <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/portx6.jpg\" data-rel=\"prettyPhoto[pp_gal_214]\" title=\"Dolorem eum fugiat\">                        <i class=\"fa fa-expand fc-white\"><\/i>                    <\/a>\r\n                    \r\n                            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n    <!-- Title bottom -->\r\n    \r\n    <!-- @TODO: process media type -->\r\n    <div style=\"display: none\">\r\n                <div>\r\n                <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/06\/single-sevice-5.jpg\"\r\n                   data-rel=\"prettyPhoto[pp_gal_214]\"\r\n                   title=\"<a href='https:\/\/demo.yolotheme.com\/finanzen\/portfolio\/dolorem-eum-fugiat\/'>Dolorem eum fugiat<\/a>\"><\/a>\r\n            <\/div>\r\n                    <div>\r\n                <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/06\/single-4.jpg\"\r\n                   data-rel=\"prettyPhoto[pp_gal_214]\"\r\n                   title=\"<a href='https:\/\/demo.yolotheme.com\/finanzen\/portfolio\/dolorem-eum-fugiat\/'>Dolorem eum fugiat<\/a>\"><\/a>\r\n            <\/div>\r\n                    <div>\r\n                <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/06\/single3.jpg\"\r\n                   data-rel=\"prettyPhoto[pp_gal_214]\"\r\n                   title=\"<a href='https:\/\/demo.yolotheme.com\/finanzen\/portfolio\/dolorem-eum-fugiat\/'>Dolorem eum fugiat<\/a>\"><\/a>\r\n            <\/div>\r\n                    <div>\r\n                <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/videotax.jpg\"\r\n                   data-rel=\"prettyPhoto[pp_gal_214]\"\r\n                   title=\"<a href='https:\/\/demo.yolotheme.com\/finanzen\/portfolio\/dolorem-eum-fugiat\/'>Dolorem eum fugiat<\/a>\"><\/a>\r\n            <\/div>\r\n        <\/div>\r\n<\/div>\r\n\r\n          \r\n          \r\n<div class=\"portfolio-item hover-dir banking financial  hover-align-center small_squared\">\r\n    <!-- Title top -->\r\n    \r\n    <div class=\"entry-thumbnail icon-title-category effect_2\">\r\n    <img width=\"500\" height=\"500\" src=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/portx5-500x500.jpg\" alt=\"Velit esse quam\"\/>\r\n    <div class=\"entry-thumbnail-hover p-bg-rgba-color\">\r\n        <div class=\"entry-hover-wrapper\">\r\n            <div class=\"entry-hover-inner\">\r\n                <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/portfolio\/velit-esse-quam\/\" class=\"overlay-title\"><div class=\"title fc-white\">Velit esse quam<\/div><\/a>\r\n                <span class=\"category\">Banking &amp; Financial<\/span>\r\n                                    <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/portx5.jpg\" data-rel=\"prettyPhoto[pp_gal_213]\" title=\"Velit esse quam\">                        <i class=\"fa fa-search fc-white\"><\/i>                    <\/a>\r\n                    \r\n                            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n    <!-- Title bottom -->\r\n    \r\n    <!-- @TODO: process media type -->\r\n    <div style=\"display: none\">\r\n    <\/div>\r\n<\/div>\r\n\r\n          \r\n          \r\n<div class=\"portfolio-item hover-dir banking business employee  hover-align-center landscape\">\r\n    <!-- Title top -->\r\n    \r\n    <div class=\"entry-thumbnail icon-title-category effect_2\">\r\n    <img width=\"800\" height=\"400\" src=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/portx4-800x400.jpg\" alt=\"In ea voluptate\"\/>\r\n    <div class=\"entry-thumbnail-hover p-bg-rgba-color\">\r\n        <div class=\"entry-hover-wrapper\">\r\n            <div class=\"entry-hover-inner\">\r\n                <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/portfolio\/in-ea-voluptate\/\" class=\"overlay-title\"><div class=\"title fc-white\">In ea voluptate<\/div><\/a>\r\n                <span class=\"category\">Banking &amp; Business &amp; Employee<\/span>\r\n                                    <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/portx4.jpg\" data-rel=\"prettyPhoto[pp_gal_212]\" title=\"In ea voluptate\">                        <i class=\"fa fa-search fc-white\"><\/i>                    <\/a>\r\n                    \r\n                            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n    <!-- Title bottom -->\r\n    \r\n    <!-- @TODO: process media type -->\r\n    <div style=\"display: none\">\r\n    <\/div>\r\n<\/div>\r\n\r\n          \r\n          \r\n<div class=\"portfolio-item hover-dir banking business employee  hover-align-center landscape\">\r\n    <!-- Title top -->\r\n    \r\n    <div class=\"entry-thumbnail icon-title-category effect_2\">\r\n    <img width=\"800\" height=\"400\" src=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/portx3-800x400.jpg\" alt=\"Ullam corporis suscipit\"\/>\r\n    <div class=\"entry-thumbnail-hover p-bg-rgba-color\">\r\n        <div class=\"entry-hover-wrapper\">\r\n            <div class=\"entry-hover-inner\">\r\n                <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/portfolio\/ullam-corporis-suscipit\/\" class=\"overlay-title\"><div class=\"title fc-white\">Ullam corporis suscipit<\/div><\/a>\r\n                <span class=\"category\">Banking &amp; Business &amp; Employee<\/span>\r\n                                    <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/portx3.jpg\" data-rel=\"prettyPhoto[pp_gal_211]\" title=\"Ullam corporis suscipit\">                        <i class=\"fa fa-search fc-white\"><\/i>                    <\/a>\r\n                    \r\n                            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n    <!-- Title bottom -->\r\n    \r\n    <!-- @TODO: process media type -->\r\n    <div style=\"display: none\">\r\n    <\/div>\r\n<\/div>\r\n\r\n          \r\n          \r\n<div class=\"portfolio-item hover-dir business employee  hover-align-center small_squared\">\r\n    <!-- Title top -->\r\n    \r\n    <div class=\"entry-thumbnail icon-title-category effect_2\">\r\n    <img width=\"500\" height=\"500\" src=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/portx2-500x500.jpg\" alt=\"Quis autem vel\"\/>\r\n    <div class=\"entry-thumbnail-hover p-bg-rgba-color\">\r\n        <div class=\"entry-hover-wrapper\">\r\n            <div class=\"entry-hover-inner\">\r\n                <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/portfolio\/quis-autem-vel\/\" class=\"overlay-title\"><div class=\"title fc-white\">Quis autem vel<\/div><\/a>\r\n                <span class=\"category\">Business &amp; Employee<\/span>\r\n                                    <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/portx2.jpg\" data-rel=\"prettyPhoto[pp_gal_210]\" title=\"Quis autem vel\">                        <i class=\"fa fa-search fc-white\"><\/i>                    <\/a>\r\n                    \r\n                            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n    <!-- Title bottom -->\r\n    \r\n    <!-- @TODO: process media type -->\r\n    <div style=\"display: none\">\r\n    <\/div>\r\n<\/div>\r\n\r\n          \r\n          \r\n<div class=\"portfolio-item hover-dir accounting banking  hover-align-center small_squared\">\r\n    <!-- Title top -->\r\n    \r\n    <div class=\"entry-thumbnail icon-title-category effect_2\">\r\n    <img width=\"500\" height=\"500\" src=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/portx1-500x500.jpg\" alt=\"Dignissimos ducimus qui\"\/>\r\n    <div class=\"entry-thumbnail-hover p-bg-rgba-color\">\r\n        <div class=\"entry-hover-wrapper\">\r\n            <div class=\"entry-hover-inner\">\r\n                <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/portfolio\/dignissimos-ducimus-qui\/\" class=\"overlay-title\"><div class=\"title fc-white\">Dignissimos ducimus qui<\/div><\/a>\r\n                <span class=\"category\">Accounting &amp; Banking<\/span>\r\n                                    <a href=\"https:\/\/demo.yolotheme.com\/finanzen\/wp-content\/uploads\/2017\/05\/portx1.jpg\" data-rel=\"prettyPhoto[pp_gal_203]\" title=\"Dignissimos ducimus qui\">                        <i class=\"fa fa-search fc-white\"><\/i>                    <\/a>\r\n                    \r\n                            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n    <!-- Title bottom -->\r\n    \r\n    <!-- @TODO: process media type -->\r\n    <div style=\"display: none\">\r\n    <\/div>\r\n<\/div>\r\n\r\n                <\/div>\r\n      <!-- End Portfolio Wrap -->\r\n\r\n      <!-- Portfolio Paging -->\r\n        <\/div>\r\n<\/div>\r\n\r\n<script type=\"text\/javascript\" >\r\n  var padding_width = 15;\r\n  var column = 4;\r\n\r\n  (function ($) {\r\n    \"use strict\";\r\n    $(window).on('load',function () {\r\n      var $tab_container = jQuery('#portfolio-69d2a9a331c52');\r\n      $('.portfolio-tabs .isotope-portfolio', $tab_container).off();\r\n      $('.portfolio-tabs .isotope-portfolio', $tab_container).click(function () {\r\n        $('.portfolio-tabs .isotope-portfolio', $tab_container).removeClass('active');\r\n        $('.portfolio-tabs li', $tab_container).removeClass('active');\r\n        $(this).addClass('active');\r\n        $(this).parent().addClass('active');\r\n        var dataSectionId = $(this).attr('data-section-id');\r\n        var filter        = $(this).attr('data-filter');\r\n        var $container    = jQuery('div[data-section-id=\"' + dataSectionId + '\"]').isotope({ filter: filter});\r\n        \/\/ $container.imagesLoaded(function () {\r\n        \/\/   $container.isotope('layout');\r\n        \/\/ });\r\n      });\r\n\r\n      var $container = jQuery('div[data-section-id=\"69d2a9a331c52\"]');\r\n      $container.imagesLoaded(function () {\r\n        $container.isotope({\r\n          itemSelector: '.portfolio-item',\r\n          layoutMode: 'packery', \/\/ packery mode\r\n          \/\/ packery: {\r\n          \/\/   horizontal: true\r\n          \/\/ }\r\n        }).isotope('layout');\r\n      });\r\n\r\n      $(window).resize( function() {\r\n        PortfolioAjaxAction.fixPackeryPadding();\r\n      });\r\n    });\r\n\r\n    $(document).ready(function () {\r\n            $('.portfolio-item.hover-dir > div.entry-thumbnail').hoverdir();\r\n            \r\n      PortfolioAjaxAction.init('https:\/\/demo.yolotheme.com\/finanzen\/wp-admin\/admin-ajax.php', '69d2a9a331c52');\r\n    })\r\n\r\n  })(jQuery);\r\n<\/script>[\/vc_column][\/vc_row]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>[vc_row layout=&#8221;wide&#8221;][vc_column][\/vc_column][\/vc_row]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/demo.yolotheme.com\/finanzen\/wp-json\/wp\/v2\/pages\/792"}],"collection":[{"href":"https:\/\/demo.yolotheme.com\/finanzen\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/demo.yolotheme.com\/finanzen\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/demo.yolotheme.com\/finanzen\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/demo.yolotheme.com\/finanzen\/wp-json\/wp\/v2\/comments?post=792"}],"version-history":[{"count":0,"href":"https:\/\/demo.yolotheme.com\/finanzen\/wp-json\/wp\/v2\/pages\/792\/revisions"}],"wp:attachment":[{"href":"https:\/\/demo.yolotheme.com\/finanzen\/wp-json\/wp\/v2\/media?parent=792"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}