{"id":96,"date":"2018-07-18T10:11:03","date_gmt":"2018-07-18T10:11:03","guid":{"rendered":"https:\/\/demo.siteorigin.com\/premium\/?page_id=96"},"modified":"2024-05-24T18:44:13","modified_gmt":"2024-05-24T18:44:13","slug":"block-animations","status":"publish","type":"page","link":"https:\/\/demo.siteorigin.com\/premium\/block-animations\/","title":{"rendered":"Block Animations"},"content":{"rendered":"<div id=\"pl-96\"  class=\"panel-layout\" ><div id=\"pg-96-0\"  class=\"panel-grid panel-no-style\" ><div id=\"pgc-96-0-0\"  class=\"panel-grid-cell\" ><div id=\"panel-96-0-0-0\" class=\"so-panel widget widget_sow-editor panel-first-child panel-last-child\" data-index=\"0\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-editor so-widget-sow-editor-base\"\n\t\t\t\n\t\t>\n<div class=\"siteorigin-widget-tinymce textwidget\">\n\t<p>The <a href=\"https:\/\/siteorigin.com\/downloads\/premium\/?featured_addon=plugin\/animations\" target=\"_blank\" rel=\"noopener\">SiteOrigin Premium<\/a> Block Animation Addon adds row and widget animation options. Below you'll find a small sample of what's possible.<\/p>\n<\/div>\n<\/div><\/div><\/div><\/div><div id=\"pg-96-1\"  class=\"panel-grid panel-has-style\" ><div class=\"animate-69da1d290a52e870906097 panels-animation-hide panel-row-style panel-row-style-for-96-1\" data-so-animation=\"{&quot;selector&quot;:&quot;.animate-69da1d290a52e870906097&quot;,&quot;animation&quot;:&quot;fadeIn&quot;,&quot;breakpoint&quot;:&quot;780px&quot;,&quot;duration&quot;:1.5,&quot;repeat&quot;:0,&quot;hide&quot;:1,&quot;disableAnimationMobile&quot;:0,&quot;finalState&quot;:&quot;visible&quot;,&quot;delay&quot;:0,&quot;debounce&quot;:0.5,&quot;event&quot;:&quot;enter&quot;,&quot;offset&quot;:0}\" ><div id=\"pgc-96-1-0\"  class=\"panel-grid-cell\" ><div id=\"panel-96-1-0-0\" class=\"so-panel widget widget_sow-hero panel-first-child panel-last-child\" data-index=\"1\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-hero so-widget-sow-hero-default-463056c6f125-96\"\n\t\t\t\n\t\t>\t\t\t\t<div class=\"sow-slider-base\" style=\"display: none\" tabindex=\"0\">\n\t\t\t\t\t<ul\n\t\t\t\t\tclass=\"sow-slider-images\"\n\t\t\t\t\tdata-settings=\"{&quot;pagination&quot;:true,&quot;speed&quot;:800,&quot;timeout&quot;:8000,&quot;paused&quot;:false,&quot;pause_on_hover&quot;:false,&quot;swipe&quot;:&quot;&quot;,&quot;nav_always_show_desktop&quot;:&quot;&quot;,&quot;nav_always_show_mobile&quot;:&quot;&quot;,&quot;breakpoint&quot;:&quot;780px&quot;,&quot;unmute&quot;:false,&quot;anchor&quot;:null}\"\n\t\t\t\t\tstyle=\"min-height: 752px\"\t\t\t\t\tdata-anchor-id=\"\"\n\t\t\t\t>\t\t<li class=\"sow-slider-image  sow-slider-image-cover\" style=\"visibility: visible;;background-color: #333333;background-image: url(https:\/\/layouts.siteorigin.com\/wp-content\/uploads\/2015\/10\/mountain-690122_1920.jpg#1920x1077)\" >\n\t\t\t\t\t<div class=\"sow-slider-image-container\">\n\t\t\t<div class=\"sow-slider-image-wrapper\">\n\t\t\t\t<h1><span style=\"text-decoration: underline\">Eve<\/span>rest<\/h1>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<\/li>\n\t\t\t\t<li class=\"sow-slider-image  sow-slider-image-cover\" style=\"visibility: hidden;;background-color: #333333\" data-background=\"url(https:\/\/layouts.siteorigin.com\/wp-content\/uploads\/2015\/09\/trekking-299000_1920.jpg#1920x1285)\" >\n\t\t\t\t\t<div class=\"sow-slider-image-container\">\n\t\t\t<div class=\"sow-slider-image-wrapper\">\n\t\t\t\t<h1><span style=\"text-decoration: underline;color: #000000\">E<\/span><span style=\"color: #000000\">verest<\/span><\/h1>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<\/li>\n\t\t<\/ul>\t\t\t\t<ol class=\"sow-slider-pagination\">\n\t\t\t\t\t\t\t\t\t\t\t<li><a href=\"#\" data-goto=\"0\" aria-label=\"Display slide 1\"><\/a><\/li>\n\t\t\t\t\t\t\t\t\t\t\t<li><a href=\"#\" data-goto=\"1\" aria-label=\"Display slide 2\"><\/a><\/li>\n\t\t\t\t\t\t\t\t\t<\/ol>\n\n\t\t\t\t<div class=\"sow-slide-nav sow-slide-nav-next\">\n\t\t\t\t\t<a href=\"#\" data-goto=\"next\" aria-label=\"Next slide\" data-action=\"next\">\n\t\t\t\t\t\t<em class=\"sow-sld-icon-thin-right\"><\/em>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\n\t\t\t\t<div class=\"sow-slide-nav sow-slide-nav-prev\">\n\t\t\t\t\t<a href=\"#\" data-goto=\"previous\" aria-label=\"Previous slide\" data-action=\"prev\">\n\t\t\t\t\t\t<em class=\"sow-sld-icon-thin-left\"><\/em>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div><\/div><\/div><\/div><\/div><\/div><div id=\"pg-96-2\"  class=\"panel-grid panel-has-style\" ><div class=\"animate-69da1d290cf0a191357918 panels-animation-hide panel-row-style panel-row-style-for-96-2\" data-so-animation=\"{&quot;selector&quot;:&quot;.animate-69da1d290cf0a191357918&quot;,&quot;animation&quot;:&quot;fadeInRight&quot;,&quot;breakpoint&quot;:&quot;780px&quot;,&quot;duration&quot;:1.5,&quot;repeat&quot;:0,&quot;hide&quot;:1,&quot;disableAnimationMobile&quot;:0,&quot;finalState&quot;:&quot;visible&quot;,&quot;delay&quot;:0,&quot;debounce&quot;:0.5,&quot;event&quot;:&quot;enter&quot;,&quot;offset&quot;:0}\" ><div id=\"pgc-96-2-0\"  class=\"panel-grid-cell\" ><div id=\"panel-96-2-0-0\" class=\"so-panel widget widget_sow-headline panel-first-child panel-last-child\" data-index=\"2\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-headline so-widget-sow-headline-default-81087b3979f6-96\"\n\t\t\t\n\t\t><div class=\"sow-headline-container \">\n\t\t\t\t\t\t\t<h2 class=\"sow-headline\">\n\t\t\t\t\t\tAre You Ready for Everest?\t\t\t\t\t\t<\/h2>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"decoration\">\n\t\t\t\t\t\t<div class=\"decoration-inside\"><\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<h3 class=\"sow-sub-headline\">\n\t\t\t\t\t\tA layout for designers, developers and companies to create websites for show casing their products.\t\t\t\t\t\t<\/h3>\n\t\t\t\t\t\t<\/div>\n<\/div><\/div><\/div><\/div><\/div><div id=\"pg-96-3\"  class=\"panel-grid panel-has-style\" ><div class=\"animate-69da1d290ecf8446093670 panels-animation-hide panel-row-style panel-row-style-for-96-3\" data-so-animation=\"{&quot;selector&quot;:&quot;.animate-69da1d290ecf8446093670&quot;,&quot;animation&quot;:&quot;fadeInLeft&quot;,&quot;breakpoint&quot;:&quot;780px&quot;,&quot;duration&quot;:1.5,&quot;repeat&quot;:0,&quot;hide&quot;:1,&quot;disableAnimationMobile&quot;:0,&quot;finalState&quot;:&quot;visible&quot;,&quot;delay&quot;:0,&quot;debounce&quot;:0.5,&quot;event&quot;:&quot;in&quot;,&quot;offset&quot;:0}\" ><div id=\"pgc-96-3-0\"  class=\"panel-grid-cell\" ><div id=\"panel-96-3-0-0\" class=\"so-panel widget widget_sow-features panel-first-child panel-last-child\" data-index=\"3\" ><div class=\"panel-widget-style panel-widget-style-for-96-3-0-0\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-features so-widget-sow-features-default-471fa62690d5-96\"\n\t\t\t\n\t\t><ul\n\tclass=\"sow-features-list\n\tsow-features-responsive\">\n\n\t\t\t<li\n\t\t\tclass=\"sow-features-feature sow-icon-container-position-top\"\n\t\t\tstyle=\"display: flex; flex-direction: column; width: calc(100% - 25px);\"\n\t\t>\n\t\t\t\n\t\t\t\t\t\t<div\t\t\t\tclass=\"sow-icon-container sow-container-round\"\n\t\t\t\tstyle=\"color: #ffffff; \"\n\t\t\t\t\n\t\t\t\t\t\t\t>\n\t\t\t\t<span class=\"sow-icon-elegantline\" data-sow-icon=\"&#xe01c;\"\n\t\tstyle=\"font-size: 48px; color: #000000\" \n\t\taria-hidden=\"true\"><\/span>\t\t\t<\/div>\n\n\t\t\t<div class=\"textwidget\">\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<h5 class=\"sow-features-feature-title\">\n\t\t\t\t\t\tRich Text Editor\t\t\t\t\t<\/h5>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"sow-features-feature-text\">\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lacinia accumsan lectus, sed facilisis eros suscipit in. \t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/li>\n\n\t\t\t<li\n\t\t\tclass=\"sow-features-feature sow-icon-container-position-top\"\n\t\t\tstyle=\"display: flex; flex-direction: column; width: calc(100% - 25px);\"\n\t\t>\n\t\t\t\n\t\t\t\t\t\t<div\t\t\t\tclass=\"sow-icon-container sow-container-round\"\n\t\t\t\tstyle=\"color: #ffffff; \"\n\t\t\t\t\n\t\t\t\t\t\t\t>\n\t\t\t\t<span class=\"sow-icon-elegantline\" data-sow-icon=\"&#xe05d;\"\n\t\tstyle=\"font-size: 48px; color: #000000\" \n\t\taria-hidden=\"true\"><\/span>\t\t\t<\/div>\n\n\t\t\t<div class=\"textwidget\">\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<h5 class=\"sow-features-feature-title\">\n\t\t\t\t\t\tSocial Icons\t\t\t\t\t<\/h5>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"sow-features-feature-text\">\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lacinia accumsan lectus, sed facilisis eros suscipit in. \t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/li>\n\n\t<\/ul>\n<\/div><\/div><\/div><\/div><div id=\"pgc-96-3-1\"  class=\"panel-grid-cell\" ><div id=\"panel-96-3-1-0\" class=\"so-panel widget widget_sow-image panel-first-child panel-last-child\" data-index=\"4\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-image so-widget-sow-image-default-c67d20f9f743-96\"\n\t\t\t\n\t\t>\n<div class=\"sow-image-container\">\n\t\t<img \n\tsrc=\"https:\/\/layouts.siteorigin.com\/wp-content\/uploads\/2024\/05\/iphone-mockup.png\" title=\"Block Animations\" alt=\"\" \t\tclass=\"so-widget-image\"\/>\n\t<\/div>\n\n<\/div><\/div><\/div><div id=\"pgc-96-3-2\"  class=\"panel-grid-cell\" ><div id=\"panel-96-3-2-0\" class=\"so-panel widget widget_sow-features panel-first-child panel-last-child\" data-index=\"5\" ><div class=\"panel-widget-style panel-widget-style-for-96-3-2-0\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-features so-widget-sow-features-default-471fa62690d5-96\"\n\t\t\t\n\t\t><ul\n\tclass=\"sow-features-list\n\tsow-features-responsive\">\n\n\t\t\t<li\n\t\t\tclass=\"sow-features-feature sow-icon-container-position-top\"\n\t\t\tstyle=\"display: flex; flex-direction: column; width: calc(100% - 25px);\"\n\t\t>\n\t\t\t\n\t\t\t\t\t\t<div\t\t\t\tclass=\"sow-icon-container sow-container-round\"\n\t\t\t\tstyle=\"color: #ffffff; \"\n\t\t\t\t\n\t\t\t\t\t\t\t>\n\t\t\t\t<span class=\"sow-icon-elegantline\" data-sow-icon=\"&#xe010;\"\n\t\tstyle=\"font-size: 48px; color: #000000\" \n\t\taria-hidden=\"true\"><\/span>\t\t\t<\/div>\n\n\t\t\t<div class=\"textwidget\">\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<h5 class=\"sow-features-feature-title\">\n\t\t\t\t\t\tAdvanced Slider\t\t\t\t\t<\/h5>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"sow-features-feature-text\">\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lacinia accumsan lectus, sed facilisis eros suscipit in. \t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/li>\n\n\t\t\t<li\n\t\t\tclass=\"sow-features-feature sow-icon-container-position-top\"\n\t\t\tstyle=\"display: flex; flex-direction: column; width: calc(100% - 25px);\"\n\t\t>\n\t\t\t\n\t\t\t\t\t\t<div\t\t\t\tclass=\"sow-icon-container sow-container-round\"\n\t\t\t\tstyle=\"color: #ffffff; \"\n\t\t\t\t\n\t\t\t\t\t\t\t>\n\t\t\t\t<span class=\"sow-icon-elegantline\" data-sow-icon=\"&#xe000;\"\n\t\tstyle=\"font-size: 48px; color: #000000\" \n\t\taria-hidden=\"true\"><\/span>\t\t\t<\/div>\n\n\t\t\t<div class=\"textwidget\">\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<h5 class=\"sow-features-feature-title\">\n\t\t\t\t\t\tResponsive Layout\t\t\t\t\t<\/h5>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<div class=\"sow-features-feature-text\">\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lacinia accumsan lectus, sed facilisis eros suscipit in. \t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/li>\n\n\t<\/ul>\n<\/div><\/div><\/div><\/div><\/div><\/div><div id=\"pg-96-4\"  class=\"panel-grid panel-has-style\" ><div class=\"so-parallax siteorigin-panels-stretch panel-row-style panel-row-style-for-96-4\" data-stretch-type=\"full-width-stretch\" ><img src=https:\/\/layouts.siteorigin.com\/wp-content\/uploads\/2015\/09\/mountain-299002_1920.jpg data-siteorigin-parallax=\"true\"><div id=\"pgc-96-4-0\"  class=\"panel-grid-cell\" ><div id=\"panel-96-4-0-0\" class=\"so-panel widget widget_sow-headline panel-first-child panel-last-child\" data-index=\"6\" ><div class=\"animate-69da1d2912876413287671 panel-widget-style panel-widget-style-for-96-4-0-0\" data-so-animation=\"{&quot;selector&quot;:&quot;.animate-69da1d2912876413287671&quot;,&quot;animation&quot;:&quot;fadeInLeft&quot;,&quot;breakpoint&quot;:&quot;780px&quot;,&quot;duration&quot;:1.5,&quot;repeat&quot;:0,&quot;hide&quot;:0,&quot;disableAnimationMobile&quot;:0,&quot;finalState&quot;:&quot;visible&quot;,&quot;delay&quot;:0,&quot;debounce&quot;:0.5,&quot;event&quot;:&quot;enter&quot;,&quot;offset&quot;:0}\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-headline so-widget-sow-headline-default-5112b95975f8-96\"\n\t\t\t\n\t\t><div class=\"sow-headline-container \">\n\t\t\t\t\t\t\t<h2 class=\"sow-headline\">\n\t\t\t\t\t\t\"Beautiful Design Made Simple With the Power of Page Builder's Pre-Built Layouts\"\t\t\t\t\t\t<\/h2>\n\t\t\t\t\t\t<\/div>\n<\/div><\/div><\/div><\/div><\/div><\/div><div id=\"pg-96-5\"  class=\"panel-grid panel-has-style\" ><div class=\"animate-69da1d2914196895617175 panels-animation-hide panel-row-style panel-row-style-for-96-5\" data-so-animation=\"{&quot;selector&quot;:&quot;.animate-69da1d2914196895617175&quot;,&quot;animation&quot;:&quot;fadeInRight&quot;,&quot;breakpoint&quot;:&quot;780px&quot;,&quot;duration&quot;:1.5,&quot;repeat&quot;:0,&quot;hide&quot;:1,&quot;disableAnimationMobile&quot;:0,&quot;finalState&quot;:&quot;visible&quot;,&quot;delay&quot;:0,&quot;debounce&quot;:0.5,&quot;event&quot;:&quot;enter&quot;,&quot;offset&quot;:0}\" ><div id=\"pgc-96-5-0\"  class=\"panel-grid-cell panel-grid-cell-mobile-last\" ><div id=\"panel-96-5-0-0\" class=\"so-panel widget widget_sow-editor panel-first-child\" data-index=\"7\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-editor so-widget-sow-editor-base\"\n\t\t\t\n\t\t>\n<div class=\"siteorigin-widget-tinymce textwidget\">\n\t<h2 class=\"section-title\"><span style=\"text-decoration: underline;\">Eve<\/span>rest, a Page Builder Layout<\/h2>\n\nLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.\n\nStet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.<\/div>\n<\/div><\/div><div id=\"panel-96-5-0-1\" class=\"so-panel widget widget_sow-button panel-last-child\" data-index=\"8\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-button so-widget-sow-button-flat-0795a6a36c7e-96\"\n\t\t\t\n\t\t><div class=\"ow-button-base ow-button-align-left\"\n>\n\t\t\t<a\n\t\t\t\tclass=\"sowb-button ow-icon-placement-left ow-button-hover\" \t>\n\t\t<span>\n\t\t\t\n\t\t\tBeautiful\t\t<\/span>\n\t\t\t<\/a>\n\t<\/div>\n<\/div><\/div><\/div><div id=\"pgc-96-5-1\"  class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>The SiteOrigin Premium Block Animation Addon adds row and widget animation options. Below you&#8217;ll find a small sample of what&#8217;s possible.<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"inline_featured_image":false,"footnotes":""},"class_list":["post-96","page","type-page","status-publish","hentry","post"],"_links":{"self":[{"href":"https:\/\/demo.siteorigin.com\/premium\/wp-json\/wp\/v2\/pages\/96","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/demo.siteorigin.com\/premium\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/demo.siteorigin.com\/premium\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/demo.siteorigin.com\/premium\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/demo.siteorigin.com\/premium\/wp-json\/wp\/v2\/comments?post=96"}],"version-history":[{"count":39,"href":"https:\/\/demo.siteorigin.com\/premium\/wp-json\/wp\/v2\/pages\/96\/revisions"}],"predecessor-version":[{"id":4241,"href":"https:\/\/demo.siteorigin.com\/premium\/wp-json\/wp\/v2\/pages\/96\/revisions\/4241"}],"wp:attachment":[{"href":"https:\/\/demo.siteorigin.com\/premium\/wp-json\/wp\/v2\/media?parent=96"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}