v0.2.0 - Design Editor: templates, patterns, header/footer variations

Full Design Editor compatibility with custom block categories, page templates,
header/footer variations, and navigation styles. Both FSE (admin) and Twig
(frontend) sides kept in sync.

Co-Authored-By: Claude <noreply@anthropic.com>

patterns/component-accordion.php

@@ -0,0 +1,38 @@
+<?php
+/**
+ * Title: Accordion
+ * Slug: wp-bootstrap/component-accordion
+ * Categories: wp-bootstrap-components, text
+ * Description: An accordion section using details blocks with summary and content paragraphs.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|70","bottom":"var:preset|spacing|70"}}},"layout":{"type":"constrained","contentSize":"720px"}} -->
+<div class="wp-block-group alignfull" style="padding-top:var(--wp--preset--spacing--70);padding-bottom:var(--wp--preset--spacing--70)"><!-- wp:heading {"textAlign":"center","fontSize":"xx-large"} -->
+<h2 class="wp-block-heading has-text-align-center has-xx-large-font-size"><?php esc_html_e( 'Accordion', 'wp-bootstrap' ); ?></h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","textColor":"secondary"} -->
+<p class="has-text-align-center has-secondary-color has-text-color"><?php esc_html_e( 'Click on each item to expand and reveal its content.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:details -->
+<details class="wp-block-details"><summary><?php esc_html_e( 'Accordion Item One', 'wp-bootstrap' ); ?></summary><!-- wp:paragraph {"textColor":"secondary"} -->
+<p class="has-secondary-color has-text-color"><?php esc_html_e( 'This is the content for the first accordion item. You can add any blocks inside this details element to create rich, expandable content sections.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></details>
+<!-- /wp:details -->
+
+<!-- wp:details -->
+<details class="wp-block-details"><summary><?php esc_html_e( 'Accordion Item Two', 'wp-bootstrap' ); ?></summary><!-- wp:paragraph {"textColor":"secondary"} -->
+<p class="has-secondary-color has-text-color"><?php esc_html_e( 'This is the content for the second accordion item. Details blocks are a native HTML element that provide toggle functionality without JavaScript.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></details>
+<!-- /wp:details -->
+
+<!-- wp:details -->
+<details class="wp-block-details"><summary><?php esc_html_e( 'Accordion Item Three', 'wp-bootstrap' ); ?></summary><!-- wp:paragraph {"textColor":"secondary"} -->
+<p class="has-secondary-color has-text-color"><?php esc_html_e( 'This is the content for the third accordion item. Use accordions to organize frequently asked questions, feature lists, or any content that benefits from progressive disclosure.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></details>
+<!-- /wp:details --></div>
+<!-- /wp:group -->

patterns/component-card-group.php

@@ -0,0 +1,50 @@
+<?php
+/**
+ * Title: Card Group
+ * Slug: wp-bootstrap/component-card-group
+ * Categories: wp-bootstrap-components
+ * Description: A three-column card group with shadow-styled cards, each containing a heading and paragraph.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|70","bottom":"var:preset|spacing|70"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull" style="padding-top:var(--wp--preset--spacing--70);padding-bottom:var(--wp--preset--spacing--70)"><!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":{"left":"var:preset|spacing|40"}}}} -->
+<div class="wp-block-columns alignwide"><!-- wp:column -->
+<div class="wp-block-column"><!-- wp:group {"className":"is-style-card-shadow","style":{"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|50","left":"var:preset|spacing|40","right":"var:preset|spacing|40"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group is-style-card-shadow" style="padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--40)"><!-- wp:heading {"level":3} -->
+<h3 class="wp-block-heading"><?php esc_html_e( 'Card One', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"textColor":"secondary"} -->
+<p class="has-secondary-color has-text-color"><?php esc_html_e( 'Add a short description for this card. Cards are a great way to organize and present related content.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:column -->
+
+<!-- wp:column -->
+<div class="wp-block-column"><!-- wp:group {"className":"is-style-card-shadow","style":{"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|50","left":"var:preset|spacing|40","right":"var:preset|spacing|40"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group is-style-card-shadow" style="padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--40)"><!-- wp:heading {"level":3} -->
+<h3 class="wp-block-heading"><?php esc_html_e( 'Card Two', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"textColor":"secondary"} -->
+<p class="has-secondary-color has-text-color"><?php esc_html_e( 'Add a short description for this card. Cards are a great way to organize and present related content.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:column -->
+
+<!-- wp:column -->
+<div class="wp-block-column"><!-- wp:group {"className":"is-style-card-shadow","style":{"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|50","left":"var:preset|spacing|40","right":"var:preset|spacing|40"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group is-style-card-shadow" style="padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--40)"><!-- wp:heading {"level":3} -->
+<h3 class="wp-block-heading"><?php esc_html_e( 'Card Three', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"textColor":"secondary"} -->
+<p class="has-secondary-color has-text-color"><?php esc_html_e( 'Add a short description for this card. Cards are a great way to organize and present related content.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns --></div>
+<!-- /wp:group -->

patterns/footer-columns.php

@@ -0,0 +1,85 @@
+<?php
+/**
+ * Title: Footer - Multi-Column
+ * Slug: wp-bootstrap/footer-columns
+ * Categories: footer
+ * Block Types: core/template-part/footer
+ * Description: Multi-column footer with site info, navigation, and credits.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|60","bottom":"var:preset|spacing|50"}}},"backgroundColor":"dark","textColor":"base","layout":{"type":"constrained"}} -->
+<div class="wp-block-group has-base-color has-dark-background-color has-text-color has-background" style="padding-top:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--50)">
+	<!-- wp:columns {"align":"wide"} -->
+	<div class="wp-block-columns alignwide">
+		<!-- wp:column -->
+		<div class="wp-block-column">
+			<!-- wp:site-title {"level":3} /-->
+			<!-- wp:site-tagline {"fontSize":"small"} /-->
+			<!-- wp:paragraph {"fontSize":"small"} -->
+			<p class="has-small-font-size"><?php esc_html_e( 'A modern WordPress theme built with Bootstrap 5.', 'wp-bootstrap' ); ?></p>
+			<!-- /wp:paragraph -->
+		</div>
+		<!-- /wp:column -->
+
+		<!-- wp:column -->
+		<div class="wp-block-column">
+			<!-- wp:heading {"level":4,"fontSize":"medium"} -->
+			<h4 class="wp-block-heading has-medium-font-size"><?php esc_html_e( 'Navigation', 'wp-bootstrap' ); ?></h4>
+			<!-- /wp:heading -->
+			<!-- wp:navigation {"overlayMenu":"never","layout":{"type":"flex","orientation":"vertical"},"style":{"spacing":{"blockGap":"var:preset|spacing|10"}}} /-->
+		</div>
+		<!-- /wp:column -->
+
+		<!-- wp:column -->
+		<div class="wp-block-column">
+			<!-- wp:heading {"level":4,"fontSize":"medium"} -->
+			<h4 class="wp-block-heading has-medium-font-size"><?php esc_html_e( 'About', 'wp-bootstrap' ); ?></h4>
+			<!-- /wp:heading -->
+			<!-- wp:paragraph {"fontSize":"small"} -->
+			<p class="has-small-font-size"><?php esc_html_e( 'This theme is proudly built with Bootstrap 5 and WordPress Full Site Editing.', 'wp-bootstrap' ); ?></p>
+			<!-- /wp:paragraph -->
+		</div>
+		<!-- /wp:column -->
+	</div>
+	<!-- /wp:columns -->
+
+	<!-- wp:spacer {"height":"var:preset|spacing|40"} -->
+	<div style="height:var(--wp--preset--spacing--40)" aria-hidden="true" class="wp-block-spacer"></div>
+	<!-- /wp:spacer -->
+
+	<!-- wp:separator {"align":"wide","className":"is-style-separator-wide"} -->
+	<hr class="wp-block-separator alignwide has-alpha-channel-opacity is-style-separator-wide"/>
+	<!-- /wp:separator -->
+
+	<!-- wp:group {"align":"wide","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
+	<div class="wp-block-group alignwide">
+		<!-- wp:paragraph {"fontSize":"small"} -->
+		<p class="has-small-font-size">
+			<?php
+			printf(
+				/* translators: Copyright notice. %1$s: Year, %2$s: Site title. */
+				esc_html__( '&copy; %1$s %2$s', 'wp-bootstrap' ),
+				esc_html( gmdate( 'Y' ) ),
+				esc_html( get_bloginfo( 'name' ) )
+			);
+			?>
+		</p>
+		<!-- /wp:paragraph -->
+		<!-- wp:paragraph {"fontSize":"small"} -->
+		<p class="has-small-font-size">
+			<?php
+			printf(
+				/* translators: Powered by WordPress. %s: WordPress link. */
+				esc_html__( 'Powered by %s', 'wp-bootstrap' ),
+				'<a href="' . esc_url( __( 'https://wordpress.org', 'wp-bootstrap' ) ) . '" rel="nofollow">WordPress</a>'
+			);
+			?>
+		</p>
+		<!-- /wp:paragraph -->
+	</div>
+	<!-- /wp:group -->
+</div>
+<!-- /wp:group -->

