WordPress/elementor-category-grid-widget
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

Compare commits

base: WordPress:e1699f8d025fb2e09e267b1c807571c44b95fe80
Branches Tags
WordPress:main
WordPress:1.4.0 WordPress:1.3.0
..
compare: WordPress:1.3.0
Branches Tags
WordPress:main
WordPress:1.4.0 WordPress:1.3.0

2 Commits
e1699f8d02 ... 1.3.0

Author SHA1 Message Date
MrRaph_
1704d64ed5 feat: Added more option to handle subcategories 2025-05-23 14:14:50 +00:00
MrRaph_
e89e4ad7c2 feat: complies with plugin check 2025-05-23 13:00:45 +00:00
4 changed files with 365 additions and 253 deletions
Expand all files Collapse all files

230
category-grid-widget-for-elementor.php Normal file
View File

@@ -0,0 +1,230 @@
<?php
/**
* Plugin Name: Category Grid Widget for Elementor
* Plugin URI: https://git.mrraph.fr/WordPress/elementor-category-grid-widget-for-elementor
* Description: Responsive article category grid with image for Elementor.
* Version: 1.3.0
* Author: MrRaph_
* Author URI: https://mrraph.photo
* Requires at least: 5.8
* Requires PHP: 7.0
* Text Domain: category-grid-widget-for-elementor
* Requires Plugins: elementor
* License: GPLv2 or later
* License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/
if (!defined('ABSPATH')) {
exit; // Sécurité : empêche l'accès direct.
}
/**
* Charger les scripts Media Uploader et localiser les données JS
* sur les écrans d'ajout ET d'édition de catégorie.
*/
function ccgw_enqueue_media_uploader($hook_suffix)
{
// phpcs:disable WordPress.Security.NonceVerification.Recommended
$taxonomy = filter_input( INPUT_GET, 'taxonomy', FILTER_SANITIZE_STRING );
$taxonomy = sanitize_key( (string) $taxonomy );
// phpcs:enable WordPress.Security.NonceVerification.Recommended
if ( ! in_array( $hook_suffix, [ 'edit-tags.php', 'term.php' ], true ) ) {
return;
}
if ( 'category' !== $taxonomy ) {
return;
}
// Charge la librairie media de WP
wp_enqueue_media();
// Ton script JS
wp_enqueue_script(
'ccgw-category-image',
plugin_dir_url(__FILE__) . 'admin/js/category-image.js',
['jquery'],
'1.3.0',
true
);
// Variable JS
wp_localize_script(
'ccgw-category-image',
'ccgw_data',
[
'title' => esc_js(__('Sélectionner une image de catégorie', 'category-grid-widget-for-elementor')),
'button' => esc_js(__('Sélectionner', 'category-grid-widget-for-elementor')),
]
);
}
add_action('admin_enqueue_scripts', 'ccgw_enqueue_media_uploader');
// 1) Déclarez la colonne "Image" dans le tableau des catégories
add_filter('manage_edit-category_columns', function ($columns) {
$new = [];
foreach ($columns as $key => $label) {
$new[$key] = $label;
if ('name' === $key) {
// après la colonne "Nom", on insère notre colonne "Image"
$new['category_image'] = esc_html__('Image', 'category-grid-widget-for-elementor');
}
}
return $new;
});
// 2) Remplissez la colonne "Image"
add_filter('manage_category_custom_column', function ($out, $column, $term_id) {
if ('category_image' === $column) {
$thumb_id = get_term_meta($term_id, 'thumbnail_id', true);
if ($thumb_id) {
// Affiche la version 'thumbnail' de l'image
return wp_get_attachment_image($thumb_id, 'thumbnail', false, [
'style' => 'max-width:60px;height:auto;'
]);
}
}
return $out;
}, 10, 3);
// 3) Un peu de CSS pour la largeur de colonne et la mise en forme
add_action('admin_head-edit-tags.php', function () {
echo '<style>
.fixed .column-category_image { width: 80px; }
.column-category_image img { display: block; margin: 4px auto; }
</style>';
});
/**
* Affiche le champ d'upload dans le formulaire de création de catégorie.
*/
function ccgw_category_image_field($taxonomy)
{ ?>
<div class="form-field term-group">
<label
for="category-image-id"><?php esc_html_e('Image de la catégorie', 'category-grid-widget-for-elementor'); ?></label>
<input type="hidden" id="category-image-id" name="category-image-id" value="">
<div id="category-image-wrapper"></div>
<p>
<button type="button"
class="button button-secondary ccgw-upload-image"><?php esc_html_e('Choisir une image', 'category-grid-widget-for-elementor'); ?></button>
<button type="button"
class="button button-secondary ccgw-remove-image"><?php esc_html_e('Supprimer l’image', 'category-grid-widget-for-elementor'); ?></button>
</p>
<?php wp_nonce_field('ccgw_save_category_image', 'ccgw_category_image_nonce'); ?>
</div>
<?php }
add_action('category_add_form_fields', 'ccgw_category_image_field', 10, 2);
/**
* Affiche le champ d'upload dans le formulaire d'édition de catégorie.
*/
function ccgw_category_image_field_edit($term, $taxonomy)
{
$image_id = get_term_meta($term->term_id, 'thumbnail_id', true);
$image_url = $image_id ? wp_get_attachment_thumb_url($image_id) : '';
?>
<tr class="form-field term-group-wrap">
<th scope="row">
<label
for="category-image-id"><?php esc_html_e('Image de la catégorie', 'category-grid-widget-for-elementor'); ?></label>
</th>
<td>
<input type="hidden" id="category-image-id" name="category-image-id" value="<?php echo esc_attr($image_id); ?>">
<div id="category-image-wrapper">
<?php if ($image_url): ?>
<?php
echo wp_get_attachment_image(
$image_id,
'thumbnail',
false,
['style' => 'max-width:60px;height:auto;']
);
?>
<?php endif; ?>
</div>
<p>
<button type="button"
class="button button-secondary ccgw-upload-image"><?php esc_html_e('Choisir une image', 'category-grid-widget-for-elementor'); ?></button>
<button type="button"
class="button button-secondary ccgw-remove-image"><?php esc_html_e('Supprimer l’image', 'category-grid-widget-for-elementor'); ?></button>
</p>
</td>
<?php wp_nonce_field('ccgw_save_category_image', 'ccgw_category_image_nonce'); ?>
</tr>
<?php }
add_action('category_edit_form_fields', 'ccgw_category_image_field_edit', 10, 2);
/**
* Sauvegarde le term meta 'thumbnail_id' pour la catégorie,
* en vérifiant le nonce et en sanitisant adéquatement.
*/
function ccgw_save_category_image($term_id)
{
$nonce = isset( $_POST['ccgw_category_image_nonce'] )
? sanitize_text_field( wp_unslash( $_POST['ccgw_category_image_nonce'] ))
: '';
// $nonce = sanitize_text_field( $raw_nonce );
// 1) Vérifier la présence du nonce
if (empty($nonce)) {
return;
}
// 2) Vérifier le nonce
if (!wp_verify_nonce($nonce, 'ccgw_save_category_image')) {
return;
}
// 3) Vérifier la capacité de l’utilisateur
if (!current_user_can('manage_categories')) {
return;
}
// 4) Récupérer et sanitiszer l’ID d’image
if (isset($_POST['category-image-id'])) {
$image_id = intval(wp_unslash($_POST['category-image-id']));
if ($image_id) {
update_term_meta($term_id, 'thumbnail_id', $image_id);
} else {
delete_term_meta($term_id, 'thumbnail_id');
}
}
}
add_action('created_category', 'ccgw_save_category_image', 10, 2);
add_action('edited_category', 'ccgw_save_category_image', 10, 2);
/**
* Enregistrer le widget "Grille de Catégories" pour Elementor.
*
* Inclut le fichier de la classe du widget et enregistre le widget auprès du manager d'Elementor.
*
* @param \Elementor\Widgets_Manager $widgets_manager Le gestionnaire de widgets d'Elementor.
*/
function register_category_grid_widget($widgets_manager)
{
// Inclure le fichier de la classe du widget.
require_once __DIR__ . '/widgets/category-grid-widget.php';
// Enregistrer la classe du widget auprès d'Elementor.
$widgets_manager->register(new \Elementor_Category_Grid_Widget());
}
add_action('elementor/widgets/register', 'register_category_grid_widget');
/**
* Enqueue styles front-end pour le widget.
*/
function ccgw_enqueue_front_styles()
{
// Ne charger que si Elementor est actif
if (defined('ELEMENTOR_VERSION')) {
wp_enqueue_style(
'ccgw-category-grid-style',
plugin_dir_url(__FILE__) . 'css/style.css',
[],
'1.3.0'
);
}
}
add_action('wp_enqueue_scripts', 'ccgw_enqueue_front_styles');

