FEATURES Handling block extra options

This commit is contained in:
Antoine M 2026-02-13 15:32:16 +01:00
parent 237bf0ef31
commit f19995471c
3 changed files with 85 additions and 59 deletions

View File

@ -9,7 +9,11 @@
"description": "Example block scaffolded with Create Block tool.",
"example": {},
"supports": {
"html": false
"html": false,
"color": {
"background": true,
"text": true
}
},
"textdomain": "dernieres-dynamiques",
"editorScript": "file:./index.js",
@ -21,6 +25,10 @@
"displayType": {
"type": "string",
"default": "grid"
},
"showTableOfContents": {
"type": "boolean",
"default": true
}
}
}

View File

@ -11,12 +11,16 @@ import "./editor.scss";
import ServerSideRender from "@wordpress/server-side-render";
export default function Edit({ attributes, setAttributes }) {
const { displayType } = attributes;
const { displayType, showTableOfContents = true } = attributes;
function onDisplayTypeChange(value) {
setAttributes({ displayType: value });
}
function onShowTableOfContentsChange(value) {
setAttributes({ showTableOfContents: !showTableOfContents });
}
return (
<>
<InspectorControls>
@ -31,6 +35,11 @@ export default function Edit({ attributes, setAttributes }) {
<ToggleGroupControlOption label="Slider" value="slider" />
<ToggleGroupControlOption label="Grille" value="grid" />
</ToggleGroupControl>
<CheckboxControl
label="Afficher la table des matières"
checked={showTableOfContents}
onChange={onShowTableOfContentsChange}
/>
</PanelBody>
</InspectorControls>
<div {...useBlockProps({ className: "alignfull" })}>

View File

@ -1,6 +1,13 @@
<?php
$displayType = $attributes['displayType'] ?? 'grid';
$variantLocation = $attributes['variantLocation'] ?? 'carhop';
$showTableOfContents = $attributes['showTableOfContents'] ?? true;
$backgroundColor = $attributes['backgroundColor'] ?? null;
$backgroundColorHex = get_color_hex_from_slug($backgroundColor) ?? null;
$hasLightBackground = is_color_light($backgroundColorHex);
$backgroundColorClass = $hasLightBackground ? 'block-dernieres-dynamiques--has-light-bg' : 'block-dernieres-dynamiques--has-dark-bg';
$current_blog_id = get_current_blog_id();
switch_to_blog(2);
@ -23,7 +30,7 @@ $issue_related_articles = get_field('articles', $last_issue->ID);
?>
<section class="block-dernieres-dynamiques content-section block-dernieres-dynamiques--<?php echo $variantLocation; ?> alignfull">
<section <?php echo get_block_wrapper_attributes(array('class' => 'block-dernieres-dynamiques content-section block-dernieres-dynamiques--' . $variantLocation . ' alignfull ' . $backgroundColorClass)); ?>>
<div class="block-dernieres-dynamiques__inner">
<div class="block-dernieres-dynamiques__header">
<h2 class="block-title">
@ -84,80 +91,82 @@ $issue_related_articles = get_field('articles', $last_issue->ID);
</div>
</div>
<div class="related-articles">
<h3 class="related-articles__title">
Table des matières
</h3>
<?php if ($showTableOfContents) : ?>
<div class="related-articles">
<h3 class="related-articles__title">
Table des matières
</h3>
<div class="article-caroussel article-caroussel--<?php echo $displayType; ?>">
<div class="article-caroussel article-caroussel--<?php echo $displayType; ?>">
<?php if ($displayType === 'grid') : ?>
<?php if ($displayType === 'grid') : ?>
<?php foreach ($issue_related_articles as $article) : ?>
<?php
get_template_part('template-parts/dynamiques/article-card', null, array(
'ID' => $article->ID,
<?php foreach ($issue_related_articles as $article) : ?>
<?php
get_template_part('template-parts/dynamiques/article-card', null, array(
'ID' => $article->ID,
));
?>
<?php endforeach; ?>
<!-- <button class="related-articles__show-all">
));
?>
<?php endforeach; ?>
<!-- <button class="related-articles__show-all">
Tout afficher
</button> -->
<?php else : ?>
<?php else : ?>
<div class="article-caroussel__slider">
<?php if ($issue_related_articles && is_array($issue_related_articles)) : ?>
<div class="article-caroussel__slider">
<?php if ($issue_related_articles && is_array($issue_related_articles)) : ?>
<div class="swiper dernieres-dynamiques-swiper">
<div class="swiper-wrapper">
<?php foreach ($issue_related_articles as $article) : ?>
<div class="swiper dernieres-dynamiques-swiper">
<div class="swiper-wrapper">
<?php foreach ($issue_related_articles as $article) : ?>
<?php get_template_part('template-parts/dynamiques/article-card', null, array(
'ID' => $article->ID,
'isSwiperSlide' => true,
'showCover' => true,
)) ?>
<?php endforeach; ?>
</div>
<div class="swiper-pagination-fraction"></div>
<div class="swiper-pagination"></div>
<div class="swiper-controls">
<div class="swiper-button-prev">
<?php
$previous_arrow_icon = get_template_directory() . '/resources/img/elements/carhop-slider-previous.svg';
if (file_exists($previous_arrow_icon)) {
echo file_get_contents($previous_arrow_icon);
}
?>
<?php get_template_part('template-parts/dynamiques/article-card', null, array(
'ID' => $article->ID,
'isSwiperSlide' => true,
'showCover' => true,
)) ?>
<?php endforeach; ?>
</div>
<div class="swiper-button-next">
<?php
$next_arrow_icon = get_template_directory() . '/resources/img/elements/carhop-slider-next.svg';
if (file_exists($next_arrow_icon)) {
echo file_get_contents($next_arrow_icon);
}
?>
<div class="swiper-pagination-fraction"></div>
<div class="swiper-pagination"></div>
<div class="swiper-controls">
<div class="swiper-button-prev">
<?php
$previous_arrow_icon = get_template_directory() . '/resources/img/elements/carhop-slider-previous.svg';
if (file_exists($previous_arrow_icon)) {
echo file_get_contents($previous_arrow_icon);
}
?>
</div>
<div class="swiper-button-next">
<?php
$next_arrow_icon = get_template_directory() . '/resources/img/elements/carhop-slider-next.svg';
if (file_exists($next_arrow_icon)) {
echo file_get_contents($next_arrow_icon);
}
?>
</div>
</div>
</div>
</div>
<?php endif; ?>
</div>
<?php endif; ?>
<?php endif; ?>
</div>
<?php endif; ?>
</div>
</div>
</div>
<?php endif; ?>
</div>
</section>