Home>Support>Use of Page Builder with CobaltApps’ Dynamik Website Builder to obtain full width backgrounds

Use of Page Builder with CobaltApps’ Dynamik Website Builder to obtain full width backgrounds

By gregth, 10 years ago. Last reply by Leo Merkel, 10 years ago.
Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

I’m trying to use Page Builder with CobaltApps’ Dynamik Website Builder (an extemsive Genesis theme) to create landing pages and a home page containing rows of content with different full width background colors or images for each row. Page Builder has a selection in its Edit Row menu to select a full width layout along with custom backgrounds for any added row with content. Unfortunately, the full width background is constrained to the inner wrap by the Dynamik Website Builder (DWB), so the full width background feature doesn’t function as it would normally with other themes. I’ve tried other themes with Page Builder and this function works well. Is there a workaround to allow Page Builder to display full width backgrounds when when using DWB? I really want to solve this issue, because I don’t want to eliminate the fantastic control that DWB allows within WordPress; however, the rapid custom page design of SiteOrigin’s Page Builder would be a great added feature to my website designs. Note: I’ve also posted this issue on the CobaltApps forum to hopefully get some additional ideas.

Any help with this problem would be greatly appreciated.

Thanks!
Greg

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 10 years, 2 months ago Leo Merkel

    you can try this, greg, in your custom css. worked for me. you can change the panel-grid-cell class to 100% width if you want. Reason for this custom css: DWB overrides if you don’t mark them with !important.

    Regards, Leo

    /* SiteOrigin PageBuilder */
.site-inner,
.content-sidebar-wrap {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
}
.content {
    margin: 0 auto !important;
    float: none;
    padding: 0 !important;
    width: 100% !important;
}
.panel {
    border-width: 0 !important;
    box-shadow: none !important;
    background-color: transparent;
}
.dynamik-content-filler-img {
    display: none !important;
}
.panel-grid-cell {
    margin: 0 auto;
    max-width: 1060px;
    /*max-width: 100%;*/
}
Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More