Full Width Cover Block in Monument Valley

Home Forums Monument Valley Full Width Cover Block in Monument Valley

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #21458

    viveomedia
    Participant

    Full Width Cover Block in Monument Valley

    Resolved

    Hey there! Have you noticed this support service is provided FREE of charge?
    If you like the speed and accuracy of resolutions, please consider supporting me with a small donation. Thank you

    Consider a donation →

    I need to create a full width section using a cover block. I have added the code you have for other themes but they are not working correctly.

    #21462

    Oliver Juhas
    Keymaster

    Hi viveomedia,

    Please note that none of my themes currently supports block editor’s full alignment feature, so, I’m not sure what code you have used.

    The easiest solution to create full width rows is to use a page builder.

    But if you still want to use the new default WordPress block editor, try this code in your child theme‘s functions.php file:

    function child_theme_setup() {
    	add_theme_support( 'align-wide' );
    }
    add_action( 'after_setup_theme', 'child_theme_setup', 100 );
    
    function child_theme_align_wide_styles() {
    	wp_add_inline_style(
    		'monument_valley',
    		'
    		.alignwide {
    			width: auto;
    		}
    
    		.alignfull {
    			width: 100vw;
    			max-width: 100vw;
    			margin-left: calc(50% - 50vw);
    		}
    
    		@media (min-width: 55em) {
    
    			.site-layout-boxed .alignfull {
    				padding-left: 1.62rem;
    				padding-right: 1.62rem;
    			}
    
    		}
    
    		@media (min-width: 80em) {
    
    			.alignwide {
    				margin-left: -7.5%;
    				margin-right: -7.5%;
    			}
    
    		}
    
    		.alignwide:not(:last-child),
    		.alignfull:not(:last-child) {
    			margin-bottom: 1.62em;
    		}
    		'
    	);
    }
    add_action( 'wp_enqueue_scripts', 'child_theme_align_wide_styles' );

    Please note that this is a fast fix and it’s not 100% fit for all possible Monument Valley theme layouts, so test it thoroughly, or use the full alignment cautiously.

    Best regards,

    Oliver Juhas
    WebMan Design

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

You must be logged in to reply to this topic.