184
elementor-category-grid-widget.php
View File

@@ -1,184 +0,0 @@
<?php
/**
* Plugin Name: Elementor Category Grid Widget
* Plugin URI: https://git.mrraph.fr/WordPress/elementor-category-grid-widget
* Description: Grille responsive de catégories d’articles avec image pour Elementor.
* Version: 1.2.1
* Author: MrRaph_
* Author URI: https://mrraph.photo
* Requires at least: 5.8
* Requires PHP: 7.0
* Text Domain: category-grid-widget
* Requires Plugins: elementor
* License: GPLv2 or later
* License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/
if ( ! defined( 'ABSPATH' ) ) {
exit; // Sécurité : empêche l'accès direct.
}
/**
* Charger les scripts Media Uploader et localiser les données JS
* sur les écrans d'ajout ET d'édition de catégorie.
*/
function ccgw_enqueue_media_uploader( $hook_suffix ) {
// On ne charge que sur edit-tags.php (création) OU term.php (édition)
if ( ! in_array( $hook_suffix, [ 'edit-tags.php', 'term.php' ], true ) ) {
return;
}
// Et seulement pour la taxonomie 'category'
if ( empty( $_GET['taxonomy'] ) || 'category' !== $_GET['taxonomy'] ) {
return;
}
// Charge la librairie media de WP
wp_enqueue_media();
// Ton script JS
wp_enqueue_script(
'ccgw-category-image',
plugin_dir_url( __FILE__ ) . 'admin/js/category-image.js',
[ 'jquery' ],
'1.2.1',
true
);
// Variable JS
wp_localize_script(
'ccgw-category-image',
'ccgw_data',
[
'title' => esc_js( __( 'Sélectionner une image de catégorie', 'category-grid-widget' ) ),
'button' => esc_js( __( 'Sélectionner', 'category-grid-widget' ) ),
]
);
}
add_action( 'admin_enqueue_scripts', 'ccgw_enqueue_media_uploader' );
// 1) Déclarez la colonne "Image" dans le tableau des catégories
add_filter( 'manage_edit-category_columns', function( $columns ) {
$new = [];
foreach ( $columns as $key => $label ) {
$new[ $key ] = $label;
if ( 'name' === $key ) {
// après la colonne "Nom", on insère notre colonne "Image"
$new['category_image'] = esc_html__( 'Image', 'category-grid-widget' );
}
}
return $new;
} );
// 2) Remplissez la colonne "Image"
add_filter( 'manage_category_custom_column', function( $out, $column, $term_id ) {
if ( 'category_image' === $column ) {
$thumb_id = get_term_meta( $term_id, 'thumbnail_id', true );
if ( $thumb_id ) {
// Affiche la version 'thumbnail' de l'image
return wp_get_attachment_image( $thumb_id, 'thumbnail', false, [
'style' => 'max-width:60px;height:auto;'
] );
}
}
return $out;
}, 10, 3 );
// 3) Un peu de CSS pour la largeur de colonne et la mise en forme
add_action( 'admin_head-edit-tags.php', function() {
echo '<style>
.fixed .column-category_image { width: 80px; }
.column-category_image img { display: block; margin: 4px auto; }
</style>';
} );
/**
* Affiche le champ d'upload dans le formulaire de création de catégorie.
*/
function ccgw_category_image_field( $taxonomy ) { ?>
<div class="form-field term-group">
<label for="category-image-id"><?php esc_html_e( 'Image de la catégorie', 'category-grid-widget' ); ?></label>
<input type="hidden" id="category-image-id" name="category-image-id" value="">
<div id="category-image-wrapper"></div>
<p>
<button type="button" class="button button-secondary ccgw-upload-image"><?php esc_html_e( 'Choisir une image', 'category-grid-widget' ); ?></button>
<button type="button" class="button button-secondary ccgw-remove-image"><?php esc_html_e( 'Supprimer l’image', 'category-grid-widget' ); ?></button>
</p>
</div>
<?php }
add_action( 'category_add_form_fields', 'ccgw_category_image_field', 10, 2 );
/**
* Affiche le champ d'upload dans le formulaire d'édition de catégorie.
*/
function ccgw_category_image_field_edit( $term, $taxonomy ) {
$image_id = get_term_meta( $term->term_id, 'thumbnail_id', true );
$image_url = $image_id ? wp_get_attachment_thumb_url( $image_id ) : '';
?>
<tr class="form-field term-group-wrap">
<th scope="row">
<label for="category-image-id"><?php esc_html_e( 'Image de la catégorie', 'category-grid-widget' ); ?></label>
</th>
<td>
<input type="hidden" id="category-image-id" name="category-image-id" value="<?php echo esc_attr( $image_id ); ?>">
<div id="category-image-wrapper">
<?php if ( $image_url ) : ?>
<img src="<?php echo esc_url( $image_url ); ?>" style="max-width:100px; height:auto;">
<?php endif; ?>
</div>
<p>
<button type="button" class="button button-secondary ccgw-upload-image"><?php esc_html_e( 'Choisir une image', 'category-grid-widget' ); ?></button>
<button type="button" class="button button-secondary ccgw-remove-image"><?php esc_html_e( 'Supprimer l’image', 'category-grid-widget' ); ?></button>
</p>
</td>
</tr>
<?php }
add_action( 'category_edit_form_fields', 'ccgw_category_image_field_edit', 10, 2 );
/**
* Sauvegarde le term meta 'thumbnail_id' pour la catégorie.
*/
function ccgw_save_category_image( $term_id ) {
if ( isset( $_POST['category-image-id'] ) ) {
$image_id = intval( $_POST['category-image-id'] );
if ( $image_id ) {
update_term_meta( $term_id, 'thumbnail_id', $image_id );
} else {
delete_term_meta( $term_id, 'thumbnail_id' );
}
}
}
add_action( 'created_category', 'ccgw_save_category_image', 10, 2 );
add_action( 'edited_category', 'ccgw_save_category_image', 10, 2 );
/**
* Enregistrer le widget "Grille de Catégories" pour Elementor.
*
* Inclut le fichier de la classe du widget et enregistre le widget auprès du manager d'Elementor.
*
* @param \Elementor\Widgets_Manager $widgets_manager Le gestionnaire de widgets d'Elementor.
*/
function register_category_grid_widget( $widgets_manager ) {
// Inclure le fichier de la classe du widget.
require_once __DIR__ . '/widgets/category-grid-widget.php';
// Enregistrer la classe du widget auprès d'Elementor.
$widgets_manager->register( new \Elementor_Category_Grid_Widget() );
}
add_action( 'elementor/widgets/register', 'register_category_grid_widget' );
/**
* Enqueue styles front-end pour le widget.
*/
function ccgw_enqueue_front_styles() {
// Ne charger que si Elementor est actif
if ( defined( 'ELEMENTOR_VERSION' ) ) {
wp_enqueue_style(
'ccgw-category-grid-style',
plugin_dir_url( __FILE__ ) . 'css/style.css',
[],
'1.2.1'
);
}
}
add_action( 'wp_enqueue_scripts', 'ccgw_enqueue_front_styles' );

