Comments (11)
I have to find a way of detecting which query block is being processed to determine which of the (up to 60) posts returned in the main query should be processed per block.
This can be done by setting the className
on each query-loop block in the Block settings > Advanced > Additional CSS class(es).
Main query part | CSS classes |
---|---|
Hero | sb hero |
Thumbnails | sb thumbails |
Links | sb links |
Additionally, as with Fizzie, we can also consider eliminating the core/query
block.
... But this would prevent us from adjusting grid layout.
from sb.
The following simple typo hindered my progress for a while.
<!-- wp:query-loop {"className": "sb hero" } /-->
Here I unintentionally added a self ending slash in the query-loop block.
This was the first query block in the template part.
I couldn't understand why the subsequent query blocks in the template part weren't being processed.
Nor did it make sense that the query-loop's inner blocks were being processed, since in the block's override logic
the actual processing of the inner blocks was in the else
part of an if
statement. And the results I could see indicated that the if condition was true.
This is what it should have been like.
<!-- wp:query {"queryId":6,"query":{"perPage":1,"pages":0,"offset":0,"postType":"bigram","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":true},"layout":{"type":"list","columns":2}} -->
<!-- wp:query-loop {"className": "sb hero" } -->
<!-- wp:post-featured-image {"isLink":true,"align":"wide"} /-->
<!-- wp:post-title {"isLink":true} /-->
<!-- wp:post-content /-->
<!-- wp:separator -->
<hr class="wp-block-separator"/>
<!-- /wp:separator -->
<!-- wp:post-date /-->
<!-- /wp:query-loop -->
<!-- /wp:query -->
... second and third query blocks omitted.
Explanation
- The unwanted slash meant that the query-loop was basically an empty block.
- So the blocks that followed were outside of the query-loop
- And they displayed the output for the current post. The output I wanted but wasnt yet expecting.
- The end query loop was ignored.
- And so it seems were the query and query-loops that followed.
from sb.
This is what I was actually expecting to get.
When the code is wrong the subsequent query-loop blocks are not run, even though they're coded correctly.
Other blocks, such as the separator, were being processed.
Oh, and now I've just noticed that my footer's gone back to wide width not full width!
from sb.
I'm going to try to override the
gutenberg_render_block_core_query_loop()
to either fiddle with the main query's posts or handle the loop myself.
It was easier to handle the loop myself than to fiddle with the main query's posts.
In order to get the grid/flex layout I had to copy some of the new code that sets the block wrapper attributes.
Here's an unstyled screenshot of the bottom of the thumbnail grid and the top of the links.
Note: I need to add "isLink": "true" as to both the featured image and the post title blocks.
from sb.
With Gutenberg 12.9.0 the post title block is showing the same value for each post in the thumbnail grid and links section.
But the link is to the correct post.
Is this an issue with Gutenberg?
How do we find out?
Note: Also using WordPress 6.0-beta2
from sb.
Reverting to an earlier version of Gutenberg the title is correctly displayed.
Now I need to find out where it went wrong.
Version | OK ? |
---|---|
12.0.0 | Yes |
12.1.0 | Yes |
12.2.0 | Yes |
12.3.0 | No |
from sb.
I tracked the problem down to code changes implemented in WordPress/gutenberg#37622
For both the post-title
and post-content
blocks the $post_id
is no longer being passed to the function that gets the post title or content for the given post.
Local fix
By setting $GLOBAL[ 'post']
to the current post in the loop
I was able to rework my code in sb_render_block_core_post_template_main_query()
to fiddle the logic for the post title.
See below.
But I couldn't do it easily for the post content.
When the post ID is not set and the the_post
action has been invoked, the logic in get_the_content()
reuses globals.
It assumes you're processing the same post each time.
I don't need the post content anyway.
If necessary, I could get by using the post-excerpt
field which hasn't been changed for preview processing.
Reproducing without override logic
The problem occurs in my overriding of the post-template
block, when sb_render_block_core_post_template_main_query()
uses the WP_Block::render()
method directly.
The new logic implemented for PR 37622 ignores the values set in the $available_context
.
$content = '';
$saved_post = $GLOBALS['post'];
//in_the_loop();
//global $wp_query;
//set_query_var( 'in_the_loop', ;
//$wp_query->in_the_loop = true;
foreach ( $wp_query->posts as $index => $post ) {
$GLOBALS['post'] = $post;
if ( $index >= $attributes['offset'] && $index < $attributes['limit']) {
//$content = get_the_content( null, false, $post );
$block_content = (
new WP_Block(
$block->parsed_block,
array(
'postType' => $post->post_type,
'postId' => $post->ID,
)
)
)->render(array('dynamic' => false));
$content .= "<li>{$block_content}</li>";
}
}
$GLOBALS['post'] = $saved_post;
I would have thought that anyone else writing their own code to dynamically display inner blocks would experience the same problem.
So far I've been unable to reproduce the problem with a standard theme like Twenty Twenty Two.
from sb.
But I couldn't do it easily for the post content.
I hadn't considered overriding the post-content
block. This would be a fairly easy fix; revert the change so that the $post_id
is passed to get_the_content()
.
Another hacky change would be to reset the count of the number of times the_post
action was invoked.
$saved_post = $GLOBALS['post'];
//in_the_loop();
//global $wp_query;
//set_query_var( 'in_the_loop', ;
//$wp_query->in_the_loop = true;
global $wp_actions;
foreach ( $wp_query->posts as $index => $post ) {
$GLOBALS['post'] = $post;
$wp_actions['the_post'] = 0;
if ( $index >= $attributes['offset'] && $index < $attributes['limit']) {
//$content = get_the_content( null, false, $post );
$block_content = (
new WP_Block(
$block->parsed_block,
array(
'postType' => $post->post_type,
'postId' => $post->ID,
)
)
)->render(array('dynamic' => false));
$content .= "<li>{$block_content}</li>";
}
}
$GLOBALS['post'] = $saved_post;
from sb.
I found the correct solution when I looked at the code for gutenberg_render_block_core_post_template()
This uses a standard query loop. I changed my foreach loop to a while loop
which calls WP_Query::the_post()
for each post before rendering the block.
$index = 0;
while ( $wp_query->have_posts() ) {
$wp_query->the_post();
if ... {
render block
}
$index++;
}
This solution works for both the post title and the post content.
from sb.
The 3 query loops now work but the second and third use the full width of the 66% ( left hand) column.
The query loop blocks need to have the Inherit default layout toggled on.
from sb.
This solution is now delivered in v0.2.1
from sb.
Related Issues (20)
- Create a 404 page for when the link is Not found HOT 2
- Improve styling of vertical menus: site-menu and Info widget HOT 1
- Develop an archive template - or just use index.html HOT 3
- Implement the react SB page as a block HOT 3
- Rename block-templates and block-template-parts HOT 1
- Rework submit bigram page HOT 4
- Investigate server performance when Yoast SEO activated HOT 1
- Do we need a widget cache?
- Develop nav menu item override a la Fizzie / Thisis HOT 1
- the_posts filter affecting Dashboard All Bigrams listing HOT 1
- Investigate reducing processing in the `genesis_sb_the_posts filter()` function for `the_posts` HOT 4
- Styling blips with v0.2.1 HOT 7
- Remove block override dependency on Gutenberg
- Replace Classic blocks with shortcode blocks or equivalent Gutenberg blocks HOT 1
- Support PHP 8.1, PHP 8.2 and PHP 8.3. HOT 1
- Add AI prompt and AI response styles. Adjust featured image size on singular.html HOT 2
- Add AI revised prompt style. Adjust home page hero layout HOT 2
- Add support for additional fields: Suggested/supplied by and Synthesised by - which are probably taxonomies HOT 3
- Images incorrectly sized on the home page HOT 1
- Enable image search on Search results page and Supplied-by archive page HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from sb.