aztra

Thanks gaggel, appreciate the tip and will experiment with it 🙂 Alex, i love you. That works perfectly and I’ve tested it on a couple of other broken sites, so far so good. I’m a much happier man…great work, thankyou!!!

Hi Paul, thankyou very much for the wonderful plugin. It’s been a gift, very practical indeed. I’m trying to lock down the problem, and i appreciate you have many other things to do, but this one has had me stumped for a while. Everything was fine until the 2.5x SO updates, and it’s surely something to do with that. Unfortunately, I’ve noticed that it only breaks with inserted pages, which i use a lot on various sites. Pretty much all of them are mangled by this.

Apologies for throwing all the code here, it’s just the 2 version differences to eyeball and i’m trying to track down the cause in order to fix it.

SiteOrigin 2.4.25 (works fine) :

<link rel=’stylesheet’ id=’siteorigin-panels-front-css’ href=’http://audiochristian.com/wp-content/plugins/siteorigin-panels/css/front.css?ver=2.4.25&#8242; type=’text/css’ media=’all’ />

the stylesheet as follows:

.panel-grid {
zoom: 1;
}
.panel-grid:before {
content: ”;
display: block;
}
.panel-grid:after {
content: ”;
display: table;
clear: both;
}
.panel-grid-cell {
-ms-box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
min-height: 1em;
}
.panel-grid-cell .so-panel {
zoom: 1;
}
.panel-grid-cell .so-panel:before {
content: ”;
display: block;
}
.panel-grid-cell .so-panel:after {
content: ”;
display: table;
clear: both;
}
.panel-grid-cell .panel-last-child {
margin-bottom: 0;
}
.panel-grid-cell .widget-title {
margin-top: 0;
}
.panel-row-style {
zoom: 1;
}
.panel-row-style:before {
content: ”;
display: block;
}
.panel-row-style:after {
content: ”;
display: table;
clear: both;
}

this is also different (as the OP identified):

<style type=”text/css” media=”all” id=”siteorigin-panels-layouts-head”>/* Layout 8 */ #pgc-8-0-0 , #pgc-8-1-0 , #pgc-8-2-0 , #pgc-8-3-0 { width:100%;width:calc(100% – ( 0 * 10px ) ) } #pg-8-0 , #pg-8-1 , #pg-8-2 , #pl-8 .so-panel , #pl-8 .so-panel:last-child { margin-bottom:0px } #pg-8-1> .panel-row-style { background-color:#ededed } #panel-8-1-0-0> .panel-widget-style { background-color:#ededed;color:#db1c4f } #panel-8-1-0-0 a { color:#db1c4f } #panel-8-3-0-0> .panel-widget-style { padding:10px 10px 10px 10px } @media (max-width:780px){ #pg-8-0.panel-no-style, #pg-8-0.panel-has-style > .panel-row-style , #pg-8-1.panel-no-style, #pg-8-1.panel-has-style > .panel-row-style , #pg-8-2.panel-no-style, #pg-8-2.panel-has-style > .panel-row-style , #pg-8-3.panel-no-style, #pg-8-3.panel-has-style > .panel-row-style { -webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column } #pg-8-0 .panel-grid-cell , #pg-8-1 .panel-grid-cell , #pg-8-2 .panel-grid-cell , #pg-8-3 .panel-grid-cell { margin-right:0 } #pg-8-0 .panel-grid-cell , #pg-8-1 .panel-grid-cell , #pg-8-2 .panel-grid-cell , #pg-8-3 .panel-grid-cell { width:100% } #pl-8 .panel-grid-cell { padding:0 } #pl-8 .panel-grid .panel-grid-cell-empty { display:none } #pl-8 .panel-grid .panel-grid-cell-mobile-last { margin-bottom:0px } } </style></head>

and SiteOrigin 2.5.8 (broken, like my heart) :

