Home Forums Gutenberg Gutenberg Mobile Preview – Bootstrap 4


Gutenberg Mobile Preview – Bootstrap 4

  • Hi All,

    I hope someone can help put me out my misery!

    I’ve created a basic theme using the Bootstrap 4 framework.

    I used to use Flexible Layouts but currently migrating to Gutenberg

    So far, so good! However, when I use Gutenberg’s preview and toggle Desktop/Tablet/Mobile

    It doesn’t seem to pull through the Bootstrap grid and therefore looks pants.

    I tried to add Bootstrap CSS via my theme’s function file like so:

    function theme_gutenberg_block_styles() {
        add_theme_support( 'editor-styles' );
        add_editor_style( [
        ] );
    add_action( 'after_setup_theme', 'theme_gutenberg_block_styles' );

    I must be missing something but can’t see what.

    Any help would be very much appreciated!

  • Just to follow on from this, I believe the issue is due to the preview.

    If I’ve got this right, the preview pane sets the size via in line styles, so the Bootstrap grid isn’t being applied as opposed to the actual browser resizing

    Can’t think of a way around it! Just be good to be more accurate on the preview front you see.


Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.