0
Welcome Guest! Login
0 items Join Now

SOLVED Use full width block in Gutenberg editor

    • Carlos's Avatar
    • Carlos
    • Newbie
    • Posts: 18
    • Thanks: 0

    SOLVED Use full width block in Gutenberg editor

    Posted 3 months 4 weeks ago
    • I need to know how I can assign full width to a specific block within a Wordpress post or page.

      I would like it to work even though the content particle does not have full width assigned in gantry 5.

      I appreciate your help in finding a solution
    • Matt's Avatar
    • Matt
    • Preeminent Rocketeer
    • Posts: 22254
    • Thanks: 3223
    • messin' with stuff

    Re: SOLVED Use full width block in Gutenberg editor

    Posted 3 months 3 weeks ago
    • I'm not 100% sure what you're asking.

      WordPress page content get output via the Page Content Particle: docs.gantry.org/gantry5/particles/page-content

      You can position that wherever you'd like in any given Outline. And you set the Section's Layout to "Full Width - Remove Container"
    • SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT :woohoo:
    • Carlos's Avatar
    • Carlos
    • Newbie
    • Posts: 18
    • Thanks: 0

    Re: SOLVED Use full width block in Gutenberg editor

    Posted 3 months 3 weeks ago
    • Hi Matt,

      Thanks for your reply. What I need to know is if there is a way that even though the content particle is set to take up 80% of the total width, I can insert a block inside a post in Gutenberg that takes up the full width of the screen, ignoring the 80% constraint set on the content particle.

      This is a simple thing to do when using elementor with one of its templates, but in gantry I don't know how to do it in a simple way.

      I hope I've been clearer in my explanation.

      Regards
    • Matt's Avatar
    • Matt
    • Preeminent Rocketeer
    • Posts: 22254
    • Thanks: 3223
    • messin' with stuff

    Re: SOLVED Use full width block in Gutenberg editor

    Posted 3 months 3 weeks ago
    • No, you can't insert any Particles inside of WP Page content... whether it's the Gutenberg or Classic Editors... Gantry just renders CMS content via the Page Content exactly as it comes from the CMS; whether it's normal page content or content output by a 3rd party plugin.
    • SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT :woohoo:
    • Carlos's Avatar
    • Carlos
    • Newbie
    • Posts: 18
    • Thanks: 0

    Re: SOLVED Use full width block in Gutenberg editor

    Posted 1 month 1 week ago
    • Hi Matt,

      Thanks for your reply. I'm not clear on what you're saying, I'll try to explain myself better.

      What I need to know is if there is any CSS configuration option that allows, for example, an image block or any other block inserted in Gutenberg, to occupy 100% of the width of the screen, bypassing the limits set by the Page Content particle configuration. For example, I have the Page Content particle marked to occupy 80% of the width, however, there are specific cases in which it would be good for me to have a block inserted in Gutenberg occupy 100% of the width.

      I look forward to your response,
      Regards
    • Matt's Avatar
    • Matt
    • Preeminent Rocketeer
    • Posts: 22254
    • Thanks: 3223
    • messin' with stuff

    Re: SOLVED Use full width block in Gutenberg editor

    Posted 1 month 1 week ago
    • No, not really, at least not with pure CSS and in a responsive/adaptive manner... the only way to make a inner container be larger than its parent container is by either setting it to have absolute or fixed positioning or by defining a static width (ie 2000px)... I've seen libraries use JS to detect the browser width and then statically set a container to that width such that if the browser width changes the JS in turn adjusts the static width... that's really the only responsive way it can be done and still align with neighboring containers as setting the positioning to fixed or absolute will effectively ignore all neighboring containers.
    • Last Edit: 1 month 1 week ago by Matt.
    • SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT :woohoo:
    • Carlos's Avatar
    • Carlos
    • Newbie
    • Posts: 18
    • Thanks: 0

    Re: SOLVED Use full width block in Gutenberg editor

    Posted 1 month 1 week ago
    • Hi Matt,

      Thanks for your response. I take note of your advice. You can mark it as solved.

      Greetings

Time to create page: 0.040 seconds