patterns/footer-minimal.php

@@ -0,0 +1,35 @@
+<?php
+/**
+ * Title: Footer - Minimal
+ * Slug: wp-bootstrap/footer-minimal
+ * Categories: footer
+ * Block Types: core/template-part/footer
+ * Description: Minimal single-line footer with copyright.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|40","bottom":"var:preset|spacing|40"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group" style="padding-top:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40)">
+	<!-- wp:separator {"className":"is-style-separator-wide","style":{"spacing":{"margin":{"bottom":"var:preset|spacing|40"}}}} -->
+	<hr class="wp-block-separator has-alpha-channel-opacity is-style-separator-wide" style="margin-bottom:var(--wp--preset--spacing--40)"/>
+	<!-- /wp:separator -->
+	<!-- wp:group {"align":"wide","layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
+	<div class="wp-block-group alignwide">
+		<!-- wp:paragraph {"fontSize":"small"} -->
+		<p class="has-small-font-size">
+			<?php
+			printf(
+				/* translators: Copyright notice. %1$s: Year, %2$s: Site title. */
+				esc_html__( '&copy; %1$s %2$s. All rights reserved.', 'wp-bootstrap' ),
+				esc_html( gmdate( 'Y' ) ),
+				esc_html( get_bloginfo( 'name' ) )
+			);
+			?>
+		</p>
+		<!-- /wp:paragraph -->
+	</div>
+	<!-- /wp:group -->
+</div>
+<!-- /wp:group -->

