I need to enable the user of my theme to add full-width background rows, inside which should be a “limited width” PB row holding the columns.
I’ve checked the following:
– in the PB settings, i’ve set the container to empty. (Tried “body” also).
– I’ve set the colored row to “full width” and “full width stretched”
– console shows no error
What I get:
Now, the generated html:
<div class="panel-grid" id="pg-11331-3"> <div class="panel-row-style-background--purple siteorigin-panels-stretch panel-row-style" data-stretch-type="full"> <div class="panel-grid-cell" id="pgc-11331-3-0"> // etc...
I would need access to that specific “.panel-grid” div (with id #pg-11331-3). Is there a way to do that, programmatically or via the GUI? Perhaps via a row hook ?
Thank you in advance for helping me sort this.
For the moment, I hacked a workaround in javascript (jquery).
Here it is, in case it helps someone else:
you need a div.maximum-width that wraps around the Page builder area.
Then on the specific row that should be full-width, add classes “background full” in the row editor.
In my CSS file, I have background-color classes (.background–blue for example) that I add to the panel-grid div wrapper, generated by PB.
Hi Alexandre Plennevaux
Do you have a public URL where we can take a look at what’s going on? If you need to keep this URL private from other users, just select “Private Reply” on the bottom right of the comment box.
This is a private message.
Hi Alexandre Plennevaux,
Thank you for the link however I’m unable to provide full support unless I can see the WordPress version. I will however attempt a guess based on what you’ve provided. Could you make a full width stretched row with three columns set to 25% 50% 25%, and put the content into 50%?
Yes I considered that but then each row in the layout would need to have the left and right empty columns, which is a bit cumbersome, plus would generate empty divs which is semantically not ideal.
It’s okay though with my js hack, I don’t want to take any more of your time. Thanks for all your help!