add related posts section to single post template

functions.php

@@ -152,4 +152,20 @@ function cc_mime_types($mimes) {
 }
 add_filter('upload_mimes', 'cc_mime_types');
 
-// enable wordpress customizer
+// remove current post from related posts query loop
+add_filter( 'query_loop_block_query_vars', function( $query_vars, $block ) {
+	if ( isset( $block->attributes['metadata']['name'] ) && $block->attributes['metadata']['name'] === 'Related Post' ) {
+		$query_vars['post__not_in'] = array( get_the_ID() );
+	}
+
+	return $query_vars;
+}, 10, 2 );
+
+function jett_remove_current_from_queries( $query_vars, $block ) {
+	do_action( 'qm/debug', $block->parsed_block );
+
+	if ( 'related-post' === $block->parsed_block['attrs']['className'] )
+		$query_vars['post__not_in'] = array( get_the_ID() );
+	return $query_vars;
+}
+add_filter( 'query_loop_block_query_vars', 'jett_remove_current_from_queries', 10, 2 ); 

templates/single.html

@@ -1,3 +1,5 @@
+<!-- wp:template-part {"slug":"header","area":"header"} /-->
+
 <!-- wp:columns {"style":{"spacing":{"blockGap":{"top":"0","left":"0"},"margin":{"top":"0","bottom":"0"}}}} -->
 <div class="wp-block-columns" style="margin-top:0;margin-bottom:0"><!-- wp:column {"width":"19.05%"} -->
         <div class="wp-block-column" style="flex-basis:19.05%"></div>
@@ -44,8 +46,7 @@
                 <!-- /wp:group -->
 
                 <!-- wp:group {"metadata":{"name":"post-bio-container"},"style":{"elements":{"link":{"color":{"text":"var:preset|color|white"}}},"spacing":{"padding":{"top":"var:preset|spacing|70","bottom":"var:preset|spacing|70","left":"var:preset|spacing|70","right":"var:preset|spacing|70"}}},"backgroundColor":"black","textColor":"white","className":"post-bio-container","layout":{"type":"constrained","contentSize":"640px","wideSize":"1480px"}} -->
-    <div
+                <div class="wp-block-group post-bio-container has-white-color has-black-background-color has-text-color has-background has-link-color"
-      class="wp-block-group post-bio-container has-white-color has-black-background-color has-text-color has-background has-link-color"
                         style="padding-top:var(--wp--preset--spacing--70);padding-right:var(--wp--preset--spacing--70);padding-bottom:var(--wp--preset--spacing--70);padding-left:var(--wp--preset--spacing--70)">
                         <!-- wp:heading {"textAlign":"center","style":{"elements":{"link":{"color":{"text":"var:preset|color|white"}}}},"textColor":"white","fontSize":"x-large"} -->
                         <h2
@@ -55,7 +56,8 @@
 
                         <!-- wp:columns -->
                         <div class="wp-block-columns"><!-- wp:column {"width":"29%"} -->
-        <div class="wp-block-column" style="flex-basis:29%"><!-- wp:co-authors-plus/coauthors {"prefix":""} -->
+                                <div class="wp-block-column" style="flex-basis:29%">
+                                        <!-- wp:co-authors-plus/coauthors {"prefix":""} -->
                                         <div class="wp-block-co-authors-plus-coauthors">
                                                 <!-- wp:co-authors-plus/name {"style":{"typography":{"fontStyle":"normal","fontWeight":"700"}},"fontSize":"standard"} /-->
                                         </div>
@@ -81,4 +83,72 @@
 </div>
 <!-- /wp:columns -->
 