patterns/header-centered.php

@@ -0,0 +1,32 @@
+<?php
+/**
+ * Title: Header - Centered
+ * Slug: wp-bootstrap/header-centered
+ * Categories: header
+ * Block Types: core/template-part/header
+ * Description: Centered header with site title above navigation.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","layout":{"type":"default"}} -->
+<div class="wp-block-group alignfull">
+	<!-- wp:group {"layout":{"type":"constrained"}} -->
+	<div class="wp-block-group">
+		<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"var:preset|spacing|40","bottom":"var:preset|spacing|20"}}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"center"}} -->
+		<div class="wp-block-group alignwide" style="padding-top:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--20)">
+			<!-- wp:site-title {"level":0,"textAlign":"center"} /-->
+			<!-- wp:site-tagline {"textAlign":"center","fontSize":"small"} /-->
+		</div>
+		<!-- /wp:group -->
+		<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"var:preset|spacing|20","bottom":"var:preset|spacing|30"}}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
+		<div class="wp-block-group alignwide" style="padding-top:var(--wp--preset--spacing--20);padding-bottom:var(--wp--preset--spacing--30)">
+			<!-- wp:navigation {"overlayBackgroundColor":"base","overlayTextColor":"contrast","layout":{"type":"flex","justifyContent":"center","flexWrap":"wrap"}} /-->
+			<!-- wp:pattern {"slug":"wp-bootstrap/dark-mode-toggle"} /-->
+		</div>
+		<!-- /wp:group -->
+	</div>
+	<!-- /wp:group -->
+</div>
+<!-- /wp:group -->

patterns/header-transparent.php

@@ -0,0 +1,31 @@
+<?php
+/**
+ * Title: Header - Transparent
+ * Slug: wp-bootstrap/header-transparent
+ * Categories: header
+ * Block Types: core/template-part/header
+ * Description: Transparent header that overlays page content, ideal for hero sections.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"0","bottom":"0"}}},"layout":{"type":"default"}} -->
+<div class="wp-block-group alignfull" style="padding-top:0;padding-bottom:0">
+	<!-- wp:group {"layout":{"type":"constrained"}} -->
+	<div class="wp-block-group">
+		<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|30"}}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"space-between"}} -->
+		<div class="wp-block-group alignwide" style="padding-top:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--30)">
+			<!-- wp:site-title {"level":0,"style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}}}} /-->
+			<!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|20"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"right","verticalAlignment":"center"}} -->
+			<div class="wp-block-group">
+				<!-- wp:navigation {"overlayBackgroundColor":"base","overlayTextColor":"contrast","style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}}},"layout":{"type":"flex","justifyContent":"right","flexWrap":"wrap"}} /-->
+				<!-- wp:pattern {"slug":"wp-bootstrap/dark-mode-toggle"} /-->
+			</div>
+			<!-- /wp:group -->
+		</div>
+		<!-- /wp:group -->
+	</div>
+	<!-- /wp:group -->
+</div>
+<!-- /wp:group -->

patterns/layout-2-col.php

@@ -0,0 +1,34 @@
+<?php
+/**
+ * Title: Two Columns
+ * Slug: wp-bootstrap/layout-2-col
+ * Categories: wp-bootstrap-layout, columns
+ * Description: A two-column layout with equal width columns, each containing a heading and paragraph.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|60","bottom":"var:preset|spacing|60"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull" style="padding-top:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--60)"><!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":{"left":"var:preset|spacing|50"}}}} -->
+<div class="wp-block-columns alignwide"><!-- wp:column -->
+<div class="wp-block-column"><!-- wp:heading {"level":3,"fontSize":"x-large"} -->
+<h3 class="wp-block-heading has-x-large-font-size"><?php esc_html_e( 'Column One', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"textColor":"secondary"} -->
+<p class="has-secondary-color has-text-color"><?php esc_html_e( 'Add your content here. This column takes up half the available width on larger screens and stacks on mobile devices.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column -->
+
+<!-- wp:column -->
+<div class="wp-block-column"><!-- wp:heading {"level":3,"fontSize":"x-large"} -->
+<h3 class="wp-block-heading has-x-large-font-size"><?php esc_html_e( 'Column Two', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"textColor":"secondary"} -->
+<p class="has-secondary-color has-text-color"><?php esc_html_e( 'Add your content here. This column takes up half the available width on larger screens and stacks on mobile devices.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns --></div>
+<!-- /wp:group -->

patterns/layout-3-col.php

@@ -0,0 +1,44 @@
+<?php
+/**
+ * Title: Three Columns
+ * Slug: wp-bootstrap/layout-3-col
+ * Categories: wp-bootstrap-layout, columns
+ * Description: A three-column layout with equal width columns, each containing a heading and paragraph.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|60","bottom":"var:preset|spacing|60"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull" style="padding-top:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--60)"><!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":{"left":"var:preset|spacing|50"}}}} -->
+<div class="wp-block-columns alignwide"><!-- wp:column -->
+<div class="wp-block-column"><!-- wp:heading {"level":3,"fontSize":"x-large"} -->
+<h3 class="wp-block-heading has-x-large-font-size"><?php esc_html_e( 'Column One', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"textColor":"secondary"} -->
+<p class="has-secondary-color has-text-color"><?php esc_html_e( 'Add your content here. This column takes up one third of the available width on larger screens.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column -->
+
+<!-- wp:column -->
+<div class="wp-block-column"><!-- wp:heading {"level":3,"fontSize":"x-large"} -->
+<h3 class="wp-block-heading has-x-large-font-size"><?php esc_html_e( 'Column Two', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"textColor":"secondary"} -->
+<p class="has-secondary-color has-text-color"><?php esc_html_e( 'Add your content here. This column takes up one third of the available width on larger screens.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column -->
+
+<!-- wp:column -->
+<div class="wp-block-column"><!-- wp:heading {"level":3,"fontSize":"x-large"} -->
+<h3 class="wp-block-heading has-x-large-font-size"><?php esc_html_e( 'Column Three', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"textColor":"secondary"} -->
+<p class="has-secondary-color has-text-color"><?php esc_html_e( 'Add your content here. This column takes up one third of the available width on larger screens.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns --></div>
+<!-- /wp:group -->

patterns/layout-container.php

@@ -0,0 +1,20 @@
+<?php
+/**
+ * Title: Bootstrap Container
+ * Slug: wp-bootstrap/layout-container
+ * Categories: wp-bootstrap-layout
+ * Description: A constrained container with padding, containing a heading and paragraph placeholder.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|60","bottom":"var:preset|spacing|60","left":"var:preset|spacing|40","right":"var:preset|spacing|40"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull" style="padding-top:var(--wp--preset--spacing--60);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--60);padding-left:var(--wp--preset--spacing--40)"><!-- wp:heading {"fontSize":"xx-large"} -->
+<h2 class="wp-block-heading has-xx-large-font-size"><?php esc_html_e( 'Heading goes here', 'wp-bootstrap' ); ?></h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph -->
+<p><?php esc_html_e( 'This is a content container with constrained width and comfortable padding. Replace this text with your own content.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->

patterns/layout-full-width-section.php

@@ -0,0 +1,20 @@
+<?php
+/**
+ * Title: Full Width Section
+ * Slug: wp-bootstrap/layout-full-width-section
+ * Categories: wp-bootstrap-layout, banner
+ * Description: A full-width section with a primary background color, centered white heading and paragraph.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|80","bottom":"var:preset|spacing|80"}}},"backgroundColor":"primary","textColor":"base","layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull has-base-color has-primary-background-color has-text-color has-background" style="padding-top:var(--wp--preset--spacing--80);padding-bottom:var(--wp--preset--spacing--80)"><!-- wp:heading {"textAlign":"center","fontSize":"xx-large"} -->
+<h2 class="wp-block-heading has-text-align-center has-xx-large-font-size"><?php esc_html_e( 'Full Width Section Heading', 'wp-bootstrap' ); ?></h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","fontSize":"large"} -->
+<p class="has-text-align-center has-large-font-size"><?php esc_html_e( 'This full-width section stands out with a colored background. Use it to highlight important content, announcements, or calls to action.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->

patterns/nav-dark.php

@@ -0,0 +1,31 @@
+<?php
+/**
+ * Title: Navigation - Dark
+ * Slug: wp-bootstrap/nav-dark
+ * Categories: wp-bootstrap-navigation, header
+ * Block Types: core/template-part/header
+ * Description: Dark-themed navigation header with dark background.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","backgroundColor":"dark","textColor":"base","layout":{"type":"default"}} -->
+<div class="wp-block-group alignfull has-base-color has-dark-background-color has-text-color has-background">
+	<!-- wp:group {"layout":{"type":"constrained"}} -->
+	<div class="wp-block-group">
+		<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|30"}}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"space-between"}} -->
+		<div class="wp-block-group alignwide" style="padding-top:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--30)">
+			<!-- wp:site-title {"level":0,"style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}}}} /-->
+			<!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|20"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"right","verticalAlignment":"center"}} -->
+			<div class="wp-block-group">
+				<!-- wp:navigation {"overlayBackgroundColor":"dark","overlayTextColor":"base","style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}}},"layout":{"type":"flex","justifyContent":"right","flexWrap":"wrap"}} /-->
+				<!-- wp:pattern {"slug":"wp-bootstrap/dark-mode-toggle"} /-->
+			</div>
+			<!-- /wp:group -->
+		</div>
+		<!-- /wp:group -->
+	</div>
+	<!-- /wp:group -->
+</div>
+<!-- /wp:group -->

patterns/nav-offcanvas.php

@@ -0,0 +1,31 @@
+<?php
+/**
+ * Title: Navigation - Offcanvas
+ * Slug: wp-bootstrap/nav-offcanvas
+ * Categories: wp-bootstrap-navigation, header
+ * Block Types: core/template-part/header
+ * Description: Header with offcanvas mobile navigation using Bootstrap offcanvas component.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","layout":{"type":"default"}} -->
+<div class="wp-block-group alignfull">
+	<!-- wp:group {"layout":{"type":"constrained"}} -->
+	<div class="wp-block-group">
+		<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|30"}}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"space-between"}} -->
+		<div class="wp-block-group alignwide" style="padding-top:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--30)">
+			<!-- wp:site-title {"level":0} /-->
+			<!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|20"}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"right","verticalAlignment":"center"}} -->
+			<div class="wp-block-group">
+				<!-- wp:navigation {"overlayMenu":"always","overlayBackgroundColor":"base","overlayTextColor":"contrast","layout":{"type":"flex","justifyContent":"right","flexWrap":"wrap"}} /-->
+				<!-- wp:pattern {"slug":"wp-bootstrap/dark-mode-toggle"} /-->
+			</div>
+			<!-- /wp:group -->
+		</div>
+		<!-- /wp:group -->
+	</div>
+	<!-- /wp:group -->
+</div>
+<!-- /wp:group -->

patterns/page-about.php

@@ -0,0 +1,92 @@
+<?php
+/**
+ * Title: About Page
+ * Slug: wp-bootstrap/page-about
+ * Categories: wp-bootstrap_page
+ * Description: A full about page layout with hero, story section, and team members.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|80","bottom":"var:preset|spacing|80"}}},"backgroundColor":"primary","textColor":"base","layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull has-base-color has-primary-background-color has-text-color has-background" style="padding-top:var(--wp--preset--spacing--80);padding-bottom:var(--wp--preset--spacing--80)"><!-- wp:heading {"textAlign":"center","level":1,"fontSize":"display"} -->
+<h1 class="wp-block-heading has-text-align-center has-display-font-size"><?php esc_html_e( 'About Us', 'wp-bootstrap' ); ?></h1>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","fontSize":"large"} -->
+<p class="has-text-align-center has-large-font-size"><?php esc_html_e( 'Learn more about who we are, what we do, and the people behind our mission.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|70","bottom":"var:preset|spacing|70"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull" style="padding-top:var(--wp--preset--spacing--70);padding-bottom:var(--wp--preset--spacing--70)"><!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":{"left":"var:preset|spacing|60"}}}} -->
+<div class="wp-block-columns alignwide"><!-- wp:column {"verticalAlignment":"center"} -->
+<div class="wp-block-column is-vertically-aligned-center"><!-- wp:heading {"fontSize":"xx-large"} -->
+<h2 class="wp-block-heading has-xx-large-font-size"><?php esc_html_e( 'Our Story', 'wp-bootstrap' ); ?></h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph -->
+<p><?php esc_html_e( 'Founded with a passion for innovation and excellence, our journey began with a simple idea: to create meaningful solutions that make a real difference. Over the years, we have grown from a small team into a dedicated group of professionals committed to delivering outstanding results.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:paragraph {"textColor":"secondary"} -->
+<p class="has-secondary-color has-text-color"><?php esc_html_e( 'Today, we continue to push boundaries and challenge conventions. Our approach combines creative thinking with proven methodologies, ensuring that every project we undertake meets the highest standards of quality and craftsmanship.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column -->
+
+<!-- wp:column {"verticalAlignment":"center"} -->
+<div class="wp-block-column is-vertically-aligned-center"><!-- wp:image {"sizeSlug":"large","style":{"border":{"radius":"0.5rem"}}} -->
+<figure class="wp-block-image size-large" style="border-radius:0.5rem"><img src="" alt="<?php esc_attr_e( 'About us image', 'wp-bootstrap' ); ?>"/></figure>
+<!-- /wp:image --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|70","bottom":"var:preset|spacing|70"}}},"backgroundColor":"light","layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull has-light-background-color has-background" style="padding-top:var(--wp--preset--spacing--70);padding-bottom:var(--wp--preset--spacing--70)"><!-- wp:heading {"textAlign":"center","fontSize":"xx-large"} -->
+<h2 class="wp-block-heading has-text-align-center has-xx-large-font-size"><?php esc_html_e( 'Our Team', 'wp-bootstrap' ); ?></h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","textColor":"secondary"} -->
+<p class="has-text-align-center has-secondary-color has-text-color"><?php esc_html_e( 'Meet the people who make it all happen.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":{"left":"var:preset|spacing|40"}}}} -->
+<div class="wp-block-columns alignwide"><!-- wp:column -->
+<div class="wp-block-column"><!-- wp:group {"className":"is-style-card","style":{"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|50","left":"var:preset|spacing|40","right":"var:preset|spacing|40"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group is-style-card" style="padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--40)"><!-- wp:heading {"textAlign":"center","level":3} -->
+<h3 class="wp-block-heading has-text-align-center"><?php esc_html_e( 'Jane Doe', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","textColor":"secondary"} -->
+<p class="has-text-align-center has-secondary-color has-text-color"><?php esc_html_e( 'Founder & CEO', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:column -->
+
+<!-- wp:column -->
+<div class="wp-block-column"><!-- wp:group {"className":"is-style-card","style":{"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|50","left":"var:preset|spacing|40","right":"var:preset|spacing|40"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group is-style-card" style="padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--40)"><!-- wp:heading {"textAlign":"center","level":3} -->
+<h3 class="wp-block-heading has-text-align-center"><?php esc_html_e( 'John Smith', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","textColor":"secondary"} -->
+<p class="has-text-align-center has-secondary-color has-text-color"><?php esc_html_e( 'Lead Developer', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:column -->
+
+<!-- wp:column -->
+<div class="wp-block-column"><!-- wp:group {"className":"is-style-card","style":{"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|50","left":"var:preset|spacing|40","right":"var:preset|spacing|40"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group is-style-card" style="padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--40)"><!-- wp:heading {"textAlign":"center","level":3} -->
+<h3 class="wp-block-heading has-text-align-center"><?php esc_html_e( 'Emily Johnson', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","textColor":"secondary"} -->
+<p class="has-text-align-center has-secondary-color has-text-color"><?php esc_html_e( 'Creative Director', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns --></div>
+<!-- /wp:group -->

patterns/page-contact.php

@@ -0,0 +1,66 @@
+<?php
+/**
+ * Title: Contact Page
+ * Slug: wp-bootstrap/page-contact
+ * Categories: wp-bootstrap_page
+ * Description: A full contact page layout with hero, contact details, business hours, and spacer.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|80","bottom":"var:preset|spacing|80"}}},"backgroundColor":"primary","textColor":"base","layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull has-base-color has-primary-background-color has-text-color has-background" style="padding-top:var(--wp--preset--spacing--80);padding-bottom:var(--wp--preset--spacing--80)"><!-- wp:heading {"textAlign":"center","level":1,"fontSize":"display"} -->
+<h1 class="wp-block-heading has-text-align-center has-display-font-size"><?php esc_html_e( 'Contact Us', 'wp-bootstrap' ); ?></h1>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","fontSize":"large"} -->
+<p class="has-text-align-center has-large-font-size"><?php esc_html_e( 'We would love to hear from you. Reach out to us anytime.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|70","bottom":"var:preset|spacing|70"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull" style="padding-top:var(--wp--preset--spacing--70);padding-bottom:var(--wp--preset--spacing--70)"><!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":{"left":"var:preset|spacing|60"}}}} -->
+<div class="wp-block-columns alignwide"><!-- wp:column {"verticalAlignment":"top"} -->
+<div class="wp-block-column is-vertically-aligned-top"><!-- wp:heading {"fontSize":"xx-large"} -->
+<h2 class="wp-block-heading has-xx-large-font-size"><?php esc_html_e( 'Get in Touch', 'wp-bootstrap' ); ?></h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph -->
+<p><strong><?php esc_html_e( 'Address', 'wp-bootstrap' ); ?></strong><br><?php esc_html_e( '123 Main Street, Suite 100, Anytown, ST 12345', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:paragraph -->
+<p><strong><?php esc_html_e( 'Email', 'wp-bootstrap' ); ?></strong><br><?php esc_html_e( 'info@example.com', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:paragraph -->
+<p><strong><?php esc_html_e( 'Phone', 'wp-bootstrap' ); ?></strong><br><?php esc_html_e( '+1 (555) 123-4567', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column -->
+
+<!-- wp:column {"verticalAlignment":"top"} -->
+<div class="wp-block-column is-vertically-aligned-top"><!-- wp:heading {"fontSize":"xx-large"} -->
+<h2 class="wp-block-heading has-xx-large-font-size"><?php esc_html_e( 'Business Hours', 'wp-bootstrap' ); ?></h2>
+<!-- /wp:heading -->
+
+<!-- wp:list {"className":"is-style-list-unstyled","style":{"spacing":{"blockGap":"var:preset|spacing|20"}}} -->
+<ul class="is-style-list-unstyled"><!-- wp:list-item -->
+<li><strong><?php esc_html_e( 'Monday - Friday:', 'wp-bootstrap' ); ?></strong> <?php esc_html_e( '9:00 AM - 6:00 PM', 'wp-bootstrap' ); ?></li>
+<!-- /wp:list-item -->
+
+<!-- wp:list-item -->
+<li><strong><?php esc_html_e( 'Saturday:', 'wp-bootstrap' ); ?></strong> <?php esc_html_e( '10:00 AM - 4:00 PM', 'wp-bootstrap' ); ?></li>
+<!-- /wp:list-item -->
+
+<!-- wp:list-item -->
+<li><strong><?php esc_html_e( 'Sunday:', 'wp-bootstrap' ); ?></strong> <?php esc_html_e( 'Closed', 'wp-bootstrap' ); ?></li>
+<!-- /wp:list-item --></ul>
+<!-- /wp:list --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns --></div>
+<!-- /wp:group -->
+
+<!-- wp:spacer {"height":"var:preset|spacing|70"} -->
+<div style="height:var(--wp--preset--spacing--70)" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->

patterns/page-services.php

@@ -0,0 +1,94 @@
+<?php
+/**
+ * Title: Services Page
+ * Slug: wp-bootstrap/page-services
+ * Categories: wp-bootstrap_page
+ * Description: A full services page layout with hero, service offerings, and call to action.
+ *
+ * @package WPBootstrap
+ * @since 0.2.0
+ */
+?>
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|80","bottom":"var:preset|spacing|80"}}},"backgroundColor":"dark","textColor":"base","layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull has-base-color has-dark-background-color has-text-color has-background" style="padding-top:var(--wp--preset--spacing--80);padding-bottom:var(--wp--preset--spacing--80)"><!-- wp:heading {"textAlign":"center","level":1,"fontSize":"display"} -->
+<h1 class="wp-block-heading has-text-align-center has-display-font-size"><?php esc_html_e( 'Our Services', 'wp-bootstrap' ); ?></h1>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","fontSize":"large"} -->
+<p class="has-text-align-center has-large-font-size"><?php esc_html_e( 'Professional solutions tailored to your needs.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|70","bottom":"var:preset|spacing|70"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull" style="padding-top:var(--wp--preset--spacing--70);padding-bottom:var(--wp--preset--spacing--70)"><!-- wp:heading {"textAlign":"center","fontSize":"xx-large"} -->
+<h2 class="wp-block-heading has-text-align-center has-xx-large-font-size"><?php esc_html_e( 'What We Offer', 'wp-bootstrap' ); ?></h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","textColor":"secondary"} -->
+<p class="has-text-align-center has-secondary-color has-text-color"><?php esc_html_e( 'We provide a wide range of services to help your business grow and succeed.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":{"left":"var:preset|spacing|50"}}}} -->
+<div class="wp-block-columns alignwide"><!-- wp:column -->
+<div class="wp-block-column"><!-- wp:heading {"textAlign":"center","level":3,"fontSize":"display"} -->
+<h3 class="wp-block-heading has-text-align-center has-display-font-size"><?php esc_html_e( "\xF0\x9F\x8E\xA8", 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:heading {"textAlign":"center","level":3} -->
+<h3 class="wp-block-heading has-text-align-center"><?php esc_html_e( 'Design', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","textColor":"secondary"} -->
+<p class="has-text-align-center has-secondary-color has-text-color"><?php esc_html_e( 'Beautiful, user-centered designs that capture your brand identity and engage your audience across all platforms and devices.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column -->
+
+<!-- wp:column -->
+<div class="wp-block-column"><!-- wp:heading {"textAlign":"center","level":3,"fontSize":"display"} -->
+<h3 class="wp-block-heading has-text-align-center has-display-font-size"><?php esc_html_e( "\xE2\x9A\x99\xEF\xB8\x8F", 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:heading {"textAlign":"center","level":3} -->
+<h3 class="wp-block-heading has-text-align-center"><?php esc_html_e( 'Development', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","textColor":"secondary"} -->
+<p class="has-text-align-center has-secondary-color has-text-color"><?php esc_html_e( 'Robust, scalable web applications built with modern technologies and best practices to ensure performance and reliability.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column -->
+
+<!-- wp:column -->
+<div class="wp-block-column"><!-- wp:heading {"textAlign":"center","level":3,"fontSize":"display"} -->
+<h3 class="wp-block-heading has-text-align-center has-display-font-size"><?php esc_html_e( "\xF0\x9F\x93\x88", 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:heading {"textAlign":"center","level":3} -->
+<h3 class="wp-block-heading has-text-align-center"><?php esc_html_e( 'Strategy', 'wp-bootstrap' ); ?></h3>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","textColor":"secondary"} -->
+<p class="has-text-align-center has-secondary-color has-text-color"><?php esc_html_e( 'Data-driven strategies and consulting to help you achieve your business goals and stay ahead of the competition.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns --></div>
+<!-- /wp:group -->
+
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|70","bottom":"var:preset|spacing|70"}}},"backgroundColor":"primary","textColor":"base","layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull has-base-color has-primary-background-color has-text-color has-background" style="padding-top:var(--wp--preset--spacing--70);padding-bottom:var(--wp--preset--spacing--70)"><!-- wp:heading {"textAlign":"center","fontSize":"xx-large"} -->
+<h2 class="wp-block-heading has-text-align-center has-xx-large-font-size"><?php esc_html_e( 'Get Started', 'wp-bootstrap' ); ?></h2>
+<!-- /wp:heading -->
+
+<!-- wp:paragraph {"align":"center","fontSize":"medium"} -->
+<p class="has-text-align-center has-medium-font-size"><?php esc_html_e( 'Ready to take your project to the next level? Let us help you build something great.', 'wp-bootstrap' ); ?></p>
+<!-- /wp:paragraph -->
+
+<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center"}} -->
+<div class="wp-block-buttons"><!-- wp:button {"backgroundColor":"base","textColor":"primary"} -->
+<div class="wp-block-button"><a class="wp-block-button__link has-primary-color has-base-background-color has-text-color has-background wp-element-button"><?php esc_html_e( 'Contact Us', 'wp-bootstrap' ); ?></a></div>
+<!-- /wp:button -->
+
+<!-- wp:button {"className":"is-style-outline","style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}}},"textColor":"base"} -->
+<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-base-color has-text-color has-link-color wp-element-button"><?php esc_html_e( 'View Portfolio', 'wp-bootstrap' ); ?></a></div>
+<!-- /wp:button --></div>
+<!-- /wp:buttons --></div>
+<!-- /wp:group -->