Bonjour,
J'ai besoin d'aide pour remplir les cases au fur et à mesure que ça se déplace.
<?php
class Elementor_CustomerSlider_Widget extends \Elementor\Widget_Base {
public function __construct( $data = array(), $args = null ) {
parent::__construct( $data, $args );
wp_enqueue_style('customer_slider', get_stylesheet_directory_uri() . '/elementor/customer-slider/customer-slider.css');
wp_enqueue_script('customer_slider', get_stylesheet_directory_uri() . '/elementor/customer-slider/customer-slider.js', array('jquery'), PENEGA_VERSION, true);
}
public function get_name() {
return 'customer_slider';
}
public function get_title() {
return __( 'Customer Slider', 'penega' );
}
public function get_icon() {
return 'fa fa-cube';
}
public function get_categories() {
return [ 'general' ];
}
protected function _register_controls() {
$this->start_controls_section( 'content_section', [
'label' => __( 'Content', 'penega' ),
'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
]);
$this->add_control( 'speed', [
'label' => __( 'Speed', 'penega' ),
'type' => \Elementor\Controls_Manager::NUMBER,
]);
$this->add_responsive_control( 'size', [
'label' => __( 'Size', 'penega' ),
'type' => \Elementor\Controls_Manager::TEXT,
'default' => '15rem',
]);
$this->end_controls_section();
}
protected function render() {
$guid = uniqid();
$settings = $this->get_settings_for_display();
$clients = [];
$loop = new WP_Query([
'post_type' => 'client',
]);
if ($loop->have_posts()) {
while($loop->have_posts()) {
$loop->the_post();
array_push($clients, (object) [
'thumbnail' => get_the_post_thumbnail(get_the_ID(), null),
]);
}
}
?>
<div id="customer_slider_<?= $guid ?>" class="customer-slider overflow-hidden">
<div class="customer-sliders-scroller no-select" data-auto-horizontal-scroller='{ "duration": <?= $settings['speed'] ?>, "direction": 1 }'>
<?php foreach($clients as $client) : ?>
<div class="customer-slider-item d-flex align-items-center">
<?= $client->thumbnail; ?>
</div>
<?php endforeach ?>
<?php for($i = 0; $i < 8; $i++) : ?>
<div class="customer-slider-item d-flex align-items-center">
<?= get_the_post_thumbnail(111); ?>
</div>
<?php endfor ?>
</div>
<div class="customer-sliders-scroller no-select" data-auto-horizontal-scroller='{ "duration": <?= $settings['speed'] ?>, "direction": -1 }'>
<?php foreach($clients as $client) : ?>
<div class="customer-slider-item d-flex align-items-center">
<?= $client->thumbnail; ?>
</div>
<?php endforeach ?>
<?php for($i = 0; $i < 8; $i++) : ?>
<div class="customer-slider-item d-flex align-items-center">
<?= get_the_post_thumbnail(111); ?>
</div>
<?php endfor ?>
</div>
</div>
<style>
#customer_slider_<?= $guid ?> .customer-slider-item {
min-width: <?= $settings['size'] ?>;
min-height: <?= $settings['size'] ?>;
}
@media all and (max-width: 991px) {
#customer_slider_<?= $guid ?> .customer-slider-item {
min-width: <?= $settings['size_tablet'] ?>;
min-height: <?= $settings['size_tablet'] ?>;
}
}
@media all and (max-width: 767px) {
#customer_slider_<?= $guid ?> .customer-slider-item {
min-width: <?= $settings['size_mobile'] ?>;
min-height: <?= $settings['size_mobile'] ?>;
}
}
</style>
<?php
}
}
Merci beaucoup
J'ai besoin d'aide pour remplir les cases au fur et à mesure que ça se déplace.
<?php
class Elementor_CustomerSlider_Widget extends \Elementor\Widget_Base {
public function __construct( $data = array(), $args = null ) {
parent::__construct( $data, $args );
wp_enqueue_style('customer_slider', get_stylesheet_directory_uri() . '/elementor/customer-slider/customer-slider.css');
wp_enqueue_script('customer_slider', get_stylesheet_directory_uri() . '/elementor/customer-slider/customer-slider.js', array('jquery'), PENEGA_VERSION, true);
}
public function get_name() {
return 'customer_slider';
}
public function get_title() {
return __( 'Customer Slider', 'penega' );
}
public function get_icon() {
return 'fa fa-cube';
}
public function get_categories() {
return [ 'general' ];
}
protected function _register_controls() {
$this->start_controls_section( 'content_section', [
'label' => __( 'Content', 'penega' ),
'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
]);
$this->add_control( 'speed', [
'label' => __( 'Speed', 'penega' ),
'type' => \Elementor\Controls_Manager::NUMBER,
]);
$this->add_responsive_control( 'size', [
'label' => __( 'Size', 'penega' ),
'type' => \Elementor\Controls_Manager::TEXT,
'default' => '15rem',
]);
$this->end_controls_section();
}
protected function render() {
$guid = uniqid();
$settings = $this->get_settings_for_display();
$clients = [];
$loop = new WP_Query([
'post_type' => 'client',
]);
if ($loop->have_posts()) {
while($loop->have_posts()) {
$loop->the_post();
array_push($clients, (object) [
'thumbnail' => get_the_post_thumbnail(get_the_ID(), null),
]);
}
}
?>
<div id="customer_slider_<?= $guid ?>" class="customer-slider overflow-hidden">
<div class="customer-sliders-scroller no-select" data-auto-horizontal-scroller='{ "duration": <?= $settings['speed'] ?>, "direction": 1 }'>
<?php foreach($clients as $client) : ?>
<div class="customer-slider-item d-flex align-items-center">
<?= $client->thumbnail; ?>
</div>
<?php endforeach ?>
<?php for($i = 0; $i < 8; $i++) : ?>
<div class="customer-slider-item d-flex align-items-center">
<?= get_the_post_thumbnail(111); ?>
</div>
<?php endfor ?>
</div>
<div class="customer-sliders-scroller no-select" data-auto-horizontal-scroller='{ "duration": <?= $settings['speed'] ?>, "direction": -1 }'>
<?php foreach($clients as $client) : ?>
<div class="customer-slider-item d-flex align-items-center">
<?= $client->thumbnail; ?>
</div>
<?php endforeach ?>
<?php for($i = 0; $i < 8; $i++) : ?>
<div class="customer-slider-item d-flex align-items-center">
<?= get_the_post_thumbnail(111); ?>
</div>
<?php endfor ?>
</div>
</div>
<style>
#customer_slider_<?= $guid ?> .customer-slider-item {
min-width: <?= $settings['size'] ?>;
min-height: <?= $settings['size'] ?>;
}
@media all and (max-width: 991px) {
#customer_slider_<?= $guid ?> .customer-slider-item {
min-width: <?= $settings['size_tablet'] ?>;
min-height: <?= $settings['size_tablet'] ?>;
}
}
@media all and (max-width: 767px) {
#customer_slider_<?= $guid ?> .customer-slider-item {
min-width: <?= $settings['size_mobile'] ?>;
min-height: <?= $settings['size_mobile'] ?>;
}
}
</style>
<?php
}
}
Merci beaucoup