{"id":196842,"date":"2022-04-22T14:56:08","date_gmt":"2022-04-22T14:56:08","guid":{"rendered":"https:\/\/wordpress.org\/patterns\/pattern\/elegance-call-to-action-with-parallax-image-stretched-to-right-edge-pt_ao\/"},"modified":"2026-04-19T16:59:38","modified_gmt":"2026-04-19T16:59:38","slug":"elegance-call-to-action-with-parallax-image-stretched-to-right-edge-38","status":"publish","type":"wporg-pattern","link":"https:\/\/wordpress.org\/patterns\/pattern\/elegance-call-to-action-with-parallax-image-stretched-to-right-edge-38\/","title":{"rendered":"Elegance: Call to action with parallax image stretched to right edge"},"content":{"rendered":"\n<div class=\"wp-block-cover alignfull is-light has-parallax\" style=\"padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;min-height:300px;aspect-ratio:unset;\"><span aria-hidden=\"true\" class=\"wp-block-cover__background has-background-dim-0 has-background-dim\"><\/span><div role=\"img\" class=\"wp-block-cover__image-background has-parallax\" style=\"background-position:50% 50%;background-image:url(https:\/\/pd.w.org\/2022\/01\/43261db65cb8bb697.11676174.jpeg)\"><\/div><div class=\"wp-block-cover__inner-container is-layout-flow wp-block-cover-is-layout-flow\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-ead13bf8 wp-block-columns-is-layout-flex\" style=\"margin-top:0;margin-bottom:0\">\n<div class=\"wp-block-column has-white-background-color has-background is-layout-flow wp-block-column-is-layout-flow\"><\/div>\n\n\n\n<div class=\"wp-block-column has-black-color has-white-background-color has-text-color has-background is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:600px\">\n<div class=\"wp-block-columns is-not-stacked-on-mobile has-white-background-color has-background is-layout-flex wp-container-core-columns-is-layout-8b0af5c3 wp-block-columns-is-layout-flex\" style=\"margin-top:0px;margin-bottom:0px;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:100px\">\n<div class=\"wp-block-group has-luminous-vivid-orange-background-color has-background is-layout-flow wp-block-group-is-layout-flow\" style=\"border-bottom-right-radius:100px;margin-top:0px;margin-bottom:0px;padding-top:100px;padding-right:0px;padding-bottom:0px;padding-left:0px\"><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\"><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group has-black-color has-text-color is-layout-flow wp-block-group-is-layout-flow\" style=\"margin-top:0px;margin-bottom:0px;padding-top:2em;padding-right:5%;padding-bottom:2em;padding-left:5%\">\n<h2 class=\"wp-block-heading\" style=\"margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;font-size:14px;font-style:normal;font-weight:700;letter-spacing:0.2em;line-height:1.2;text-transform:uppercase\">\u2014 Parallax to the edge<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\" style=\"font-size:32px;font-style:normal;font-weight:700;line-height:1.2\">Creative. Unique.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Just a short sentence. Write your own copy text here. This is just a demo text you should overwrite. Just a short sentence. Write your own copy text here.<\/p>\n\n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\" style=\"margin-top:50px\">\n<div class=\"wp-block-button has-custom-font-size\" style=\"font-size:16px\"><a class=\"wp-block-button__link has-white-color has-black-background-color has-text-color has-background wp-element-button\" style=\"border-radius:100px\">Contacte-nos<\/a><\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:600px\">\n<div style=\"height:200px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\"><\/div>\n<\/div>\n<\/div><\/div>\n","protected":false},"author":13265138,"parent":40042,"template":"","meta":{"_crdt_document":"","jetpack_post_was_ever_published":false,"wpop_keywords":"elegant, cta, call to action, parallax, stretched, edge","wpop_description":"Creatively set 3 columns layout with Cover blocks with fixed background image. First column is empty, while other 2 contain Cover block with the same background image. Thus creating an effect of image stretching to the right edge of the screen. There is white overlay in the middle Cover block with a title, description and a button.","wpop_viewport_width":800,"wpop_block_types":[""],"wpop_locale":"pt_AO","wpop_wp_version":"","wpop_contains_block_types":"core\/button,core\/buttons,core\/column,core\/columns,core\/cover,core\/group,core\/heading,core\/paragraph,core\/spacer","footnotes":""},"pattern-categories":[2,3,13,6],"pattern-keywords":[],"wporg-pattern-flag-reason":[],"class_list":["post-196842","wporg-pattern","type-wporg-pattern","status-publish","hentry","wporg-pattern-category-buttons","wporg-pattern-category-columns","wporg-pattern-category-images","wporg-pattern-category-text"],"category_slugs":["buttons","columns","images","text"],"keyword_slugs":[],"pattern_content":"<!-- wp:cover {\"url\":\"https:\/\/pd.w.org\/2022\/01\/43261db65cb8bb697.11676174.jpeg\",\"hasParallax\":true,\"dimRatio\":0,\"minHeight\":300,\"minHeightUnit\":\"px\",\"isDark\":false,\"align\":\"full\",\"style\":{\"color\":[],\"spacing\":{\"padding\":{\"top\":\"0\",\"right\":\"0\",\"bottom\":\"0\",\"left\":\"0\"}}}} -->\n<div class=\"wp-block-cover alignfull is-light has-parallax\" style=\"padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;min-height:300px\"><span aria-hidden=\"true\" class=\"wp-block-cover__background has-background-dim-0 has-background-dim\"><\/span><div role=\"img\" class=\"wp-block-cover__image-background has-parallax\" style=\"background-position:50% 50%;background-image:url(https:\/\/pd.w.org\/2022\/01\/43261db65cb8bb697.11676174.jpeg)\"><\/div><div class=\"wp-block-cover__inner-container\"><!-- wp:columns {\"style\":{\"spacing\":{\"blockGap\":{\"top\":\"0\",\"left\":\"0\"},\"margin\":{\"top\":\"0\",\"bottom\":\"0\"}}}} -->\n<div class=\"wp-block-columns\" style=\"margin-top:0;margin-bottom:0\"><!-- wp:column {\"backgroundColor\":\"white\"} -->\n<div class=\"wp-block-column has-white-background-color has-background\"><\/div>\n<!-- \/wp:column -->\n\n<!-- wp:column {\"width\":\"600px\",\"backgroundColor\":\"white\",\"textColor\":\"black\"} -->\n<div class=\"wp-block-column has-black-color has-white-background-color has-text-color has-background\" style=\"flex-basis:600px\"><!-- wp:columns {\"isStackedOnMobile\":false,\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"bottom\":\"0px\"},\"blockGap\":{\"top\":\"0px\",\"left\":\"0px\"},\"padding\":{\"top\":\"0\",\"right\":\"0\",\"bottom\":\"0\",\"left\":\"0\"}}},\"backgroundColor\":\"white\"} -->\n<div class=\"wp-block-columns is-not-stacked-on-mobile has-white-background-color has-background\" style=\"margin-top:0px;margin-bottom:0px;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0\"><!-- wp:column {\"width\":\"100px\",\"layout\":{\"type\":\"default\"}} -->\n<div class=\"wp-block-column\" style=\"flex-basis:100px\"><!-- wp:group {\"style\":{\"spacing\":{\"padding\":{\"top\":\"100px\",\"right\":\"0px\",\"bottom\":\"0px\",\"left\":\"0px\"},\"margin\":{\"top\":\"0px\",\"bottom\":\"0px\"}},\"border\":{\"radius\":{\"bottomRight\":\"100px\"}}},\"backgroundColor\":\"luminous-vivid-orange\"} -->\n<div class=\"wp-block-group has-luminous-vivid-orange-background-color has-background\" style=\"border-bottom-right-radius:100px;margin-top:0px;margin-bottom:0px;padding-top:100px;padding-right:0px;padding-bottom:0px;padding-left:0px\"><\/div>\n<!-- \/wp:group --><\/div>\n<!-- \/wp:column -->\n\n<!-- wp:column {\"width\":\"\"} -->\n<div class=\"wp-block-column\"><\/div>\n<!-- \/wp:column --><\/div>\n<!-- \/wp:columns -->\n\n<!-- wp:group {\"style\":{\"spacing\":{\"padding\":{\"right\":\"5%\",\"left\":\"5%\",\"top\":\"2em\",\"bottom\":\"2em\"},\"margin\":{\"top\":\"0px\",\"bottom\":\"0px\"}}},\"textColor\":\"black\"} -->\n<div class=\"wp-block-group has-black-color has-text-color\" style=\"margin-top:0px;margin-bottom:0px;padding-top:2em;padding-right:5%;padding-bottom:2em;padding-left:5%\"><!-- wp:heading {\"style\":{\"typography\":{\"textTransform\":\"uppercase\",\"letterSpacing\":\"0.2em\",\"fontSize\":\"14px\",\"fontStyle\":\"normal\",\"fontWeight\":\"700\",\"lineHeight\":\"1.2\"},\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"0px\",\"left\":\"0px\"}}}} -->\n<h2 class=\"wp-block-heading\" style=\"margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;font-size:14px;font-style:normal;font-weight:700;letter-spacing:0.2em;line-height:1.2;text-transform:uppercase\">\u2014 Parallax to the edge<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph {\"style\":{\"typography\":{\"fontSize\":\"32px\",\"fontStyle\":\"normal\",\"fontWeight\":\"700\",\"lineHeight\":\"1.2\"}}} -->\n<p style=\"font-size:32px;font-style:normal;font-weight:700;line-height:1.2\">Creative. Unique.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Just a short sentence. Write your own copy text here. This is just a demo text you should overwrite. Just a short sentence. Write your own copy text here.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:buttons {\"style\":{\"spacing\":{\"margin\":{\"top\":\"50px\"}}}} -->\n<div class=\"wp-block-buttons\" style=\"margin-top:50px\"><!-- wp:button {\"backgroundColor\":\"black\",\"textColor\":\"white\",\"style\":{\"border\":{\"radius\":\"100px\"},\"typography\":{\"fontSize\":\"16px\"}}} -->\n<div class=\"wp-block-button has-custom-font-size\" style=\"font-size:16px\"><a class=\"wp-block-button__link has-white-color has-black-background-color has-text-color has-background wp-element-button\" style=\"border-radius:100px\">Contacte-nos<\/a><\/div>\n<!-- \/wp:button --><\/div>\n<!-- \/wp:buttons --><\/div>\n<!-- \/wp:group --><\/div>\n<!-- \/wp:column -->\n\n<!-- wp:column {\"width\":\"600px\"} -->\n<div class=\"wp-block-column\" style=\"flex-basis:600px\"><!-- wp:spacer {\"height\":\"200px\"} -->\n<div style=\"height:200px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n<!-- \/wp:spacer --><\/div>\n<!-- \/wp:column -->\n\n<!-- wp:column -->\n<div class=\"wp-block-column\"><\/div>\n<!-- \/wp:column --><\/div>\n<!-- \/wp:columns --><\/div><\/div>\n<!-- \/wp:cover -->","favorite_count":0,"author_meta":{"name":"WebMan Design | Oliver Juhas","url":"https:\/\/wordpress.org\/patterns\/author\/webmandesign","avatar":"https:\/\/secure.gravatar.com\/avatar\/34c19c0923466a5bf3c232ad7885b9985cd075c79ac0beb4b802c3ee80d71452?s=64&d=mm&r=g"},"unlisted_reason":[],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern\/196842","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern"}],"about":[{"href":"https:\/\/wordpress.org\/patterns\/wp-json\/wp\/v2\/types\/wporg-pattern"}],"version-history":[{"count":2,"href":"https:\/\/wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern\/196842\/revisions"}],"predecessor-version":[{"id":289586,"href":"https:\/\/wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern\/196842\/revisions\/289586"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.org\/patterns\/wp-json\/wporg\/v1\/users\/webmandesign"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/patterns\/wp-json\/wp\/v2\/media?parent=196842"}],"wp:term":[{"taxonomy":"wporg-pattern-category","embeddable":true,"href":"https:\/\/wordpress.org\/patterns\/wp-json\/wp\/v2\/pattern-categories?post=196842"},{"taxonomy":"wporg-pattern-keyword","embeddable":true,"href":"https:\/\/wordpress.org\/patterns\/wp-json\/wp\/v2\/pattern-keywords?post=196842"},{"taxonomy":"wporg-pattern-flag-reason","embeddable":true,"href":"https:\/\/wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern-flag-reason?post=196842"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}