17
readme.txt
View File

@@ -1,19 +1,17 @@
=== Elementor Category Grid Widget === === Category Grid Widget for Elementor ===
Contributors: mrraph Contributors: mrraph
Donate link: https://your-site.example/donate Donate link: https://your-site.example/donate
Tags: elementor, category, grid, widget, posts Tags: elementor, category, grid, widget, posts
Requires at least: 5.8 Requires at least: 5.8
Tested up to: 6.8.1 Tested up to: 6.8
Requires PHP: 7.0 Requires PHP: 7.0
Stable tag: 1.2.1 Stable tag: 1.3.0
License: GPLv2 or later License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html License URI: https://www.gnu.org/licenses/gpl-2.0.html
Responsive grid of post categories with images for Elementor. Responsive grid of post categories with images for Elementor.
Allows manual selection of categories to display, inclusion of subcategories, hiding categories without images, and control over number of columns, image sizes, style settings, and hover effects.
== Description == == Description ==
**Elementor Category Grid Widget** adds a simple yet powerful widget to Elementor for displaying your post categories in a grid: **Category Grid Widget for Elementor** adds a simple yet powerful widget to Elementor for displaying your post categories in a grid:
- Manual selection of categories to display - Manual selection of categories to display
- Option to show subcategories - Option to show subcategories
- Option to hide categories without an image - Option to hide categories without an image
@@ -26,8 +24,8 @@ Allows manual selection of categories to display, inclusion of subcategories, hi
The widget uses WordPress’s native category image feature (a “Category Image” field added in the admin). The widget uses WordPress’s native category image feature (a “Category Image” field added in the admin).
== Installation == == Installation ==
1. Upload the `elementor-category-grid-widget` folder to `/wp-content/plugins/`. 1. Upload the `elementor-category-grid-widget-for-elementor` folder to `/wp-content/plugins/`.
2. Activate **Elementor Category Grid Widget** in the **Plugins** menu. 2. Activate **Category Grid Widget for Elementor** in the **Plugins** menu.
3. In Elementor, add the **Category Grid** widget to your layout. 3. In Elementor, add the **Category Grid** widget to your layout.
4. Configure: select categories, columns, style, and hover effects. 4. Configure: select categories, columns, style, and hover effects.
@@ -48,6 +46,9 @@ Yes, enable the **“Hide categories without image”** option in the widget’s
Open the **Style » Hover** tab: choose the overlay color & opacity, and the title color on hover. Open the **Style » Hover** tab: choose the overlay color & opacity, and the title color on hover.
== Changelog == == Changelog ==
= 1.3.0 =
* Added more option to handle subcategories
= 1.2.1 = = 1.2.1 =
* Initial release * Initial release
* Manual category and subcategory selection * Manual category and subcategory selection

