• MacMare

    (@macmare)


    Hi! I design with WPBakery and a new client has asked me to make some updates to her website, which uses this theme. I have never worked in Gutenberg before but am proficient at WPBakery, so I installed it and only used it on the page she wanted help with. I added my content but when I view the page, the content is flush left and only half the width of the page. I see there are layouts set up, but of course, if I select one, it cannot be used with WPBakery. Can I use this plugin with this theme? I can’t figure out how to set the page for “full width” or something else that displays the content correctly.

    I’d appreciate any help, thanks so much,

    Marion

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • WPBakery can be used with most WordPress themes, including those designed for use with Gutenberg. However, WPBakery might conflict with the default layouts or CSS settings of themes optimized for Gutenberg. I looked at the link and the content is aligned left due to the CSS that restricts the width of the container and its alignment. Adjustments can be made by modifying the CSS for the container, like setting the max-width to 100% and centering it using margin: 0 auto;. This should fix the layout issue.

    You can apply changes in the WPBakery Row Settings by setting the row to “Stretch Row.” This ensures the page structure aligns correctly. If you have access to the theme’s CSS files, edits can be made there, but using the Customizer is safer for quick fixes.

    To adjust the row settings within WPBakery:

    1. Edit the page with WPBakery.
    2. Hover over the row and click the Edit Row button (pencil icon).
    3. In the Row Settings panel, go to the General tab.
    4. Under Stretch Row options, select “Stretch row” or “Stretch row and content” to make the row full width.
    5. Save and update the page.

    This will make the content span the full width of the page.

    Thread Starter MacMare

    (@macmare)

    Thank you so much for your help. I set the Row to “Stretch Row” but it didn’t change anything, but when I set it to “Stretch Row and Content” it did successfully stretch across the page but it’s stretching past the full width rows elsewhere on the site. I would like it to have the left and right margins match the other pages. I have added CSS to the page using WPBakery’s Page settings:

    .container {
    max-width: 100%;
    margin: 0 auto; }

    And I’ve changed it to 80% and tried to add left and right padding to get it closer to the width of the rest of the site but it’s not affecting it at all. Am I using the wrong CSS class maybe? She wants to add an entire new set of pages and I think this is going to get tricky because I want to stretch some images and rows full width from edge to edge but will want some content to be in the “default” width I usually have available without using the “Stretch Row and Content” option. This forces me to make everything full width. How can I at least get the left and right padding to match other pages?

    Thank you for any help!

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.