class-elementor-widget-carousel.php

<?php

use Elementor\Controls_Manager;
use Elementor\Group_Control_Background;
use Elementor\Plugin;
use Elementor\Widget_Base;

if ( ! defined( 'ABSPATH' ) ) {
	// Exit if accessed directly.
	exit;
}

class PE_Carousel_Widget extends Widget_Base {
	/**
	 * Get the widget's name.
	 *
	 * @return string
	 */
	public function get_name(): string {
		return 'pe-carousel-widget';
	}

	/**
	 * Get the widget's title.
	 *
	 * @return string
	 */
	public function get_title(): string {
		return esc_html__( 'PE Carousel', PE_PLUGIN_DOMAIN );
	}

	/**
	 * Get the widget's icon.
	 *
	 * @return string
	 */
	public function get_icon(): string {
		return 'fa fa-clipboard';
	}

	/**
	 * Add the widget to a category.
	 * Previously setup in the class-widgets.php file.
	 *
	 * @return string[]
	 */
	public function get_categories(): array {
		return [ 'pe-category' ];
	}

	protected function _register_controls() {
		$this->start_controls_section(
			'content_section',
			[
				'label' => esc_html__( 'Carousel', PE_PLUGIN_DOMAIN ),
				'tab' => Controls_Manager::TAB_CONTENT,
			]
		);

		$this->add_group_control(
			Group_Control_Background::get_type(),
			[
				'name' => 'background',
				'label' => __( 'Background', PE_PLUGIN_DOMAIN ),
				'types' => [ 'classic', 'gradient', 'video' ],
				'selector' => '{{WRAPPER}} .pe-wrapper-carousel',
			]
		);

		$this->add_control(
			'pe-testimonials-posts-per-page',
			[
				'label' => __( 'Post Per Page', PE_PLUGIN_DOMAIN ),
				'type' => Controls_Manager::SELECT,
				'multiple' => false,
				'default' => '5',
				'options' => [
					'5' => '5',
					'10' => '10',
					'-1' => '-1',
				]
			]
		);

		$this->add_control(
			'pe-testimonials-order-by',
			[
				'label' => __( 'Order By', PE_PLUGIN_DOMAIN ),
				'type' => Controls_Manager::SELECT,
				'multiple' => false,
				'default' => 'rand',
				'options' => [
					'name' => 'name',
					'title' => 'title',
					'date' => 'date',
					'rand' => 'rand'
				]
			]
		);

		$this->add_control(
		'pe-testimonials-order',
			[
				'label' => __( 'Order', PE_PLUGIN_DOMAIN ),
				'type' => Controls_Manager::SELECT,
				'multiple' => false,
				'default' => 'DESC',
				'options' => [
					'ASC' => 'ASC',
					'DESC' => 'DESC',
				]
			]
		);

		$this->end_controls_section();
	}

	protected function render() {
		$postsPerPage = $this->get_settings_for_display('pe-testimonials-posts-per-page');
		$orderBy = $this->get_settings_for_display('pe-testimonials-order-by');
		$order = $this->get_settings_for_display('pe-testimonials-order');

		$args = array(
			'post_type' => 'testimonial', // or any other custom post type
			'post_status' => 'publish',
			'posts_per_page' => $postsPerPage,
			'orderby' => $orderBy,
			'order' => $order
		);

		$posts = new WP_Query($args);
		$testimonials = $posts->posts;


		if (Plugin::$instance->editor->is_edit_mode()) {
			// If the Elementor editor is opened.

		} ?>

		<!-- include the background class if yuo want to add a background color  -->
		<div class="pe-section-posts pe-wrapper-carousel">
			<div class="pe-cpt-container">
				<?php if($testimonials):
					foreach ($testimonials as $testimonial): ?>
						<div class="pe-cpt">
							<h3><?= $testimonial->post_title; ?></h3>
							<p><?= $testimonial->post_content; ?></p>
						</div>
					<?php endforeach;
				endif; ?>
			</div>
		</div>

	<?php }
}

Plugin::instance()->widgets_manager->register_widget_type( new PE_Carousel_Widget() );