{"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-69f4883195d89599623599 panels-animation-hide panel-row-style panel-row-style-for-96-1\" data-so-animation=\"{&quot;selector&quot;:&quot;.animate-69f4883195d89599623599&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-69f488319d04d779277429 panels-animation-hide panel-row-style panel-row-style-for-96-2\" data-so-animation=\"{&quot;selector&quot;:&quot;.animate-69f488319d04d779277429&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-69f48831a5f0c803348154 panels-animation-hide panel-row-style panel-row-style-for-96-3\" data-so-animation=\"{&quot;selector&quot;:&quot;.animate-69f48831a5f0c803348154&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-69f48831b01f0909658302 panel-widget-style panel-widget-style-for-96-4-0-0\" data-so-animation=\"{&quot;selector&quot;:&quot;.animate-69f48831b01f0909658302&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-69f48831b6d8f549622510 panels-animation-hide panel-row-style panel-row-style-for-96-5\" data-so-animation=\"{&quot;selector&quot;:&quot;.animate-69f48831b6d8f549622510&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}]}}