+<!-- wp:spacer {"height":"129px"} -->
+<div style="height:129px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
+
+<!-- wp:group {"metadata":{"name":"Related Posts"},"align":"full","style":{"spacing":{"margin":{"top":"0","bottom":"0"}}},"layout":{"type":"default"}} -->
+<div class="wp-block-group alignfull" style="margin-top:0;margin-bottom:0">
+        <!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|30"},"margin":{"top":"0","bottom":"0"}}},"backgroundColor":"black","layout":{"type":"default"}} -->
+        <div class="wp-block-group has-black-background-color has-background"
+                style="margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--30)">
+                <!-- wp:heading {"textAlign":"center","style":{"typography":{"fontStyle":"normal","fontWeight":"600"}},"className":"is-style-gradient","fontSize":"xx-large","fontFamily":"instrument-sans"} -->
+                <h2 class="wp-block-heading has-text-align-center is-style-gradient has-instrument-sans-font-family has-xx-large-font-size"
+                        style="font-style:normal;font-weight:600">From The Blog</h2>
+                <!-- /wp:heading -->
+        </div>
+        <!-- /wp:group -->
+
+        <!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|70","bottom":"var:preset|spacing|50","left":"var:preset|spacing|80","right":"var:preset|spacing|80"}}},"layout":{"type":"default"}} -->
+        <div class="wp-block-group"
+                style="padding-top:var(--wp--preset--spacing--70);padding-right:var(--wp--preset--spacing--80);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--80)">
+                <!-- wp:query {"queryId":13,"query":{"perPage":"6","pages":0,"offset":0,"postType":"post","order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"exclude","inherit":false},"metadata":{"name":"Normal posts"},"className":"home-posts-grid","layout":{"type":"default"}} -->
+                <div class="wp-block-query home-posts-grid">
+                        <!-- wp:post-template {"metadata":{"name":"Related Post"},"align":"full","style":{"spacing":{"blockGap":"var:preset|spacing|70"}},"className":"related-posts","layout":{"type":"grid","columnCount":"2","minimumColumnWidth":null}} -->
+                        <!-- wp:columns {"style":{"border":{"top":{"width":"1px","color":"var:preset|color|black"},"right":{"width":"1px","color":"var:preset|color|black"},"bottom":{"width":"16px","color":"var:preset|color|black"},"left":{"width":"1px","color":"var:preset|color|black"}},"spacing":{"blockGap":{"top":"0","left":"0"}}},"className":"home-post-item"} -->
+                        <div class="wp-block-columns home-post-item"
+                                style="border-top-color:var(--wp--preset--color--black);border-top-width:1px;border-right-color:var(--wp--preset--color--black);border-right-width:1px;border-bottom-color:var(--wp--preset--color--black);border-bottom-width:16px;border-left-color:var(--wp--preset--color--black);border-left-width:1px">
+                                <!-- wp:column {"width":"30%"} -->
+                                <div class="wp-block-column" style="flex-basis:30%">
+                                        <!-- wp:post-featured-image {"width":"","height":"100%","sizeSlug":"full","style":{"layout":{"selfStretch":"fit","flexSize":null},"border":{"right":{"width":"1px"}}},"className":"home-post-item-img"} /-->
+                                </div>
+                                <!-- /wp:column -->
+
+                                <!-- wp:column {"width":"","style":{"spacing":{"padding":{"right":"var:preset|spacing|60","left":"var:preset|spacing|60","top":"var:preset|spacing|30","bottom":"var:preset|spacing|30"}}}} -->
+                                <div class="wp-block-column"
+                                        style="padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--60)">
+                                        <!-- wp:post-date {"format":"M.j.y","style":{"typography":{"fontStyle":"normal","fontWeight":"700"},"spacing":{"padding":{"top":"var:preset|spacing|30"}}},"fontSize":"small","fontFamily":"commit-mono"} /-->
+
+                                        <!-- wp:post-title {"isLink":true,"className":"post-title"} /-->
+
+                                        <!-- wp:post-excerpt {"style":{"typography":{"fontStyle":"normal","fontWeight":"500"}},"fontFamily":"commit-mono"} /-->
+
+                                        <!-- wp:post-terms {"term":"post_tag","separator":"","className":"is-style-hashtags"} /-->
+                                </div>
+                                <!-- /wp:column -->
+                        </div>
+                        <!-- /wp:columns -->
+                        <!-- /wp:post-template -->
+                </div>
+                <!-- /wp:query -->
+        </div>
+        <!-- /wp:group -->
+
+        <!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|60"}}},"layout":{"type":"constrained"}} -->
+        <div class="wp-block-group"
+                style="padding-top:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--60)">
+                <!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center","verticalAlignment":"stretch"}} -->
+                <div class="wp-block-buttons">
+                        <!-- wp:button {"style":{"spacing":{"padding":{"left":"0","right":"0"}}},"className":"pcss-808b88d9","fontSize":"medium","pcssAdditionalCss":"[block] {\n width: 100%;\n margin-inline: 1rem !important;\n display: inline-block;\n transition: 0.25s ease-in-out;\n}\n\n[block] .wp-element-button {\n  width: 100%;\n}\n\n[block]:hover {\n  box-shadow: rgb(51, 51, 51) 4px 4px 0 0;\n  transform: translate(-4px, -4px)\n}","pcssAdditionalCssCompiled":".pcss-808b88d9{width:100%;transition:all .25s ease-in-out;display:inline-block;margin-inline:1rem!important}.pcss-808b88d9 .wp-element-button{width:100%}.pcss-808b88d9:hover{transform:translate(-4px,-4px);box-shadow:4px 4px #333}","pcssClassId":"pcss-808b88d9"} -->
+                        <div class="wp-block-button has-custom-font-size pcss-808b88d9 has-medium-font-size"><a
+                                        class="wp-block-button__link wp-element-button" href="https://jett.local/blog/"
+                                        style="padding-right:0;padding-left:0">More ➔</a></div>
+                        <!-- /wp:button -->
+                </div>
+                <!-- /wp:buttons -->
+        </div>
+        <!-- /wp:group -->
+</div>
+<!-- /wp:group -->
+
 <!-- wp:template-part {"slug":"footer","area":"footer"} /-->