-
Notifications
You must be signed in to change notification settings - Fork 4.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Query loop / Post template: Enable post format filter #64167
Conversation
Size Change: +923 B (+0.05%) Total Size: 1.77 MB
ℹ️ View Unchanged
|
This comment was marked as resolved.
This comment was marked as resolved.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
packages/block-library/src/query/edit/inspector-controls/post-format-controls.js
Outdated
Show resolved
Hide resolved
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as outdated.
…tenberg_add_format_query_vars_to_query_loop_block
…rsion $request['format'] does not need to be converted into an array, any array conversion needed is handled by the schema. This commit removes the array conversion from get_items.
I have removed the array conversion in I tested manually changing the block attributes by editing the markup of the query loop in the block editor. |
Yes. Let's add check-in |
In gutenberg_add_format_query_vars_to_query_loop_block: return early if the format attribute is not an array. In FormatControls: Prevent a JS error that occurs if the format is not an array. - The purpose is to prevent a user error from breaking the editor, for example if the format is invalid because the user has edited the block markup incorrectly. A check is implemented that preserves the value if for format is an array or string, and uses an empty array if it is neither.
I made two changes: There was still a JavaScript error in the editor that prevented the editor from functioning, so I also added a check with a Update: To anyone reading this without already having the full context, this JavaScript error that is mentioned was created on purpose, and the only reason for adding these two changes is to fail gracefully on user error. |
…_block Add apostrophes around the hook name in the docBlock of gutenberg_add_format_query_vars_to_query_loop_block.
packages/block-library/src/query/edit/inspector-controls/format-controls.js
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is testing well for me, and I couldn't spot any regression to Query block behavior.
Nicely done, @carolinan! |
Agreed! Great work 👏🏼 |
Nice! Made it! |
…oop filter This pull request copies changes that were made in WordPress core in WordPress/wordpress-develop#7314: The pull request that added the PHP changes related to #64167. - Improved logic for the use of the `AND` `relation` key when a user queries for both a format and a taxonomy. - Improved inline documentation, for clarity and readability. - Improved validation of the queried formats against the registered formats. - Misc: renaming of variables for better readability.
…oop filter (#66037) This pull request copies changes that were made in WordPress core in WordPress/wordpress-develop#7314: The pull request that added the PHP changes related to #64167. - Improved logic for the use of the `AND` `relation` key when a user queries for both a format and a taxonomy. - Improved inline documentation, for clarity and readability. - Improved validation of the queried formats against the registered formats. - Misc: renaming of variables for better readability. Co-authored-by: carolinan <[email protected]> Co-authored-by: Mamaduka <[email protected]>
…oop filter (#66037) This pull request copies changes that were made in WordPress core in WordPress/wordpress-develop#7314: The pull request that added the PHP changes related to WordPress/gutenberg#64167. - Improved logic for the use of the `AND` `relation` key when a user queries for both a format and a taxonomy. - Improved inline documentation, for clarity and readability. - Improved validation of the queried formats against the registered formats. - Misc: renaming of variables for better readability. Co-authored-by: carolinan <[email protected]> Co-authored-by: Mamaduka <[email protected]> Source: WordPress/gutenberg@b95553f
…oop filter (WordPress#66037) This pull request copies changes that were made in WordPress core in WordPress/wordpress-develop#7314: The pull request that added the PHP changes related to WordPress#64167. - Improved logic for the use of the `AND` `relation` key when a user queries for both a format and a taxonomy. - Improved inline documentation, for clarity and readability. - Improved validation of the queried formats against the registered formats. - Misc: renaming of variables for better readability. Co-authored-by: carolinan <[email protected]> Co-authored-by: Mamaduka <[email protected]>
What?
Enables filtering the query loop result by post format.
Partial for #53049
Additional props @justintadlock @SergeyBiryukov
Why?
This feature is often requested by users, see the linked issue.
How?
Description updated September 5 2024.
This PR attempts to enable filtering the post query by post format, but handles the post format separately from
other taxonomies, as requested by reviewers.
REST API changes:
A new class
Gutenberg_REST_Posts_Controller_6_7
that extendsWP_REST_Posts_Controller
is added to the 6.7 compatibility folder.The intention of this new temporary class is to add 'format' to the Posts controller, so that it can be used to filter the query result per post format.
Updates are made to these class methods:
get_item
,get_collection_params
Query loop block:
format
, to thequery
block attribute in the query loop block.FormatControls
that uses a list of supported post formats inside aFormTokenField
.getThemeSupports
is used to get the supported post formats from the store.Post Template block:
format
parameter is passed from the query loop block to the post template block as part of thequery
.query
using the newformat
key (as opposed to using the post format taxonomy).Filtering query_loop_block_query_vars
Filter the query vars (tax_query) for the Query Loop block to support post formats on the front of the site.
Todo & follow ups
To be handled as a follow up in a separate PR:
Ensure that the query loop displays the correct posts when the block is set to inherit the query, when the block is placed in a post format archive template.
Testing Instructions
Enable post formats in a theme by adding the theme support. Example:
Add some test content, both with and without post formats assigned.
Test the query loop both in a template and in a post/page.
Add or select an existing query loop block.
Enable the custom query type in the query loop settings sidebar.
Find and open the Filters panel.
Select the three dot menu on the filters panel and toggle all available filters.
Confirm that one of the filters is an input field for "Formats.".
Confirm that all post formats that you registered with the theme supports can be entered into and selected in the input field.
Test that there are no regressions with the query loop features and its filters:
When the format filter is not enabled
When the format filter is enabled
When a single format is selected
When multiple formats are selected
Especially test that the 'standard' format displays posts that has no post format assigned, when it is chosen as the only format, and when combined with another format.
Confirm that you can reset the format filter with the reset options in the Filter panel.
Test with classic themes and block themes
Test that there are no regressions if post formats are not enabled on the theme (All features should work as before this patch).
Testing custom post types
Follow the steps above to register support for post formats in the theme.
Register a custom post type with post format support, include:
In the admin, create a few items of this post type, with and without a post format assigned.
Go to Appearance > Editor and select a template with a query -or create one.
Switching post types (After registering your custom post type)
In the settings sidebar of the query loop, set the post type to posts.
Open the Filters panel, and add a post format.
Switch the post type to the custom post type. Confirm that the filter is unchanged.
Switch the post type to page, which does not support post formats: Confirm that the filter is not showing in the panel.
Switch the post type to posts: confirm that the filter is reset (it was reset when you switched to the page).
Testing the query pagination
After creating a number of posts with formats, set the "items per page" setting to something low so that the query pagination block will show on the front.
Save and view the front of the site. Use the pagination and confirm that page 2 etc displays the correct posts.
Screenshots or screencast
I apologise, I have compressed the video but it is still almost 4 MB.
In this video I am testing different post formats in a template in the Site Editor.
I am testing formats in combination with other taxonomies, entering a non-existing format name in the control, etc.
I am switching between Post, page, and a custom post type with post format support, to illustrate that the filter is reset when switching to pages, but maintained when switching between posts and custom post types.
(Aside: I am not using a mouse and I do see that I often miss click when trying to remove a format from the control)
query-loop-post-format-filter-september-5.mp4