181
widgets/category-grid-widget.php
View File

@@ -33,7 +33,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
*/ */
public function get_title(): string public function get_title(): string
{ {
return esc_html__('Grille de Catégories', 'category-grid-widget'); return esc_html__('Grille de Catégories', 'category-grid-widget-for-elementor');
} }
/** /**
@@ -71,14 +71,14 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->start_controls_section( $this->start_controls_section(
'section_style_grid', 'section_style_grid',
[ [
'label' => esc_html__('Grille', 'category-grid-widget'), 'label' => esc_html__('Grille', 'category-grid-widget-for-elementor'),
'tab' => Controls_Manager::TAB_STYLE, 'tab' => Controls_Manager::TAB_STYLE,
] ]
); );
$this->add_responsive_control( $this->add_responsive_control(
'grid_gap', 'grid_gap',
[ [
'label' => esc_html__('Espacement (gap)', 'category-grid-widget'), 'label' => esc_html__('Espacement (gap)', 'category-grid-widget-for-elementor'),
'type' => Controls_Manager::SLIDER, 'type' => Controls_Manager::SLIDER,
'size_units' => ['px', 'em', '%'], 'size_units' => ['px', 'em', '%'],
'range' => [ 'range' => [
@@ -96,14 +96,14 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->start_controls_section( $this->start_controls_section(
'section_style_card', 'section_style_card',
[ [
'label' => esc_html__('Carte', 'category-grid-widget'), 'label' => esc_html__('Carte', 'category-grid-widget-for-elementor'),
'tab' => Controls_Manager::TAB_STYLE, 'tab' => Controls_Manager::TAB_STYLE,
] ]
); );
$this->add_control( $this->add_control(
'card_bg_color', 'card_bg_color',
[ [
'label' => esc_html__('Fond de la carte', 'category-grid-widget'), 'label' => esc_html__('Fond de la carte', 'category-grid-widget-for-elementor'),
'type' => Controls_Manager::COLOR, 'type' => Controls_Manager::COLOR,
'default' => '', 'default' => '',
'selectors' => [ 'selectors' => [
@@ -115,14 +115,14 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
Group_Control_Typography::get_type(), Group_Control_Typography::get_type(),
[ [
'name' => 'card_title_typography', 'name' => 'card_title_typography',
'label' => esc_html__('Typographie du titre', 'category-grid-widget'), 'label' => esc_html__('Typographie du titre', 'category-grid-widget-for-elementor'),
'selector' => '{{WRAPPER}} .category-card-name', 'selector' => '{{WRAPPER}} .category-card-name',
] ]
); );
$this->add_control( $this->add_control(
'card_border_radius', 'card_border_radius',
[ [
'label' => esc_html__('Border radius', 'category-grid-widget'), 'label' => esc_html__('Border radius', 'category-grid-widget-for-elementor'),
'type' => Controls_Manager::DIMENSIONS, 'type' => Controls_Manager::DIMENSIONS,
'size_units' => ['px', '%'], 'size_units' => ['px', '%'],
'selectors' => [ 'selectors' => [
@@ -134,7 +134,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
\Elementor\Group_Control_Box_Shadow::get_type(), \Elementor\Group_Control_Box_Shadow::get_type(),
[ [
'name' => 'card_box_shadow', 'name' => 'card_box_shadow',
'label' => esc_html__('Ombre de la carte', 'category-grid-widget'), 'label' => esc_html__('Ombre de la carte', 'category-grid-widget-for-elementor'),
'selector' => '{{WRAPPER}} .category-card', 'selector' => '{{WRAPPER}} .category-card',
] ]
); );
@@ -144,7 +144,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->start_controls_section( $this->start_controls_section(
'section_style_title', 'section_style_title',
[ [
'label' => esc_html__('Titre', 'category-grid-widget'), 'label' => esc_html__('Titre', 'category-grid-widget-for-elementor'),
'tab' => Controls_Manager::TAB_STYLE, 'tab' => Controls_Manager::TAB_STYLE,
] ]
); );
@@ -153,10 +153,10 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'disable_title_bg', 'disable_title_bg',
[ [
'label' => esc_html__('Désactiver le fond du titre', 'category-grid-widget'), 'label' => esc_html__('Désactiver le fond du titre', 'category-grid-widget-for-elementor'),
'type' => Controls_Manager::SWITCHER, 'type' => Controls_Manager::SWITCHER,
'label_on' => esc_html__('Oui', 'category-grid-widget'), 'label_on' => esc_html__('Oui', 'category-grid-widget-for-elementor'),
'label_off' => esc_html__('Non', 'category-grid-widget'), 'label_off' => esc_html__('Non', 'category-grid-widget-for-elementor'),
'return_value' => 'yes', 'return_value' => 'yes',
'default' => 'no', 'default' => 'no',
'selectors' => [ 'selectors' => [
@@ -170,7 +170,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'title_text_color', 'title_text_color',
[ [
'label' => esc_html__('Couleur du texte', 'category-grid-widget'), 'label' => esc_html__('Couleur du texte', 'category-grid-widget-for-elementor'),
'type' => Controls_Manager::COLOR, 'type' => Controls_Manager::COLOR,
'default' => '#ffffff', 'default' => '#ffffff',
'selectors' => [ 'selectors' => [
@@ -183,7 +183,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'title_bg_color', 'title_bg_color',
[ [
'label' => esc_html__('Fond du titre', 'category-grid-widget'), 'label' => esc_html__('Fond du titre', 'category-grid-widget-for-elementor'),
'type' => Controls_Manager::COLOR, 'type' => Controls_Manager::COLOR,
'default' => 'rgba(0,0,0,0.4)', 'default' => 'rgba(0,0,0,0.4)',
'selectors' => [ 'selectors' => [
@@ -201,7 +201,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
Group_Control_Typography::get_type(), Group_Control_Typography::get_type(),
[ [
'name' => 'card_title_typography', 'name' => 'card_title_typography',
'label' => esc_html__('Typographie du titre', 'category-grid-widget'), 'label' => esc_html__('Typographie du titre', 'category-grid-widget-for-elementor'),
'selector' => '{{WRAPPER}} .category-card-name', 'selector' => '{{WRAPPER}} .category-card-name',
] ]
); );
@@ -212,7 +212,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->start_controls_section( $this->start_controls_section(
'section_style_hover', 'section_style_hover',
[ [
'label' => esc_html__('Hover', 'category-grid-widget'), 'label' => esc_html__('Hover', 'category-grid-widget-for-elementor'),
'tab' => Controls_Manager::TAB_STYLE, 'tab' => Controls_Manager::TAB_STYLE,
] ]
); );
@@ -221,7 +221,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'hover_overlay_color', 'hover_overlay_color',
[ [
'label' => esc_html__('Couleur de l’overlay', 'category-grid-widget'), 'label' => esc_html__('Couleur de l’overlay', 'category-grid-widget-for-elementor'),
'type' => Controls_Manager::COLOR, 'type' => Controls_Manager::COLOR,
'default' => 'rgba(0,0,0,0.3)', 'default' => 'rgba(0,0,0,0.3)',
'selectors' => [ 'selectors' => [
@@ -235,7 +235,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'hover_overlay_opacity', 'hover_overlay_opacity',
[ [
'label' => esc_html__('Opacité de l’overlay', 'category-grid-widget'), 'label' => esc_html__('Opacité de l’overlay', 'category-grid-widget-for-elementor'),
'type' => Controls_Manager::SLIDER, 'type' => Controls_Manager::SLIDER,
'size_units' => ['%'], 'size_units' => ['%'],
'range' => [ 'range' => [
@@ -253,7 +253,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'title_hover_color', 'title_hover_color',
[ [
'label' => esc_html__('Couleur du titre au hover', 'category-grid-widget'), 'label' => esc_html__('Couleur du titre au hover', 'category-grid-widget-for-elementor'),
'type' => Controls_Manager::COLOR, 'type' => Controls_Manager::COLOR,
'default' => '#ffffff', 'default' => '#ffffff',
'selectors' => [ 'selectors' => [
@@ -274,7 +274,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->start_controls_section( $this->start_controls_section(
'section_content', 'section_content',
[ [
'label' => esc_html__('Catégories', 'category-grid-widget'), 'label' => esc_html__('Catégories', 'category-grid-widget-for-elementor'),
'tab' => \Elementor\Controls_Manager::TAB_CONTENT, 'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
] ]
); );
@@ -288,12 +288,12 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'categories', 'categories',
[ [
'label' => esc_html__('Catégories à afficher', 'category-grid-widget'), 'label' => esc_html__('Catégories à afficher', 'category-grid-widget-for-elementor'),
'type' => \Elementor\Controls_Manager::SELECT2, 'type' => \Elementor\Controls_Manager::SELECT2,
'multiple' => true, 'multiple' => true,
'label_block' => true, 'label_block' => true,
'options' => $options, 'options' => $options,
'description' => esc_html__('Sélectionnez les catégories d’articles à afficher.', 'category-grid-widget'), 'description' => esc_html__('Sélectionnez les catégories d’articles à afficher.', 'category-grid-widget-for-elementor'),
] ]
); );
@@ -301,13 +301,40 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'show_subcategories', 'show_subcategories',
[ [
'label' => esc_html__('Afficher les sous-catégories', 'category-grid-widget'), 'label' => esc_html__('Afficher les sous-catégories', 'category-grid-widget-for-elementor'),
'type' => \Elementor\Controls_Manager::SWITCHER, 'type' => \Elementor\Controls_Manager::SWITCHER,
'label_on' => esc_html__('Oui', 'category-grid-widget'), 'label_on' => esc_html__('Oui', 'category-grid-widget-for-elementor'),
'label_off' => esc_html__('Non', 'category-grid-widget'), 'label_off' => esc_html__('Non', 'category-grid-widget-for-elementor'),
'return_value' => 'yes', 'return_value' => 'yes',
'default' => 'yes', 'default' => 'yes',
'description' => esc_html__('Inclure aussi les sous-catégories des catégories sélectionnées.', 'category-grid-widget'), 'description' => esc_html__('Inclure aussi les sous-catégories des catégories sélectionnées.', 'category-grid-widget-for-elementor'),
]
);
$this->add_control(
'only_subcats_of_selected',
[
'label' => esc_html__('Afficher seulement les sous-catégories des catégories sélectionnées', 'category-grid-widget-for-elementor'),
'type' => \Elementor\Controls_Manager::SWITCHER,
'label_on' => esc_html__('Oui', 'category-grid-widget-for-elementor'),
'label_off' => esc_html__('Non', 'category-grid-widget-for-elementor'),
'return_value' => 'yes',
'default' => 'no',
'description' => esc_html__('Si activé, seules les sous-catégories des catégories choisies seront affichées (et pas les catégories parentes).', 'category-grid-widget-for-elementor'),
]
);
// Contrôle : Afficher les sous-catégories de la page catégorie actuelle
$this->add_control(
'subcats_of_current',
[
'label' => esc_html__('Afficher les sous-catégories de la catégorie actuelle', 'category-grid-widget-for-elementor'),
'type' => \Elementor\Controls_Manager::SWITCHER,
'label_on' => esc_html__('Oui', 'category-grid-widget-for-elementor'),
'label_off' => esc_html__('Non', 'category-grid-widget-for-elementor'),
'return_value' => 'yes',
'default' => 'no',
'description' => esc_html__('Si activé et que l’on est sur une page d’archive de catégorie, affichera ses sous-catégories.', 'category-grid-widget-for-elementor'),
] ]
); );
@@ -316,13 +343,13 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'hide_without_image', 'hide_without_image',
[ [
'label' => esc_html__('Afficher uniquement catégories avec image', 'category-grid-widget'), 'label' => esc_html__('Afficher uniquement catégories avec image', 'category-grid-widget-for-elementor'),
'type' => \Elementor\Controls_Manager::SWITCHER, 'type' => \Elementor\Controls_Manager::SWITCHER,
'label_on' => esc_html__('Oui', 'category-grid-widget'), 'label_on' => esc_html__('Oui', 'category-grid-widget-for-elementor'),
'label_off' => esc_html__('Non', 'category-grid-widget'), 'label_off' => esc_html__('Non', 'category-grid-widget-for-elementor'),
'return_value' => 'yes', 'return_value' => 'yes',
'default' => 'no', 'default' => 'no',
'description' => esc_html__('Si activé, les catégories sans image seront masquées.', 'category-grid-widget'), 'description' => esc_html__('Si activé, les catégories sans image seront masquées.', 'category-grid-widget-for-elementor'),
] ]
); );
@@ -330,12 +357,12 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'order_by', 'order_by',
[ [
'label' => esc_html__('Trier par', 'category-grid-widget'), 'label' => esc_html__('Trier par', 'category-grid-widget-for-elementor'),
'type' => \Elementor\Controls_Manager::SELECT, 'type' => \Elementor\Controls_Manager::SELECT,
'options' => [ 'options' => [
'name' => esc_html__('Nom (alphabétique)', 'category-grid-widget'), 'name' => esc_html__('Nom (alphabétique)', 'category-grid-widget-for-elementor'),
'count' => esc_html__('Nombre d’articles', 'category-grid-widget'), 'count' => esc_html__('Nombre d’articles', 'category-grid-widget-for-elementor'),
'id' => esc_html__('ID (date de création)', 'category-grid-widget'), 'id' => esc_html__('ID (date de création)', 'category-grid-widget-for-elementor'),
], ],
'default' => 'name', 'default' => 'name',
] ]
@@ -345,11 +372,11 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'order', 'order',
[ [
'label' => esc_html__('Ordre', 'category-grid-widget'), 'label' => esc_html__('Ordre', 'category-grid-widget-for-elementor'),
'type' => \Elementor\Controls_Manager::SELECT, 'type' => \Elementor\Controls_Manager::SELECT,
'options' => [ 'options' => [
'ASC' => esc_html__('Croissant (A-Z / 0-9)', 'category-grid-widget'), 'ASC' => esc_html__('Croissant (A-Z / 0-9)', 'category-grid-widget-for-elementor'),
'DESC' => esc_html__('Décroissant (Z-A / 9-0)', 'category-grid-widget'), 'DESC' => esc_html__('Décroissant (Z-A / 9-0)', 'category-grid-widget-for-elementor'),
], ],
'default' => 'ASC', 'default' => 'ASC',
] ]
@@ -361,7 +388,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->start_controls_section( $this->start_controls_section(
'section_layout', 'section_layout',
[ [
'label' => esc_html__('Mise en page', 'category-grid-widget'), 'label' => esc_html__('Mise en page', 'category-grid-widget-for-elementor'),
'tab' => \Elementor\Controls_Manager::TAB_CONTENT, 'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
] ]
); );
@@ -370,7 +397,7 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'columns', 'columns',
[ [
'label' => esc_html__('Nombre de colonnes', 'category-grid-widget'), 'label' => esc_html__('Nombre de colonnes', 'category-grid-widget-for-elementor'),
'type' => \Elementor\Controls_Manager::SELECT, 'type' => \Elementor\Controls_Manager::SELECT,
'options' => [ 'options' => [
1 => '1', 1 => '1',
@@ -388,13 +415,13 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
$this->add_control( $this->add_control(
'image_size', 'image_size',
[ [
'label' => esc_html__('Taille des images', 'category-grid-widget'), 'label' => esc_html__('Taille des images', 'category-grid-widget-for-elementor'),
'type' => \Elementor\Controls_Manager::SELECT, 'type' => \Elementor\Controls_Manager::SELECT,
'options' => [ 'options' => [
'thumbnail' => esc_html__('Miniature (thumbnail)', 'category-grid-widget'), 'thumbnail' => esc_html__('Miniature (thumbnail)', 'category-grid-widget-for-elementor'),
'medium' => esc_html__('Moyen (medium)', 'category-grid-widget'), 'medium' => esc_html__('Moyen (medium)', 'category-grid-widget-for-elementor'),
'large' => esc_html__('Grand (large)', 'category-grid-widget'), 'large' => esc_html__('Grand (large)', 'category-grid-widget-for-elementor'),
'full' => esc_html__('Plein (full)', 'category-grid-widget'), 'full' => esc_html__('Plein (full)', 'category-grid-widget-for-elementor'),
], ],
'default' => 'medium', 'default' => 'medium',
] ]
@@ -426,17 +453,50 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
// Déterminer les catégories à afficher (inclure les sous-catégories si demandé). // Déterminer les catégories à afficher (inclure les sous-catégories si demandé).
$category_ids_to_show = $selected_ids; $category_ids_to_show = $selected_ids;
if (!empty($settings['show_subcategories']) && $settings['show_subcategories'] === 'yes') { // if (!empty($settings['show_subcategories']) && $settings['show_subcategories'] === 'yes') {
// Ajouter les sous-catégories de chaque catégorie sélectionnée. // // Ajouter les sous-catégories de chaque catégorie sélectionnée.
// foreach ($selected_ids as $cat_id) {
// $child_ids = get_term_children($cat_id, 'category');
// if (is_array($child_ids) && !empty($child_ids)) {
// $category_ids_to_show = array_merge($category_ids_to_show, $child_ids);
// }
// }
// // Éliminer les doublons d'ID au cas où.
// $category_ids_to_show = array_unique($category_ids_to_show);
// }
// 1) Cas : on veut les sous-catégories de la page actuelle
if ('yes' === $settings['subcats_of_current']) {
$queried = get_queried_object();
if ($queried && isset($queried->term_id) && 'category' === $queried->taxonomy) {
$category_ids_to_show = get_term_children($queried->term_id, 'category');
} else {
// si pas en archive catégorie, rien à afficher
return;
}
// 2) Sinon, on part des catégories sélectionnées
} else {
$category_ids_to_show = $selected_ids;
// Si on veut uniquement leurs sous-catégories
if ('yes' === $settings['only_subcats_of_selected']) {
$sub_ids = [];
foreach ($selected_ids as $cat_id) { foreach ($selected_ids as $cat_id) {
$child_ids = get_term_children($cat_id, 'category'); $children = get_term_children($cat_id, 'category');
if (is_array($child_ids) && !empty($child_ids)) { if (is_array($children)) {
$category_ids_to_show = array_merge($category_ids_to_show, $child_ids); $sub_ids = array_merge($sub_ids, $children);
} }
} }
// Éliminer les doublons d'ID au cas où. $category_ids_to_show = array_unique($sub_ids);
}
// Sinon, l’ancienne logique : on ajoute ou pas les sous-catégories selon show_subcategories
elseif ('yes' === $settings['show_subcategories']) {
foreach ($selected_ids as $cat_id) {
$category_ids_to_show = array_merge($category_ids_to_show, get_term_children($cat_id, 'category') ?: []);
}
$category_ids_to_show = array_unique($category_ids_to_show); $category_ids_to_show = array_unique($category_ids_to_show);
} }
}
// Préparer les args pour get_terms() – on ne précise PAS le tri si c'est par count // Préparer les args pour get_terms() – on ne précise PAS le tri si c'est par count
$term_args = [ $term_args = [
@@ -511,18 +571,23 @@ class Elementor_Category_Grid_Widget extends \Elementor\Widget_Base
// Rendu HTML // Rendu HTML
echo '<div class="elementor-category-grid ' . esc_attr($grid_class) . '">'; echo '<div class="elementor-category-grid ' . esc_attr($grid_class) . '">';
foreach ($terms as $term) { foreach ($terms as $term) {
$name = esc_html($term->name); $thumbnail_id = get_term_meta($term->term_id, 'thumbnail_id', true);
$link = esc_url(get_term_link($term));
$image_url = esc_url($term->_image_url);
echo '<div class="category-card">'; echo '<div class="category-card">';
echo "<a href=\"{$link}\">"; echo '<a href="' . esc_url(get_term_link($term)) . '">';
if ($image_url) { if (esc_url($term->_image_url)) {
echo '<div class="category-card-image">'; echo '<div class="category-card-image">';
echo '<img src="' . $image_url . '" alt="' . $name . '">'; echo wp_get_attachment_image(
$thumbnail_id,
$settings['image_size'],
false,
[
'alt' => esc_attr($term->name),
'class' => 'category-card-img', // optionnel : ajoutez vos classes CSS
]
);
echo '</div>'; echo '</div>';
} }
echo '<div class="category-card-name">' . $name . '</div>'; echo '<div class="category-card-name">' . esc_html($term->name) . '</div>';
echo '</a>'; echo '</a>';
echo '</div>'; echo '</div>';
} }