<link rel=’stylesheet’ id=’siteorigin-panels-front-css’ href=’http://audiochristian.com/wp-content/plugins/siteorigin-panels/inc/../css/front-flex.css?ver=2.5.8′ type=’text/css’ media=’all’ />

the stylesheet as follows:

.panel-grid.panel-no-style,
.panel-grid.panel-has-style > .panel-row-style {
display: -webkit-flex;
display: flex;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: nowrap;
-ms-justify-content: space-between;
-webkit-justify-content: space-between;
justify-content: space-between;
}
.panel-layout.panel-is-rtl .panel-grid.panel-no-style,
.panel-layout.panel-is-rtl .panel-grid.panel-has-style > .panel-row-style {
-ms-flex-direction: row-reverse;
-webkit-flex-direction: row-reverse;
flex-direction: row-reverse;
}
.panel-grid-cell {
-ms-box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.panel-grid-cell .panel-cell-style {
height: 100%;
}
.panel-grid-cell .so-panel {
zoom: 1;
}
.panel-grid-cell .so-panel:before {
content: ”;
display: block;
}
.panel-grid-cell .so-panel:after {
content: ”;
display: table;
clear: both;
}
.panel-grid-cell .panel-last-child {
margin-bottom: 0;
}
.panel-grid-cell .widget-title {
margin-top: 0;
}
body.siteorigin-panels-before-js {
overflow-x: hidden;
}
body.siteorigin-panels-before-js .siteorigin-panels-stretch {
margin-right: -1000px !important;
margin-left: -1000px !important;
padding-right: 1000px !important;
padding-left: 1000px !important;
}

Again, the OP noticed this difference:

<style type=”text/css” media=”all” id=”siteorigin-panels-grids-wp_head”>/* Layout 8 */ #pg-8-0 , #pg-8-1 , #pg-8-2 , #pl-8 .panel-grid-cell .so-panel , #pl-8 .panel-grid-cell .so-panel:last-child { margin-bottom:0px } #pg-8-0 .panel-grid-cell , #pg-8-1 .panel-grid-cell , #pg-8-2 .panel-grid-cell , #pg-8-3 .panel-grid-cell { float:none } #pg-8-0 , #pg-8-1 , #pg-8-2 , #pg-8-3 { margin-left:-5px;margin-right:-5px } #pg-8-0 .panel-grid-cell , #pg-8-1 .panel-grid-cell , #pg-8-2 .panel-grid-cell , #pg-8-3 .panel-grid-cell { padding-left:5px;padding-right:5px } #panel-8-1-0-0 a { color:#db1c4f } #panel-8-3-0-0 > .panel-widget-style { padding:10px 10px 10px 10px } @media (max-width:780px){ #pg-8-0 .panel-grid-cell , #pg-8-1 .panel-grid-cell , #pg-8-2 .panel-grid-cell , #pg-8-3 .panel-grid-cell { float:none;width:auto } #pl-8 .panel-grid , #pl-8 .panel-grid-cell { } #pl-8 .panel-grid .panel-grid-cell-empty { display:none } #pl-8 .panel-grid .panel-grid-cell-mobile-last { margin-bottom:0px } } </style></head>

I am also contacting SO to see if they can help. Unfortunately it’s a real game changer. Insert pages is simply that useful and important a feature. Being able to create site sections as pages and integrate them into other pages is very important on large sites. You could be right about the missing css include, i’ll explore that.

Alex thankyou indeed, unfortunately that was already disabled and there are no caching plugins. I tried your suggestion to be sure but sadly no joy there.

Appreciate the replies and help very much.

hi, this is a big problem for us too. Quite a few sites broken where insert pages is implemented. Is there a good solution? So far, we can only stay with version 2.4x.

For example, the footer in this site uses insert pages widget, and now the alignment etc is broken. the cells don’t meet up:

http://audiochristian.com/

I’ve updated siteorigin to show the problem. Any help appreciated, thanks.