Skip to content

Instantly share code, notes, and snippets.

@ipatate
Last active October 9, 2023 13:31
Show Gist options
  • Save ipatate/17bae0565f4228271e98c3a8872eb8d3 to your computer and use it in GitHub Desktop.
Save ipatate/17bae0565f4228271e98c3a8872eb8d3 to your computer and use it in GitHub Desktop.
Variation exemple Block Query
<!-- encore plus simple avec juste le namespace dans les commentaires, pas besoin de variation js normalement -->
<!-- wp:query {"queryId":1,"query":{"perPage":100,"pages":0,"offset":0,"postType":"post","order":"asc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","taxQuery":{},"inherit":false},"namespace":"namespace/variation-name","align":"wide","className":"..."} -->
<div class="wp-block-query alignwide ..."><!-- wp:post-template {"layout":{"type":"grid","columnCount":3}} -->
<!-- wp:group {"align":"wide"} -->
<div class="wp-block-group alignwide"><!-- wp:post-featured-image {"isLink":true} /-->
<!-- wp:post-title {"textAlign":"left","level":3} /-->
<!-- wp:post-excerpt {"excerptLength":50} /-->
<!-- wp:read-more /--></div>
<!-- /wp:group -->
<!-- /wp:post-template --></div>
<!-- /wp:query -->
const VARIATION_NAME = 'namespace/variation-name'
const addVariation = function () {
if (!wp) {
return
}
/** create variation block */
wp.blocks.registerBlockVariation('core/query', {
name: VARIATION_NAME,
title: 'test variation',
category: 'theme',
description: '...',
isActive: ({ namespace, query }) => {
return namespace === VARIATION_NAME && query.postType === 'post'
},
icon: 'admin',
attributes: {
className: '...',
namespace: VARIATION_NAME,
align: 'wide',
displayLayout: { type: 'grid', columns: 3 },
query: {
perPage: 100,
pages: 0,
offset: 0,
postType: 'post',
order: 'asc',
orderBy: 'date',
author: '',
search: '',
exclude: [],
sticky: '',
taxQuery: {},
inherit: false,
},
},
allowedControls: [],
scope: ['inserter'],
innerBlocks: [
[
'core/post-template',
{ layout: { type: 'grid', columnCount: 3 } },
[
[
'core/group',
{ align: 'wide' },
[
[
'core/post-featured-image',
{
isLink: true,
},
],
[
'core/post-title',
{
level: 3,
textAlign: 'left',
},
],
['core/post-excerpt', { excerptLength: 50 }],
[
'core/read-more',
{},
],
],
],
],
],
],
})
}
document.addEventListener('DOMContentLoaded', () => {
addVariation()
})
add_filter(
'pre_render_block',
function ($prerender, $block) {
if ($block['attrs'] && array_key_exists('namespace', $block['attrs']) && 'namespace/variation-name' === $block['attrs']['namespace']) {
add_filter(
'query_loop_block_query_vars',
function ($query) {
// you can global post for exclude current or for use taxonomy
$query['post_type'] = '...';
$query['posts_per_page'] = -1;
$tax_query = [];
$query['tax_query'] = $tax_query;
return $query;
},
10,
1
);
}
},
10,
2
);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment