{"id":346807,"date":"2023-06-22T11:21:37","date_gmt":"2023-06-22T11:21:37","guid":{"rendered":"https:\/\/wordpress.org\/patterns\/?post_type=wporg-pattern&#038;p=346807"},"modified":"2023-06-22T11:21:37","modified_gmt":"2023-06-22T11:21:37","slug":"step-process-with-four-steps","status":"publish","type":"wporg-pattern","link":"https:\/\/it.wordpress.org\/patterns\/pattern\/step-process-with-four-steps\/","title":{"rendered":"Step Process with four steps"},"content":{"rendered":"\n<div class=\"wp-block-columns alignwide has-white-background-color has-background is-layout-flex wp-container-core-columns-is-layout-a9b868e6 wp-block-columns-is-layout-flex\" style=\"padding-top:70px;padding-right:20px;padding-bottom:70px;padding-left:20px\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h2 class=\"wp-block-heading has-text-align-center\" style=\"margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;font-style:normal;font-weight:600\">Why do we use it?<\/h2>\n\n\n\n<p class=\"has-text-align-center wp-block-paragraph\" style=\"padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px\">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.<br>The point of using Lorem Ipsum is that it has a more-or-less normal distribution<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d085ea9 wp-block-columns-is-layout-flex\" style=\"margin-top:50px;margin-bottom:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px\">\n<div class=\"wp-block-column has-background is-layout-flow wp-block-column-is-layout-flow\" style=\"background-color:#eeeeee;padding-top:40px;padding-right:30px;padding-bottom:40px;padding-left:30px\">\n<h2 class=\"wp-block-heading\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:700\">01<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-size:22px;font-style:normal;font-weight:500\">DESIGN<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:400\">The point of using Lorem Ipsum is that it has a more-or-less normal distribution<\/p>\n\n\n\n<p class=\"wp-block-paragraph\" style=\"margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;font-style:normal;font-weight:400\"><a href=\"#\">Learn More <span aria-hidden=\"true\" class=\"wp-exclude-emoji\">\u2192<\/span><\/a><\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column has-background is-layout-flow wp-block-column-is-layout-flow\" style=\"background-color:#0000ff;padding-top:40px;padding-right:30px;padding-bottom:40px;padding-left:30px\">\n<h2 class=\"wp-block-heading has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:700\">02<\/h2>\n\n\n\n<h3 class=\"wp-block-heading has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-size:22px;font-style:normal;font-weight:500\">PATTERNS<\/h3>\n\n\n\n<p class=\"has-white-color has-text-color wp-block-paragraph\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:400\">The point of using Lorem Ipsum is that it has a more-or-less normal distribution<\/p>\n\n\n\n<p class=\"has-white-color has-text-color has-link-color wp-elements-67c092a2555ac18a14feec0dd3442a43 wp-block-paragraph\" style=\"margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;font-style:normal;font-weight:400\"><a href=\"#\">Learn More <span aria-hidden=\"true\" class=\"wp-exclude-emoji\">\u2192<\/span><\/a><\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column has-background is-layout-flow wp-block-column-is-layout-flow\" style=\"background-color:#000099;padding-top:40px;padding-right:30px;padding-bottom:40px;padding-left:30px\">\n<h2 class=\"wp-block-heading has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:700\">03<\/h2>\n\n\n\n<h3 class=\"wp-block-heading has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-size:22px;font-style:normal;font-weight:500\">LAYOUTS<\/h3>\n\n\n\n<p class=\"has-white-color has-text-color wp-block-paragraph\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:400\">The point of using Lorem Ipsum is that it has a more-or-less normal distribution<\/p>\n\n\n\n<p class=\"has-white-color has-text-color has-link-color wp-elements-67c092a2555ac18a14feec0dd3442a43 wp-block-paragraph\" style=\"margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;font-style:normal;font-weight:400\"><a href=\"#\">Learn More <span aria-hidden=\"true\" class=\"wp-exclude-emoji\">\u2192<\/span><\/a><\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column has-black-background-color has-background is-layout-flow wp-block-column-is-layout-flow\" style=\"padding-top:40px;padding-right:30px;padding-bottom:40px;padding-left:30px\">\n<h2 class=\"wp-block-heading has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:700\">04<\/h2>\n\n\n\n<h3 class=\"wp-block-heading has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-size:22px;font-style:normal;font-weight:500\">STYLES<\/h3>\n\n\n\n<p class=\"has-white-color has-text-color wp-block-paragraph\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:400\">The point of using Lorem Ipsum is that it has a more-or-less normal distribution<\/p>\n\n\n\n<p class=\"has-white-color has-text-color has-link-color wp-elements-67c092a2555ac18a14feec0dd3442a43 wp-block-paragraph\" style=\"margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;font-style:normal;font-weight:400\"><a href=\"#\">Learn More <span aria-hidden=\"true\" class=\"wp-exclude-emoji\">\u2192<\/span><\/a><\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"author":15357679,"parent":0,"template":"","meta":{"wpop_keywords":"steps, process, step process, four columns, four steps, why with steps","wpop_description":"Step Process which included four steps and four columns.","wpop_viewport_width":800,"wpop_block_types":[],"wpop_locale":"en_US","wpop_wp_version":"","wpop_contains_block_types":"core\/column,core\/columns,core\/heading,core\/paragraph","footnotes":""},"pattern-categories":[47,3,63,6],"pattern-keywords":[],"wporg-pattern-flag-reason":[],"class_list":["post-346807","wporg-pattern","type-wporg-pattern","status-publish","hentry","wporg-pattern-category-about","wporg-pattern-category-columns","wporg-pattern-category-services","wporg-pattern-category-text"],"category_slugs":["about","columns","services","text"],"keyword_slugs":[],"pattern_content":"<!-- wp:columns {\"align\":\"wide\",\"style\":{\"spacing\":{\"padding\":{\"top\":\"70px\",\"bottom\":\"70px\",\"right\":\"20px\",\"left\":\"20px\"}}},\"backgroundColor\":\"white\"} -->\n<div class=\"wp-block-columns alignwide has-white-background-color has-background\" style=\"padding-top:70px;padding-right:20px;padding-bottom:70px;padding-left:20px\"><!-- wp:column -->\n<div class=\"wp-block-column\"><!-- wp:heading {\"textAlign\":\"center\",\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"0px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"600\"}}} -->\n<h2 class=\"wp-block-heading has-text-align-center\" style=\"margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;font-style:normal;font-weight:600\">Why do we use it?<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph {\"align\":\"center\",\"style\":{\"spacing\":{\"padding\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"0px\",\"left\":\"0px\"}}}} -->\n<p class=\"has-text-align-center\" style=\"padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px\">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.<br>The point of using Lorem Ipsum is that it has a more-or-less normal distribution<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:columns {\"style\":{\"spacing\":{\"padding\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"0px\",\"left\":\"0px\"},\"margin\":{\"top\":\"50px\",\"bottom\":\"0px\"},\"blockGap\":{\"top\":\"0px\",\"left\":\"0px\"}}}} -->\n<div class=\"wp-block-columns\" style=\"margin-top:50px;margin-bottom:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px\"><!-- wp:column {\"style\":{\"spacing\":{\"padding\":{\"top\":\"40px\",\"right\":\"30px\",\"bottom\":\"40px\",\"left\":\"30px\"}},\"color\":{\"background\":\"#eeeeee\"}}} -->\n<div class=\"wp-block-column has-background\" style=\"background-color:#eeeeee;padding-top:40px;padding-right:30px;padding-bottom:40px;padding-left:30px\"><!-- wp:heading {\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"15px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"700\"}}} -->\n<h2 class=\"wp-block-heading\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:700\">01<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:heading {\"level\":3,\"style\":{\"typography\":{\"fontSize\":\"22px\",\"fontStyle\":\"normal\",\"fontWeight\":\"500\"},\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"15px\",\"left\":\"0px\"}}}} -->\n<h3 class=\"wp-block-heading\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-size:22px;font-style:normal;font-weight:500\">DESIGN<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph {\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"15px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"400\"}}} -->\n<p style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:400\">The point of using Lorem Ipsum is that it has a more-or-less normal distribution<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph {\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"0px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"400\"}}} -->\n<p style=\"margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;font-style:normal;font-weight:400\"><a href=\"#\">Learn More \u2192<\/a><\/p>\n<!-- \/wp:paragraph --><\/div>\n<!-- \/wp:column -->\n\n<!-- wp:column {\"style\":{\"color\":{\"background\":\"#0000ff\"},\"spacing\":{\"padding\":{\"top\":\"40px\",\"right\":\"30px\",\"bottom\":\"40px\",\"left\":\"30px\"}}}} -->\n<div class=\"wp-block-column has-background\" style=\"background-color:#0000ff;padding-top:40px;padding-right:30px;padding-bottom:40px;padding-left:30px\"><!-- wp:heading {\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"15px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"700\"}},\"textColor\":\"white\"} -->\n<h2 class=\"wp-block-heading has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:700\">02<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:heading {\"level\":3,\"style\":{\"typography\":{\"fontSize\":\"22px\",\"fontStyle\":\"normal\",\"fontWeight\":\"500\"},\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"15px\",\"left\":\"0px\"}}},\"textColor\":\"white\"} -->\n<h3 class=\"wp-block-heading has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-size:22px;font-style:normal;font-weight:500\">PATTERNS<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph {\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"15px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"400\"}},\"textColor\":\"white\"} -->\n<p class=\"has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:400\">The point of using Lorem Ipsum is that it has a more-or-less normal distribution<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph {\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"0px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"400\"},\"elements\":{\"link\":{\"color\":{\"text\":\"var:preset|color|white\"}}}},\"textColor\":\"white\"} -->\n<p class=\"has-white-color has-text-color has-link-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;font-style:normal;font-weight:400\"><a href=\"#\">Learn More \u2192<\/a><\/p>\n<!-- \/wp:paragraph --><\/div>\n<!-- \/wp:column -->\n\n<!-- wp:column {\"style\":{\"color\":{\"background\":\"#000099\"},\"spacing\":{\"padding\":{\"top\":\"40px\",\"right\":\"30px\",\"bottom\":\"40px\",\"left\":\"30px\"}}}} -->\n<div class=\"wp-block-column has-background\" style=\"background-color:#000099;padding-top:40px;padding-right:30px;padding-bottom:40px;padding-left:30px\"><!-- wp:heading {\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"15px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"700\"}},\"textColor\":\"white\"} -->\n<h2 class=\"wp-block-heading has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:700\">03<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:heading {\"level\":3,\"style\":{\"typography\":{\"fontSize\":\"22px\",\"fontStyle\":\"normal\",\"fontWeight\":\"500\"},\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"15px\",\"left\":\"0px\"}}},\"textColor\":\"white\"} -->\n<h3 class=\"wp-block-heading has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-size:22px;font-style:normal;font-weight:500\">LAYOUTS<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph {\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"15px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"400\"}},\"textColor\":\"white\"} -->\n<p class=\"has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:400\">The point of using Lorem Ipsum is that it has a more-or-less normal distribution<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph {\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"0px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"400\"},\"elements\":{\"link\":{\"color\":{\"text\":\"var:preset|color|white\"}}}},\"textColor\":\"white\"} -->\n<p class=\"has-white-color has-text-color has-link-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;font-style:normal;font-weight:400\"><a href=\"#\">Learn More \u2192<\/a><\/p>\n<!-- \/wp:paragraph --><\/div>\n<!-- \/wp:column -->\n\n<!-- wp:column {\"style\":{\"spacing\":{\"padding\":{\"top\":\"40px\",\"right\":\"30px\",\"bottom\":\"40px\",\"left\":\"30px\"}}},\"backgroundColor\":\"black\"} -->\n<div class=\"wp-block-column has-black-background-color has-background\" style=\"padding-top:40px;padding-right:30px;padding-bottom:40px;padding-left:30px\"><!-- wp:heading {\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"15px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"700\"}},\"textColor\":\"white\"} -->\n<h2 class=\"wp-block-heading has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:700\">04<\/h2>\n<!-- \/wp:heading -->\n\n<!-- wp:heading {\"level\":3,\"style\":{\"typography\":{\"fontSize\":\"22px\",\"fontStyle\":\"normal\",\"fontWeight\":\"500\"},\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"15px\",\"left\":\"0px\"}}},\"textColor\":\"white\"} -->\n<h3 class=\"wp-block-heading has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-size:22px;font-style:normal;font-weight:500\">STYLES<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph {\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"15px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"400\"}},\"textColor\":\"white\"} -->\n<p class=\"has-white-color has-text-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:15px;margin-left:0px;font-style:normal;font-weight:400\">The point of using Lorem Ipsum is that it has a more-or-less normal distribution<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph {\"style\":{\"spacing\":{\"margin\":{\"top\":\"0px\",\"right\":\"0px\",\"bottom\":\"0px\",\"left\":\"0px\"}},\"typography\":{\"fontStyle\":\"normal\",\"fontWeight\":\"400\"},\"elements\":{\"link\":{\"color\":{\"text\":\"var:preset|color|white\"}}}},\"textColor\":\"white\"} -->\n<p class=\"has-white-color has-text-color has-link-color\" style=\"margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;font-style:normal;font-weight:400\"><a href=\"#\">Learn More \u2192<\/a><\/p>\n<!-- \/wp:paragraph --><\/div>\n<!-- \/wp:column --><\/div>\n<!-- \/wp:columns --><\/div>\n<!-- \/wp:column --><\/div>\n<!-- \/wp:columns -->","favorite_count":16,"author_meta":{"name":"Ronik@UnlimitedWP","url":"https:\/\/it.wordpress.org\/patterns\/author\/jdsofttech","avatar":"https:\/\/secure.gravatar.com\/avatar\/88c19f92e15eb3608b6ff3a4330f95b40fcdfc6459e57a53ccdbdaed6945f1bf?s=64&d=mm&r=g"},"unlisted_reason":[],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern\/346807","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern"}],"about":[{"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/types\/wporg-pattern"}],"version-history":[{"count":7,"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern\/346807\/revisions"}],"predecessor-version":[{"id":348255,"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern\/346807\/revisions\/348255"}],"author":[{"embeddable":true,"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wporg\/v1\/users\/jdsofttech"}],"wp:attachment":[{"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/media?parent=346807"}],"wp:term":[{"taxonomy":"wporg-pattern-category","embeddable":true,"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/pattern-categories?post=346807"},{"taxonomy":"wporg-pattern-keyword","embeddable":true,"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/pattern-keywords?post=346807"},{"taxonomy":"wporg-pattern-flag-reason","embeddable":true,"href":"https:\/\/it.wordpress.org\/patterns\/wp-json\/wp\/v2\/wporg-pattern-flag-reason?post=346807"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}