Created
June 8, 2021 19:16
-
-
Save melchoyce/d7de1c80b515a77fd69c467d147cff2d to your computer and use it in GitHub Desktop.
WordPress Pattern: Two columns with full-width backgrounds
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- wp:columns {"align":"full"} --> | |
<div class="wp-block-columns alignfull"><!-- wp:column {"style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"}}}} --> | |
<div class="wp-block-column" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px"><!-- wp:cover {"url":"https://mywptesting.site/wp-content/uploads/2021/06/image-from-rawpixel-id-420162-jpeg-scaled.jpg","id":3080,"dimRatio":40,"minHeight":100,"minHeightUnit":"vh","align":"full"} --> | |
<div class="wp-block-cover alignfull has-background-dim-40 has-background-dim" style="min-height:100vh"><img class="wp-block-cover__image-background wp-image-3080" alt="" src="https://mywptesting.site/wp-content/uploads/2021/06/image-from-rawpixel-id-420162-jpeg-scaled.jpg" data-object-fit="cover"/><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"Write title…","style":{"typography":{"fontSize":"72px"}}} --> | |
<p class="has-text-align-center" style="font-size:72px"><strong>Flowers</strong></p> | |
<!-- /wp:paragraph --> | |
<!-- wp:buttons {"contentJustification":"center"} --> | |
<div class="wp-block-buttons is-content-justification-center"><!-- wp:button {"textColor":"background","className":"is-style-outline"} --> | |
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-background-color has-text-color"><strong>SHOP NOW</strong></a></div> | |
<!-- /wp:button --></div> | |
<!-- /wp:buttons --></div></div> | |
<!-- /wp:cover --></div> | |
<!-- /wp:column --> | |
<!-- wp:column {"style":{"spacing":{"padding":{"top":"0px","right":"0px","bottom":"0px","left":"0px"}}}} --> | |
<div class="wp-block-column" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px"><!-- wp:cover {"url":"https://mywptesting.site/wp-content/uploads/2021/06/image-from-rawpixel-id-420225-jpeg-scaled.jpg","id":3081,"dimRatio":40,"minHeight":100,"minHeightUnit":"vh","align":"full"} --> | |
<div class="wp-block-cover alignfull has-background-dim-40 has-background-dim" style="min-height:100vh"><img class="wp-block-cover__image-background wp-image-3081" alt="" src="https://mywptesting.site/wp-content/uploads/2021/06/image-from-rawpixel-id-420225-jpeg-scaled.jpg" data-object-fit="cover"/><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"Write title…","style":{"typography":{"fontSize":"72px"}}} --> | |
<p class="has-text-align-center" style="font-size:72px"><strong>Seaweed</strong></p> | |
<!-- /wp:paragraph --> | |
<!-- wp:buttons {"contentJustification":"center"} --> | |
<div class="wp-block-buttons is-content-justification-center"><!-- wp:button {"textColor":"background","className":"is-style-outline"} --> | |
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-background-color has-text-color"><strong>SHOP NOW</strong></a></div> | |
<!-- /wp:button --></div> | |
<!-- /wp:buttons --></div></div> | |
<!-- /wp:cover --></div> | |
<!-- /wp:column --></div> | |
<!-- /wp:columns --> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment