ultimate-post-kit / modules / alter-carousel / widgets / alter-carousel.php

alter-carousel.php in Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets 4.1.3, at modules/alter-carousel/widgets/alter-carousel.php

1,268 lines 32.0 KB

Raw Download Zip

1	<?php
2
3	namespace UltimatePostKit\Modules\AlterCarousel\Widgets;
4
5	use Elementor\Controls_Manager;
6	use Elementor\Group_Control_Border;
7	use Elementor\Group_Control_Box_Shadow;
8	use Elementor\Group_Control_Typography;
9	use Elementor\Group_Control_Text_Shadow;
10	use Elementor\Group_Control_Image_Size;
11	use Elementor\Group_Control_Background;
12	use Elementor\Icons_Manager;
13
14	use UltimatePostKit\Traits\Global_Widget_Controls;
15	use UltimatePostKit\Traits\Global_Widget_Functions;
16	use UltimatePostKit\Traits\Global_Swiper_Functions;
17	use UltimatePostKit\Includes\Controls\GroupQuery\Group_Control_Query;
18	use WP_Query;
19
20	if (!defined('ABSPATH')) exit; // Exit if accessed directly
21
22	class Alter_Carousel extends Group_Control_Query
23	{
24
25	use Global_Widget_Controls;
26	use Global_Widget_Functions;
27	use Global_Swiper_Functions;
28
29	private $_query = null;
30
31	public function get_name()
32	{
33	return 'upk-alter-carousel';
34	}
35
36	public function get_title()
37	{
38	return BDTUPK . esc_html__('Alter Carousel', 'ultimate-post-kit');
39	}
40
41	public function get_icon()
42	{
43	return 'upk-widget-icon upk-icon-alter-carousel';
44	}
45
46	public function get_categories()
47	{
48	return ['ultimate-post-kit'];
49	}
50
51	public function get_keywords()
52	{
53	return ['post', 'carousel', 'blog', 'recent', 'news', 'alter'];
54	}
55
56	public function get_style_depends()
57	{
58	if ($this->upk_is_edit_mode()) {
59	return ['swiper', 'upk-all-styles'];
60	} else {
61	return ['swiper', 'upk-font', 'upk-alter-carousel'];
62	}
63	}
64
65	public function get_script_depends()
66	{
67	if ($this->upk_is_edit_mode()) {
68	return ['swiper', 'upk-all-scripts'];
69	} else {
70	return ['swiper', 'upk-alter-carousel'];
71	}
72	}
73
74	public function get_custom_help_url()
75	{
76	return 'https://youtu.be/KInlL05e_lk';
77	}
78
79	public function get_query()
80	{
81	return $this->_query;
82	}
83
84	public function has_widget_inner_wrapper(): bool {
85	return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
86	}
87
88
89	protected function register_controls() {
90	$this->start_controls_section(
91	'section_content_layout',
92	[
93	'label' => esc_html__('Layout', 'ultimate-post-kit'),
94	]
95	);
96
97	$this->add_responsive_control(
98	'columns',
99	[
100	'label' => esc_html__('Columns', 'ultimate-post-kit'),
101	'type' => Controls_Manager::SELECT,
102	'default' => 3,
103	'tablet_default' => 2,
104	'mobile_default' => 1,
105	'options' => [
106	1 => esc_html__('1', 'ultimate-post-kit'),
107	2 => esc_html__('2', 'ultimate-post-kit'),
108	3 => esc_html__('3', 'ultimate-post-kit'),
109	4 => esc_html__('4', 'ultimate-post-kit'),
110	5 => esc_html__('5', 'ultimate-post-kit'),
111	6 => esc_html__('6', 'ultimate-post-kit'),
112	],
113	]
114	);
115
116	$this->add_responsive_control(
117	'item_gap',
118	[
119	'label' => esc_html__('Item Gap', 'ultimate-post-kit'),
120	'type' => Controls_Manager::SLIDER,
121	'default' => [
122	'size' => 20,
123	],
124	'tablet_default' => [
125	'size' => 20,
126	],
127	'mobile_default' => [
128	'size' => 20,
129	],
130	'range' => [
131	'px' => [
132	'min' => 0,
133	'max' => 100,
134	],
135	],
136	]
137	);
138
139	$this->add_group_control(
140	Group_Control_Image_Size::get_type(),
141	[
142	'name' => 'primary_thumbnail',
143	'exclude' => ['custom'],
144	'default' => 'medium',
145	]
146	);
147
148	$this->add_responsive_control(
149	'default_image_height',
150	[
151	'label' => esc_html__('Image Height(px)', 'ultimate-post-kit'),
152	'type' => Controls_Manager::SLIDER,
153	'range' => [
154	'px' => [
155	'min' => 100,
156	'max' => 500,
157	],
158	],
159	'selectors' => [
160	'{{WRAPPER}} .upk-alter-carousel .upk-img-wrap .upk-main-img' => 'height: {{SIZE}}px;',
161	],
162	]
163	);
164
165	$this->end_controls_section();
166
167	// Query Settings
168	$this->start_controls_section(
169	'section_post_query_builder',
170	[
171	'label' => esc_html__('Query', 'ultimate-post-kit'),
172	'tab' => Controls_Manager::TAB_CONTENT,
173	]
174	);
175
176	$this->add_control(
177	'item_limit',
178	[
179	'label' => esc_html__('Item Limit', 'ultimate-post-kit'),
180	'type' => Controls_Manager::SLIDER,
181	'range' => [
182	'px' => [
183	'min' => 1,
184	'max' => 20,
185	],
186	],
187	'default' => [
188	'size' => 6,
189	],
190	]
191	);
192
193	$this->register_query_builder_controls();
194
195	$this->end_controls_section();
196
197	$this->start_controls_section(
198	'section_content_additional',
199	[
200	'label' => esc_html__('Additional Options', 'ultimate-post-kit'),
201	]
202	);
203
204	//Global Title Controls
205	$this->register_title_controls();
206	$this->register_text_controls();
207
208	$this->add_control(
209	'show_author',
210	[
211	'label' => esc_html__('Show Author', 'ultimate-post-kit'),
212	'type' => Controls_Manager::SWITCHER,
213	'default' => 'yes',
214	'separator' => 'before'
215	]
216	);
217
218	$this->add_control(
219	'meta_separator',
220	[
221	'label' => esc_html__('Separator', 'ultimate-post-kit'),
222	'type' => Controls_Manager::TEXT,
223	'default' => '\|',
224	'label_block' => false,
225	]
226	);
227
228	//Global Date Controls
229	$this->register_date_controls();
230
231	//Global Reading Time Controls
232	$this->register_reading_time_controls();
233
234	$this->add_control(
235	'show_category',
236	[
237	'label' => esc_html__('Show Category', 'ultimate-post-kit'),
238	'type' => Controls_Manager::SWITCHER,
239	'default' => 'yes',
240	'separator' => 'before'
241	]
242	);
243
244	$this->add_control(
245	'readmore_type',
246	[
247	'label' => esc_html__('Read More Type', 'ultimate-post-kit') . BDTUPK_PC,
248	'type' => Controls_Manager::SELECT,
249	'default' => 'none',
250	'options' => [
251	'none' => esc_html__('None', 'ultimate-post-kit'),
252	'classic' => esc_html__('Classic', 'ultimate-post-kit'),
253	'on_image' => esc_html__('On Image', 'ultimate-post-kit'),
254	],
255	'separator' => 'before',
256	'classes' => BDTUPK_IS_PC
257	]
258	);
259
260	$this->add_control(
261	'item_match_height',
262	[
263	'label' => esc_html__('Item Match Height', 'ultimate-post-kit'),
264	'type' => Controls_Manager::SWITCHER,
265	'default' => 'yes',
266	'prefix_class' => 'upk-item-match-height--',
267	'separator' => 'before',
268	'render_type' => 'template'
269	]
270	);
271
272	$this->add_control(
273	'meta_end_position',
274	[
275	'label' => esc_html__('Meta End Position', 'ultimate-post-kit'),
276	'type' => Controls_Manager::SWITCHER,
277	'prefix_class' => 'upk-meta-end-position--',
278	'condition' => [
279	'item_match_height' => 'yes'
280	]
281	]
282	);
283
284	$this->add_control(
285	'show_post_format',
286	[
287	'label' => esc_html__('Post Format', 'ultimate-post-kit'),
288	'type' => Controls_Manager::SWITCHER,
289	'separator' => 'before'
290	]
291	);
292
293	$this->add_control(
294	'global_link',
295	[
296	'label' => esc_html__('Item Wrapper Link', 'ultimate-post-kit'),
297	'type' => Controls_Manager::SWITCHER,
298	'prefix_class' => 'upk-global-link-',
299	'description' => esc_html__('Be aware! When Item Wrapper Link activated then title link and read more link will not work', 'ultimate-post-kit'),
300	'separator' => 'before',
301	]
302	);
303
304	$this->end_controls_section();
305
306	$this->start_controls_section(
307	'section_content_readmore',
308	[
309	'label' => esc_html__('Read More', 'ultimate-post-kit'),
310	'condition' => [
311	'readmore_type' => 'classic',
312	],
313	]
314	);
315
316	$this->add_control(
317	'readmore_text',
318	[
319	'label' => esc_html__('Read More Text', 'ultimate-post-kit'),
320	'type' => Controls_Manager::TEXT,
321	'dynamic' => [ 'active' => true ],
322	'default' => esc_html__('Read More', 'ultimate-post-kit'),
323	'placeholder' => esc_html__('Read More', 'ultimate-post-kit'),
324	]
325	);
326
327	$this->add_control(
328	'readmore_icon',
329	[
330	'label' => esc_html__('Icon', 'ultimate-post-kit'),
331	'type' => Controls_Manager::ICONS,
332	'label_block' => false,
333	'skin' => 'inline'
334	]
335	);
336
337	$this->add_control(
338	'readmore_icon_align',
339	[
340	'label' => esc_html__('Icon Position', 'ultimate-post-kit'),
341	'type' => Controls_Manager::CHOOSE,
342	'default' => 'right',
343	'toggle' => false,
344	'options' => [
345	'left' => [
346	'title' => esc_html__('Left', 'ultimate-post-kit'),
347	'icon' => 'eicon-h-align-left',
348	],
349	'right' => [
350	'title' => esc_html__('Right', 'ultimate-post-kit'),
351	'icon' => 'eicon-h-align-right',
352	],
353	],
354	'condition' => [
355	'readmore_icon[value]!' => '',
356	],
357	]
358	);
359
360	$this->add_responsive_control(
361	'readmore_icon_indent',
362	[
363	'label' => esc_html__('Icon Spacing', 'ultimate-post-kit'),
364	'type' => Controls_Manager::SLIDER,
365	'default' => [
366	'size' => 8,
367	],
368	'range' => [
369	'px' => [
370	'max' => 50,
371	],
372	],
373	'condition' => [
374	'readmore_icon[value]!' => '',
375	],
376	'selectors' => [
377	'{{WRAPPER}} .upk-alter-carousel .upk-button-icon-align-right' => is_rtl() ? 'margin-right: {{SIZE}}{{UNIT}};' : 'margin-left: {{SIZE}}{{UNIT}};',
378	'{{WRAPPER}} .upk-alter-carousel .upk-button-icon-align-left' => is_rtl() ? 'margin-left: {{SIZE}}{{UNIT}};' : 'margin-right: {{SIZE}}{{UNIT}};',
379	],
380	]
381	);
382
383	$this->end_controls_section();
384
385	//Navigaiton Global Controls
386	$this->register_navigation_controls('alter');
387
388	//Style
389	$this->start_controls_section(
390	'upk_section_style',
391	[
392	'label' => esc_html__('Items', 'ultimate-post-kit'),
393	'tab' => Controls_Manager::TAB_STYLE,
394	]
395	);
396
397	$this->add_responsive_control(
398	'content_padding',
399	[
400	'label' => esc_html__('Content Padding', 'ultimate-post-kit'),
401	'type' => Controls_Manager::DIMENSIONS,
402	'size_units' => ['px', 'em', '%'],
403	'selectors' => [
404	'{{WRAPPER}} .upk-alter-carousel .upk-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
405	],
406	]
407	);
408
409	$this->start_controls_tabs('tabs_item_style');
410
411	$this->start_controls_tab(
412	'tab_item_normal',
413	[
414	'label' => esc_html__('Normal', 'ultimate-post-kit'),
415	]
416	);
417
418	$this->add_group_control(
419	Group_Control_Background::get_type(),
420	[
421	'name' => 'itam_background',
422	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-item',
423	]
424	);
425
426	$this->add_group_control(
427	Group_Control_Border::get_type(),
428	[
429	'name' => 'item_border',
430	'label' => esc_html__('Border', 'ultimate-post-kit'),
431	'placeholder' => '1px',
432	'default' => '1px',
433	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-item',
434	]
435	);
436
437	$this->add_responsive_control(
438	'item_border_radius',
439	[
440	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
441	'type' => Controls_Manager::DIMENSIONS,
442	'size_units' => ['px', '%'],
443	'selectors' => [
444	'{{WRAPPER}} .upk-alter-carousel .upk-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
445	],
446	]
447	);
448
449	$this->add_group_control(
450	Group_Control_Box_Shadow::get_type(),
451	[
452	'name' => 'item_box_shadow',
453	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-item',
454	]
455	);
456
457	$this->end_controls_tab();
458
459	$this->start_controls_tab(
460	'tab_item_hover',
461	[
462	'label' => esc_html__('Hover', 'ultimate-post-kit'),
463	]
464	);
465
466	$this->add_group_control(
467	Group_Control_Background::get_type(),
468	[
469	'name' => 'itam_background_hover',
470	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-item:hover',
471	]
472	);
473
474	$this->add_control(
475	'item_border_color_hover',
476	[
477	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
478	'type' => Controls_Manager::COLOR,
479	'selectors' => [
480	'{{WRAPPER}} .upk-alter-carousel .upk-item:hover' => 'border-color: {{VALUE}};'
481	],
482	'condition' => [
483	'item_border_border!' => ''
484	]
485	]
486	);
487
488	$this->add_group_control(
489	Group_Control_Box_Shadow::get_type(),
490	[
491	'name' => 'item_box_shadow_hover',
492	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-item:hover',
493	]
494	);
495
496	$this->add_responsive_control(
497	'item_shadow_padding',
498	[
499	'label' => esc_html__('Match Padding', 'ultimate-post-kit'),
500	'description' => esc_html__('You have to add padding for matching overlaping normal/hover box shadow when you used Box Shadow option.', 'ultimate-post-kit'),
501	'type' => Controls_Manager::SLIDER,
502	'range' => [
503	'px' => [
504	'min' => 0,
505	'step' => 1,
506	'max' => 50,
507	]
508	],
509	'selectors' => [
510	'{{WRAPPER}} .swiper-carousel' => 'padding: {{SIZE}}{{UNIT}}; margin: 0 -{{SIZE}}{{UNIT}};'
511	],
512	]
513	);
514
515	$this->end_controls_tab();
516
517	$this->end_controls_tabs();
518
519	$this->end_controls_section();
520
521	$this->start_controls_section(
522	'section_style_title',
523	[
524	'label' => esc_html__('Title', 'ultimate-post-kit'),
525	'tab' => Controls_Manager::TAB_STYLE,
526	'condition' => [
527	'show_title' => 'yes',
528	],
529	]
530	);
531
532	$this->add_control(
533	'title_style',
534	[
535	'label' => esc_html__('Style', 'ultimate-post-kit'),
536	'type' => Controls_Manager::SELECT,
537	'default' => 'underline',
538	'options' => [
539	'underline' => esc_html__('Underline', 'ultimate-post-kit'),
540	'middle-underline' => esc_html__('Middle Underline', 'ultimate-post-kit'),
541	'overline' => esc_html__('Overline', 'ultimate-post-kit'),
542	'middle-overline' => esc_html__('Middle Overline', 'ultimate-post-kit'),
543	],
544	]
545	);
546
547	$this->add_control(
548	'title_color',
549	[
550	'label' => esc_html__('Color', 'ultimate-post-kit'),
551	'type' => Controls_Manager::COLOR,
552	'selectors' => [
553	'{{WRAPPER}} .upk-alter-carousel .upk-title a' => 'color: {{VALUE}};',
554	],
555	]
556	);
557
558	$this->add_control(
559	'title_hover_color',
560	[
561	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
562	'type' => Controls_Manager::COLOR,
563	'selectors' => [
564	'{{WRAPPER}} .upk-alter-carousel .upk-title a:hover' => 'color: {{VALUE}};',
565	],
566	]
567	);
568
569	$this->add_responsive_control(
570	'title_spacing',
571	[
572	'label' => esc_html__('Spacing', 'ultimate-post-kit'),
573	'type' => Controls_Manager::SLIDER,
574	'range' => [
575	'px' => [
576	'min' => 0,
577	'max' => 50,
578	],
579	],
580	'selectors' => [
581	'{{WRAPPER}} .upk-alter-carousel .upk-title' => 'margin-bottom: {{SIZE}}{{UNIT}};',
582	],
583	]
584	);
585
586	$this->add_group_control(
587	Group_Control_Typography::get_type(),
588	[
589	'name' => 'title_typography',
590	'label' => esc_html__('Typography', 'ultimate-post-kit'),
591	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-title a',
592	]
593	);
594
595	$this->add_control(
596	'title_advanced_style',
597	[
598	'label' => esc_html__('Advanced Style', 'ultimate-post-kit'),
599	'type' => Controls_Manager::SWITCHER,
600	]
601	);
602
603	$this->add_control(
604	'title_background',
605	[
606	'label' => esc_html__('Background Color', 'ultimate-post-kit'),
607	'type' => Controls_Manager::COLOR,
608	'selectors' => [
609	'{{WRAPPER}} .upk-alter-carousel .upk-title a' => 'background-color: {{VALUE}};',
610	],
611	'condition' => [
612	'title_advanced_style' => 'yes'
613	]
614	]
615	);
616
617	$this->add_group_control(
618	Group_Control_Text_Shadow::get_type(),
619	[
620	'name' => 'title_text_shadow',
621	'label' => esc_html__('Text Shadow', 'ultimate-post-kit'),
622	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-title a',
623	'condition' => [
624	'title_advanced_style' => 'yes'
625	]
626	]
627	);
628
629	$this->add_group_control(
630	Group_Control_Border::get_type(),
631	[
632	'name' => 'title_border',
633	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-title a',
634	'condition' => [
635	'title_advanced_style' => 'yes'
636	]
637	]
638	);
639
640	$this->add_responsive_control(
641	'title_border_radius',
642	[
643	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
644	'type' => Controls_Manager::DIMENSIONS,
645	'size_units' => ['px', '%'],
646	'selectors' => [
647	'{{WRAPPER}} .upk-alter-carousel .upk-title a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
648	],
649	'condition' => [
650	'title_advanced_style' => 'yes'
651	]
652	]
653	);
654
655	$this->add_group_control(
656	Group_Control_Box_Shadow::get_type(),
657	[
658	'name' => 'title_box_shadow',
659	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-title a',
660	'condition' => [
661	'title_advanced_style' => 'yes'
662	]
663	]
664	);
665
666	$this->add_responsive_control(
667	'title_text_padding',
668	[
669	'label' => esc_html__('Padding', 'ultimate-post-kit'),
670	'type' => Controls_Manager::DIMENSIONS,
671	'size_units' => ['px', 'em', '%'],
672	'selectors' => [
673	'{{WRAPPER}} .upk-alter-carousel .upk-title a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
674	],
675	'condition' => [
676	'title_advanced_style' => 'yes'
677	]
678	]
679	);
680
681	$this->end_controls_section();
682
683	$this->start_controls_section(
684	'section_style_text',
685	[
686	'label' => esc_html__('Text', 'ultimate-post-kit'),
687	'tab' => Controls_Manager::TAB_STYLE,
688	'condition' => [
689	'show_excerpt' => 'yes',
690	],
691	]
692	);
693
694	$this->add_control(
695	'text_color',
696	[
697	'label' => esc_html__('Color', 'ultimate-post-kit'),
698	'type' => Controls_Manager::COLOR,
699	'selectors' => [
700	'{{WRAPPER}} .upk-alter-carousel .upk-text' => 'color: {{VALUE}};',
701	],
702	]
703	);
704
705	$this->add_group_control(
706	Group_Control_Typography::get_type(),
707	[
708	'name' => 'text_typography',
709	'label' => esc_html__('Typography', 'ultimate-post-kit'),
710	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-text',
711	]
712	);
713
714	$this->add_responsive_control(
715	'text_margin',
716	[
717	'label' => esc_html__('Margin', 'ultimate-post-kit'),
718	'type' => Controls_Manager::DIMENSIONS,
719	'size_units' => ['px', 'em', '%'],
720	'selectors' => [
721	'{{WRAPPER}} .upk-alter-carousel .upk-text' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
722	]
723	]
724	);
725
726	$this->end_controls_section();
727
728	$this->start_controls_section(
729	'section_style_author',
730	[
731	'label' => esc_html__('Meta', 'ultimate-post-kit'),
732	'tab' => Controls_Manager::TAB_STYLE,
733	'conditions' => [
734	'relation' => 'or',
735	'terms' => [
736	[
737	'name' => 'show_author',
738	'value' => 'yes'
739	],
740	[
741	'name' => 'show_date',
742	'value' => 'yes'
743	]
744	]
745	],
746	]
747	);
748
749	$this->add_control(
750	'author_color',
751	[
752	'label' => esc_html__('Color', 'ultimate-post-kit'),
753	'type' => Controls_Manager::COLOR,
754	'selectors' => [
755	'{{WRAPPER}} .upk-alter-carousel .upk-meta .upk-blog-author a, {{WRAPPER}} .upk-alter-carousel .upk-meta' => 'color: {{VALUE}};',
756	],
757	]
758	);
759
760	$this->add_control(
761	'author_hover_color',
762	[
763	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
764	'type' => Controls_Manager::COLOR,
765	'selectors' => [
766	'{{WRAPPER}} .upk-alter-carousel .upk-meta .upk-blog-author a:hover' => 'color: {{VALUE}};',
767	],
768	]
769	);
770
771	$this->add_responsive_control(
772	'meta_spacing',
773	[
774	'label' => esc_html__('Space Between', 'ultimate-post-kit'),
775	'type' => Controls_Manager::SLIDER,
776	'range' => [
777	'px' => [
778	'min' => 0,
779	'max' => 50,
780	],
781	],
782	'selectors' => [
783	'{{WRAPPER}} .upk-alter-carousel .upk-meta > div:before' => 'margin: 0 {{SIZE}}{{UNIT}};',
784	],
785	]
786	);
787
788	$this->add_group_control(
789	Group_Control_Typography::get_type(),
790	[
791	'name' => 'author_typography',
792	'label' => esc_html__('Typography', 'ultimate-post-kit'),
793	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-meta',
794	]
795	);
796
797	$this->end_controls_section();
798
799	$this->start_controls_section(
800	'section_style_category',
801	[
802	'label' => esc_html__('Category', 'ultimate-post-kit'),
803	'tab' => Controls_Manager::TAB_STYLE,
804	'condition' => [
805	'show_category' => 'yes',
806	],
807	]
808	);
809
810	$this->add_responsive_control(
811	'category_spacing',
812	[
813	'label' => esc_html__('Spacing', 'ultimate-post-kit'),
814	'type' => Controls_Manager::SLIDER,
815	'range' => [
816	'px' => [
817	'min' => 0,
818	'max' => 50,
819	],
820	],
821	'selectors' => [
822	'{{WRAPPER}} .upk-alter-carousel .upk-category' => 'margin-bottom: {{SIZE}}{{UNIT}};',
823	],
824	]
825	);
826
827	$this->start_controls_tabs('tabs_category_style');
828
829	$this->start_controls_tab(
830	'tab_category_normal',
831	[
832	'label' => esc_html__('Normal', 'ultimate-post-kit'),
833	]
834	);
835
836	$this->add_control(
837	'category_color',
838	[
839	'label' => esc_html__('Color', 'ultimate-post-kit'),
840	'type' => Controls_Manager::COLOR,
841	'selectors' => [
842	'{{WRAPPER}} .upk-alter-carousel .upk-category a' => 'color: {{VALUE}};',
843	],
844	]
845	);
846
847	$this->add_group_control(
848	Group_Control_Background::get_type(),
849	[
850	'name' => 'category_background',
851	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-category a',
852	]
853	);
854
855	$this->add_group_control(
856	Group_Control_Border::get_type(),
857	[
858	'name' => 'category_border',
859	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-category a',
860	]
861	);
862
863	$this->add_responsive_control(
864	'category_border_radius',
865	[
866	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
867	'type' => Controls_Manager::DIMENSIONS,
868	'size_units' => ['px', '%'],
869	'selectors' => [
870	'{{WRAPPER}} .upk-alter-carousel .upk-category a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
871	],
872	]
873	);
874
875	$this->add_responsive_control(
876	'category_padding',
877	[
878	'label' => esc_html__('Padding', 'ultimate-post-kit'),
879	'type' => Controls_Manager::DIMENSIONS,
880	'size_units' => ['px', 'em', '%'],
881	'selectors' => [
882	'{{WRAPPER}} .upk-alter-carousel .upk-category a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
883	],
884	]
885	);
886
887	$this->add_responsive_control(
888	'category_margin',
889	[
890	'label' => esc_html__('Margin', 'ultimate-post-kit'),
891	'type' => Controls_Manager::DIMENSIONS,
892	'size_units' => ['px', 'em', '%'],
893	'selectors' => [
894	'{{WRAPPER}} .upk-alter-carousel .upk-category' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
895	],
896	]
897	);
898
899	$this->add_responsive_control(
900	'category_spacing_between',
901	[
902	'label' => esc_html__('Space Between', 'ultimate-post-kit'),
903	'type' => Controls_Manager::SLIDER,
904	'range' => [
905	'px' => [
906	'min' => 0,
907	'max' => 50,
908	],
909	],
910	'selectors' => [
911	'{{WRAPPER}} .upk-alter-carousel .upk-category a+a' => 'margin-left: {{SIZE}}{{UNIT}};',
912	],
913	]
914	);
915
916
917	$this->add_group_control(
918	Group_Control_Box_Shadow::get_type(),
919	[
920	'name' => 'category_shadow',
921	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-category a',
922	]
923	);
924
925	$this->add_group_control(
926	Group_Control_Typography::get_type(),
927	[
928	'name' => 'category_typography',
929	'label' => esc_html__('Typography', 'ultimate-post-kit'),
930	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-category a',
931	]
932	);
933
934	$this->end_controls_tab();
935
936	$this->start_controls_tab(
937	'tab_category_hover',
938	[
939	'label' => esc_html__('Hover', 'ultimate-post-kit'),
940	]
941	);
942
943	$this->add_control(
944	'category_hover_color',
945	[
946	'label' => esc_html__('Color', 'ultimate-post-kit'),
947	'type' => Controls_Manager::COLOR,
948	'selectors' => [
949	'{{WRAPPER}} .upk-alter-carousel .upk-category a:hover' => 'color: {{VALUE}};',
950	],
951	]
952	);
953
954	$this->add_group_control(
955	Group_Control_Background::get_type(),
956	[
957	'name' => 'category_hover_background',
958	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-category a:hover',
959	]
960	);
961
962	$this->add_control(
963	'category_hover_border_color',
964	[
965	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
966	'type' => Controls_Manager::COLOR,
967	'condition' => [
968	'category_border_border!' => '',
969	],
970	'selectors' => [
971	'{{WRAPPER}} .upk-alter-carousel .upk-category a:hover' => 'border-color: {{VALUE}};',
972	],
973	]
974	);
975
976	$this->end_controls_tab();
977
978	$this->end_controls_tabs();
979
980	$this->end_controls_section();
981
982	$this->start_controls_section(
983	'section_style_post_format',
984	[
985	'label' => esc_html__('Post Format', 'ultimate-post-kit'),
986	'tab' => Controls_Manager::TAB_STYLE,
987	'condition' => [
988	'show_post_format' => 'yes',
989	],
990	]
991	);
992
993	$this->start_controls_tabs('tabs_post_format_style');
994
995	$this->start_controls_tab(
996	'tab_post_format_normal',
997	[
998	'label' => esc_html__('Normal', 'ultimate-post-kit'),
999	]
1000	);
1001
1002	$this->add_control(
1003	'post_format_color',
1004	[
1005	'label' => esc_html__('Color', 'ultimate-post-kit'),
1006	'type' => Controls_Manager::COLOR,
1007	'selectors' => [
1008	'{{WRAPPER}} .upk-alter-carousel .upk-post-format a' => 'color: {{VALUE}};',
1009	],
1010	]
1011	);
1012
1013	$this->add_group_control(
1014	Group_Control_Background::get_type(),
1015	[
1016	'name' => 'post_format_background',
1017	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-post-format a',
1018	]
1019	);
1020
1021	$this->add_group_control(
1022	Group_Control_Border::get_type(),
1023	[
1024	'name' => 'post_format_border',
1025	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-post-format a',
1026	]
1027	);
1028
1029	$this->add_responsive_control(
1030	'post_format_border_radius',
1031	[
1032	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
1033	'type' => Controls_Manager::DIMENSIONS,
1034	'size_units' => ['px', '%'],
1035	'selectors' => [
1036	'{{WRAPPER}} .upk-alter-carousel .upk-post-format a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1037	],
1038	]
1039	);
1040
1041	$this->add_responsive_control(
1042	'post_format_padding',
1043	[
1044	'label' => esc_html__('Padding', 'ultimate-post-kit'),
1045	'type' => Controls_Manager::DIMENSIONS,
1046	'size_units' => ['px', 'em', '%'],
1047	'selectors' => [
1048	'{{WRAPPER}} .upk-alter-carousel .upk-post-format a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1049	],
1050	]
1051	);
1052
1053	$this->add_responsive_control(
1054	'post_format_margin',
1055	[
1056	'label' => esc_html__('Margin', 'ultimate-post-kit'),
1057	'type' => Controls_Manager::DIMENSIONS,
1058	'size_units' => ['px', 'em', '%'],
1059	'selectors' => [
1060	'{{WRAPPER}} .upk-alter-carousel .upk-post-format a' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1061	],
1062	]
1063	);
1064
1065	$this->add_group_control(
1066	Group_Control_Box_Shadow::get_type(),
1067	[
1068	'name' => 'post_format_shadow',
1069	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-post-format a',
1070	]
1071	);
1072
1073	$this->add_group_control(
1074	Group_Control_Typography::get_type(),
1075	[
1076	'name' => 'post_format_typography',
1077	'label' => esc_html__('Typography', 'ultimate-post-kit'),
1078	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-post-format a',
1079	]
1080	);
1081
1082	$this->end_controls_tab();
1083
1084	$this->start_controls_tab(
1085	'tab_post_format_hover',
1086	[
1087	'label' => esc_html__('Hover', 'ultimate-post-kit'),
1088	]
1089	);
1090
1091	$this->add_control(
1092	'post_format_hover_color',
1093	[
1094	'label' => esc_html__('Color', 'ultimate-post-kit'),
1095	'type' => Controls_Manager::COLOR,
1096	'selectors' => [
1097	'{{WRAPPER}} .upk-alter-carousel .upk-post-format a:hover' => 'color: {{VALUE}};',
1098	],
1099	]
1100	);
1101
1102	$this->add_group_control(
1103	Group_Control_Background::get_type(),
1104	[
1105	'name' => 'post_format_hover_background',
1106	'selector' => '{{WRAPPER}} .upk-alter-carousel .upk-post-format a:hover',
1107	]
1108	);
1109
1110	$this->add_control(
1111	'post_format_hover_border_color',
1112	[
1113	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
1114	'type' => Controls_Manager::COLOR,
1115	'condition' => [
1116	'post_format_border_border!' => '',
1117	],
1118	'selectors' => [
1119	'{{WRAPPER}} .upk-alter-carousel .upk-post-format a:hover' => 'border-color: {{VALUE}};',
1120	],
1121	]
1122	);
1123
1124	$this->end_controls_tab();
1125
1126	$this->end_controls_tabs();
1127
1128	$this->end_controls_section();
1129
1130	//Navigation Global Controls
1131	$this->register_navigation_style('swiper');
1132	}
1133
1134	/**
1135	* Main query render for this widget
1136	* @param $posts_per_page number item query limit
1137	*/
1138	public function query_posts($posts_per_page)
1139	{
1140
1141	$default = $this->getGroupControlQueryArgs();
1142	$args = [];
1143	if ($posts_per_page) {
1144	$args['posts_per_page'] = $posts_per_page;
1145	// $args['paged'] = max(1, get_query_var('paged'), get_query_var('page'));
1146	}
1147	$args = array_merge($default, $args);
1148	$this->_query = new WP_Query($args);
1149	}
1150
1151	public function render_header()
1152	{
1153	//Global Function
1154	$this->render_header_attribute('alter');
1155
1156	?>
1157	<div <?php $this->print_render_attribute_string('carousel'); ?>>
1158	<div class="upk-post-grid">
1159	<div <?php $this->print_render_attribute_string('swiper'); ?>>
1160	<div class="swiper-wrapper">
1161	<?php
1162	}
1163
1164	public function render_post_grid_item($post_id, $image_size, $excerpt_length)
1165	{
1166	$settings = $this->get_settings_for_display();
1167
1168	if ('yes' == $settings['global_link']) {
1169
1170	$this->add_render_attribute('grid-item', 'onclick', "window.open('" . esc_url(get_permalink()) . "', '_self')", true);
1171	}
1172	$this->add_render_attribute('grid-item', 'class', 'upk-item swiper-slide', true);
1173
1174	?>
1175	<div <?php $this->print_render_attribute_string('grid-item'); ?>>
1176	<div class="upk-item-box">
1177	<div class="upk-img-wrap">
1178	<div class="upk-main-img">
1179	<?php $this->render_image(get_post_thumbnail_id($post_id), $image_size); ?>
1180	<?php
1181	if (_is_upk_pro_activated()) {
1182	if ($settings['readmore_type'] == 'on_image') {
1183	apply_filters('alter_render_readmore_on_image', '');
1184	}
1185	}
1186	?>
1187	<?php $this->render_post_format(); ?>
1188	</div>
1189	</div>
1190
1191	<div class="upk-content">
1192	<div>
1193	<?php $this->render_category(); ?>
1194	<?php $this->render_title(substr($this->get_name(), 4)); ?>
1195
1196	<div class="upk-text-wrap">
1197	<?php $this->render_excerpt($excerpt_length); ?>
1198	<?php
1199	if (_is_upk_pro_activated()) {
1200	if ($settings['readmore_type'] == 'classic') {
1201	apply_filters('alter_render_readmore', $this);
1202	}
1203	}
1204	?>
1205	</div>
1206
1207	<?php if ($settings['show_author'] or $settings['show_date'] or $settings['show_reading_time']) : ?>
1208	<div class="upk-meta">
1209	<?php if ($settings['show_author']) : ?>
1210	<div class="upk-blog-author" data-separator="<?php echo esc_html($settings['meta_separator']); ?>">
1211	<a
1212	class="author-name"
1213	href="<?php echo esc_url( get_author_posts_url(get_the_author_meta('ID')) ); ?>"
1214	aria-label="<?php echo esc_attr( 'View all posts by ' . get_the_author() ); ?>"
1215	>
1216	<?php echo esc_html( get_the_author() ) ?>
1217	</a>
1218	</div>
1219	<?php endif; ?>
1220	<?php if ('yes' === $settings['show_date']) : ?>
1221	<div data-separator="<?php echo esc_html($settings['meta_separator']); ?>">
1222	<?php $this->render_date(); ?>
1223	</div>
1224	<?php endif; ?>
1225
1226	<?php if (_is_upk_pro_activated()) :
1227	if ('yes' === $settings['show_reading_time']) : ?>
1228	<div class="upk-reading-time" data-separator="<?php echo esc_html($settings['meta_separator']); ?>">
1229	<?php echo esc_html( ultimate_post_kit_reading_time( get_the_content(), $settings['avg_reading_speed'], $settings['hide_seconds'] ?? 'no', $settings['hide_minutes'] ?? 'no' ) ); ?>
1230	</div>
1231	<?php endif; ?>
1232	<?php endif; ?>
1233	</div>
1234	<?php endif; ?>
1235
1236	</div>
1237	</div>
1238	</div>
1239	</div>
1240	<?php
1241	}
1242
1243	public function render()
1244	{
1245	$settings = $this->get_settings_for_display();
1246
1247	$this->query_posts($settings['item_limit']['size']);
1248	$wp_query = $this->get_query();
1249
1250	if (!$wp_query->found_posts) {
1251	return;
1252	}
1253
1254	$this->render_header();
1255
1256	while ($wp_query->have_posts()) {
1257	$wp_query->the_post();
1258	$thumbnail_size = $settings['primary_thumbnail_size'];
1259
1260	$this->render_post_grid_item(get_the_ID(), $thumbnail_size, $settings['excerpt_length']);
1261	}
1262
1263	$this->render_footer();
1264
1265	wp_reset_postdata();
1266	}
1267	}
1268