ultimate-post-kit / modules / snog-slider / widgets / snog-slider.php

snog-slider.php in Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets 4.1.2, at modules/snog-slider/widgets/snog-slider.php

1,621 lines 41.6 KB

Raw Download Zip

1	<?php
2
3	namespace UltimatePostKit\Modules\SnogSlider\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_Text_Stroke;
11	use Elementor\Group_Control_Image_Size;
12	use Elementor\Group_Control_Background;
13	use Elementor\Plugin;
14
15	use UltimatePostKit\Utils;
16	use UltimatePostKit\Traits\Global_Widget_Controls;
17	use UltimatePostKit\Traits\Global_Widget_Functions;
18	use UltimatePostKit\Includes\Controls\GroupQuery\Group_Control_Query;
19	use UltimatePostKit\Modules\QueryControl\Controls\Group_Control_Posts;
20	use WP_Query;
21
22	if (!defined('ABSPATH')) exit; // Exit if accessed directly
23
24	class Snog_Slider extends Group_Control_Query {
25
26	use Global_Widget_Controls;
27	use Global_Widget_Functions;
28
29	private $_query = null;
30
31	public function get_name() {
32	return 'upk-snog-slider';
33	}
34
35	public function get_title() {
36	return BDTUPK . esc_html__('Snog Slider', 'ultimate-post-kit');
37	}
38
39	public function get_icon() {
40	return 'upk-widget-icon upk-icon-snog-slider';
41	}
42
43	public function get_categories() {
44	return ['ultimate-post-kit'];
45	}
46
47	public function get_keywords() {
48	return ['post', 'carousel', 'blog', 'recent', 'news', 'slider', 'snog'];
49	}
50
51	public function get_style_depends() {
52	if ($this->upk_is_edit_mode()) {
53	return ['swiper', 'upk-all-styles'];
54	} else {
55	return ['swiper', 'upk-font', 'upk-snog-slider'];
56	}
57	}
58
59	public function get_script_depends() {
60	if ($this->upk_is_edit_mode()) {
61	return ['swiper', 'upk-all-scripts'];
62	} else {
63	return ['swiper', 'upk-snog-slider'];
64	}
65	}
66
67	public function get_custom_help_url() {
68	return 'https://youtu.be/UKZIEgYg0gs?si=exkIDYa-j2c7E34t';
69	}
70
71
72	public function get_query() {
73	return $this->_query;
74	}
75
76	public function has_widget_inner_wrapper(): bool {
77	return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
78	}
79
80
81	protected function register_controls() {
82	$this->start_controls_section(
83	'section_content_layout',
84	[
85	'label' => esc_html__('Layout', 'ultimate-post-kit'),
86	]
87	);
88
89	$this->add_responsive_control(
90	'item_height',
91	[
92	'label' => esc_html__('Height', 'ultimate-post-kit'),
93	'type' => Controls_Manager::SLIDER,
94	'size_units' => [ 'px', '%', 'vh' ],
95	'range' => [
96	'px' => [
97	'min' => 200,
98	'max' => 1080,
99	],
100	'%' => [
101	'min' => 10,
102	'max' => 100,
103	],
104	'vh' => [
105	'min' => 10,
106	'max' => 100,
107	],
108	],
109	'selectors' => [
110	'{{WRAPPER}} .upk-snog-slider-wrap .upk-main-slider, {{WRAPPER}} .upk-snog-slider-wrap .upk-snog-thumbs' => 'height: {{SIZE}}{{UNIT}};',
111	],
112	]
113	);
114
115	$this->add_responsive_control(
116	'content_width',
117	[
118	'label' => esc_html__('Content Width', 'ultimate-post-kit'),
119	'type' => Controls_Manager::SLIDER,
120	'size_units' => [ 'px', '%' ],
121	'range' => [
122	'px' => [
123	'min' => 200,
124	'max' => 1200,
125	],
126	'%' => [
127	'min' => 10,
128	'max' => 100,
129	],
130	],
131	'selectors' => [
132	'{{WRAPPER}} .upk-snog-slider-wrap .upk-content-slider' => 'width: {{SIZE}}{{UNIT}}; min-width: {{SIZE}}{{UNIT}};',
133	],
134	]
135	);
136
137	$this->add_responsive_control(
138	'content_alignment',
139	[
140	'label' => __( 'Alignment', 'ultimate-post-kit' ),
141	'type' => Controls_Manager::CHOOSE,
142	'options' => [
143	'left' => [
144	'title' => __( 'Left', 'ultimate-post-kit' ),
145	'icon' => 'eicon-h-align-left',
146	],
147	'center' => [
148	'title' => __( 'Center', 'ultimate-post-kit' ),
149	'icon' => 'eicon-h-align-center',
150	],
151	'right' => [
152	'title' => __( 'Right', 'ultimate-post-kit' ),
153	'icon' => 'eicon-h-align-right',
154	],
155	],
156	'selectors' => [
157	'{{WRAPPER}} .upk-snog-slider-wrap .upk-content-wrap' => 'text-align: {{VALUE}};',
158	],
159	]
160	);
161
162	$this->add_group_control(
163	Group_Control_Image_Size::get_type(),
164	[
165	'name' => 'primary_thumbnail',
166	'exclude' => ['custom'],
167	'default' => 'full',
168	]
169	);
170
171	$this->add_control(
172	'hr_1',
173	[
174	'type' => Controls_Manager::DIVIDER,
175	]
176	);
177
178	//Global Title Controls
179	$this->register_title_controls();
180
181	$this->add_control(
182	'show_category',
183	[
184	'label' => esc_html__('Show Category', 'ultimate-post-kit'),
185	'type' => Controls_Manager::SWITCHER,
186	'default' => 'yes',
187	]
188	);
189
190	$this->add_control(
191	'show_excerpt',
192	[
193	'label' => esc_html__( 'Show Text', 'ultimate-post-kit' ),
194	'type' => Controls_Manager::SWITCHER,
195	// 'default' => 'yes',
196	]
197	);
198
199	$this->add_control(
200	'excerpt_length',
201	[
202	'label' => esc_html__( 'Text Limit', 'ultimate-post-kit' ),
203	'description' => esc_html__( 'It\'s just work for main content, but not working with excerpt. If you set 0 so you will get full main content.', 'ultimate-post-kit' ),
204	'type' => Controls_Manager::NUMBER,
205	'default' => 15,
206	'condition' => [
207	'show_excerpt' => 'yes'
208	],
209	]
210	);
211
212	$this->add_control(
213	'strip_shortcode',
214	[
215	'label' => esc_html__( 'Strip Shortcode', 'ultimate-post-kit' ),
216	'type' => Controls_Manager::SWITCHER,
217	'default' => 'yes',
218	'condition' => [
219	'show_excerpt' => 'yes',
220	],
221	]
222	);
223
224	$this->add_control(
225	'show_author',
226	[
227	'label' => esc_html__( 'Show Author', 'ultimate-post-kit' ),
228	'type' => Controls_Manager::SWITCHER,
229	'default' => 'yes',
230	'separator' => 'before'
231	]
232	);
233
234	$this->add_control(
235	'meta_separator',
236	[
237	'label' => __( 'Separator', 'ultimate-post-kit' ),
238	'type' => Controls_Manager::TEXT,
239	'default' => '//',
240	'label_block' => false,
241	]
242	);
243
244	$this->add_control(
245	'show_readmore',
246	[
247	'label' => esc_html__('Show Read more', 'ultimate-post-kit'),
248	'type' => Controls_Manager::SWITCHER,
249	'default' => 'yes',
250	'separator' => 'before'
251	]
252	);
253
254	$this->add_control(
255	'readmore_text',
256	[
257	'label' => __( 'Read More Text', 'ultimate-post-kit' ),
258	'type' => Controls_Manager::TEXT,
259	'dynamic' => [ 'active' => true ],
260	'default' => esc_html__('Explore', 'ultimate-post-kit'),
261	'label_block' => false,
262	'condition' => [
263	'show_readmore' => 'yes'
264	]
265	]
266	);
267
268	//Global Date Controls
269	$this->register_date_controls();
270
271	//Global Reading Time Controls
272	$this->register_reading_time_controls();
273
274	$this->add_control(
275	'show_navigation',
276	[
277	'label' => esc_html__('Show Navigation Arrows', 'ultimate-post-kit'),
278	'type' => Controls_Manager::SWITCHER,
279	'default' => 'yes',
280	'separator' => 'before'
281	]
282	);
283
284	$this->add_control(
285	'show_pagination',
286	[
287	'label' => esc_html__('Show Pagination', 'ultimate-post-kit'),
288	'type' => Controls_Manager::SWITCHER,
289	'default' => 'yes',
290	]
291	);
292
293
294	$this->end_controls_section();
295
296	// Query Settings
297	$this->start_controls_section(
298	'section_post_query_builder',
299	[
300	'label' => __( 'Query', 'ultimate-post-kit' ),
301	'tab' => Controls_Manager::TAB_CONTENT,
302	]
303	);
304
305	$this->add_control(
306	'item_limit',
307	[
308	'label' => esc_html__('Item Limit', 'ultimate-post-kit'),
309	'type' => Controls_Manager::SLIDER,
310	'range' => [
311	'px' => [
312	'min' => 1,
313	'max' => 20,
314	],
315	],
316	'default' => [
317	'size' => 5,
318	],
319	]
320	);
321
322	$this->register_query_builder_controls();
323
324	$this->end_controls_section();
325
326	$this->start_controls_section(
327	'section_carousel_settings',
328	[
329	'label' => __( 'Slider Settings', 'ultimate-post-kit' ),
330	]
331	);
332
333	$this->add_control(
334	'autoplay',
335	[
336	'label' => __( 'Autoplay', 'ultimate-post-kit' ),
337	'type' => Controls_Manager::SWITCHER,
338	'default' => 'yes',
339
340	]
341	);
342
343	$this->add_control(
344	'autoplay_speed',
345	[
346	'label' => esc_html__( 'Autoplay Speed', 'ultimate-post-kit' ),
347	'type' => Controls_Manager::NUMBER,
348	'default' => 5000,
349	'condition' => [
350	'autoplay' => 'yes',
351	],
352	]
353	);
354
355	$this->add_control(
356	'pauseonhover',
357	[
358	'label' => esc_html__( 'Pause on Hover', 'ultimate-post-kit' ),
359	'type' => Controls_Manager::SWITCHER,
360	]
361	);
362
363	$this->add_control(
364	'grab_cursor',
365	[
366	'label' => __( 'Grab Cursor', 'ultimate-post-kit' ),
367	'type' => Controls_Manager::SWITCHER,
368	]
369	);
370
371	$this->add_control(
372	'loop',
373	[
374	'label' => __( 'Loop', 'ultimate-post-kit' ),
375	'type' => Controls_Manager::SWITCHER,
376	'default' => 'yes',
377
378	]
379	);
380
381
382	$this->add_control(
383	'speed',
384	[
385	'label' => __( 'Animation Speed (ms)', 'ultimate-post-kit' ),
386	'type' => Controls_Manager::SLIDER,
387	'default' => [
388	'size' => 800,
389	],
390	'range' => [
391	'px' => [
392	'min' => 100,
393	'max' => 5000,
394	'step' => 50,
395	],
396	],
397	]
398	);
399
400	$this->add_control(
401	'observer',
402	[
403	'label' => __( 'Observer', 'ultimate-post-kit' ),
404	'description' => __( 'When you use carousel in any hidden place (in tabs, accordion etc) keep it yes.', 'ultimate-post-kit' ),
405	'type' => Controls_Manager::SWITCHER,
406	]
407	);
408
409	$this->end_controls_section();
410
411	//Style
412	$this->start_controls_section(
413	'section_style_content',
414	[
415	'label' => esc_html__('Items', 'ultimate-post-kit'),
416	'tab' => Controls_Manager::TAB_STYLE,
417	]
418	);
419
420	$this->add_control(
421	'overlay_type',
422	[
423	'label' => esc_html__('Overlay', 'ultimate-post-kit'),
424	'type' => Controls_Manager::SELECT,
425	'default' => 'background',
426	'options' => [
427	'none' => esc_html__('None', 'ultimate-post-kit'),
428	'background' => esc_html__('Background', 'ultimate-post-kit'),
429	'blend' => esc_html__('Blend', 'ultimate-post-kit'),
430	],
431	]
432	);
433
434	$this->add_control(
435	'overlay_color',
436	[
437	'label' => esc_html__('Overlay Color', 'ultimate-post-kit'),
438	'type' => Controls_Manager::COLOR,
439	'selectors' => [
440	'{{WRAPPER}} .upk-snog-slider-wrap .upk-main-slider .upk-image-wrap::before' => 'background-image: linear-gradient(54deg, {{VALUE}}, transparent);',
441	],
442	'condition' => [
443	'overlay_type' => ['background', 'blend'],
444	],
445	]
446	);
447
448	$this->add_control(
449	'blend_type',
450	[
451	'label' => esc_html__('Blend Type', 'ultimate-post-kit'),
452	'type' => Controls_Manager::SELECT,
453	'default' => 'multiply',
454	'options' => ultimate_post_kit_blend_options(),
455	'condition' => [
456	'overlay_type' => 'blend',
457	],
458	'selectors' => [
459	'{{WRAPPER}} .upk-snog-slider-wrap .upk-main-slider .upk-image-wrap::before' => 'mix-blend-mode: {{VALUE}};'
460	],
461	]
462	);
463
464
465	$this->add_group_control(
466	Group_Control_Background::get_type(),
467	[
468	'name' => 'content_background',
469	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-content-wrap',
470	]
471	);
472
473	$this->add_group_control(
474	Group_Control_Border::get_type(),
475	[
476	'name' => 'content_border',
477	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-content-wrap',
478	]
479	);
480
481	$this->add_responsive_control(
482	'content_border_radius',
483	[
484	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
485	'type' => Controls_Manager::DIMENSIONS,
486	'size_units' => ['px', '%'],
487	'selectors' => [
488	'{{WRAPPER}} .upk-snog-slider-wrap .upk-content-wrap' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
489	],
490	]
491	);
492
493	$this->add_responsive_control(
494	'content_padding',
495	[
496	'label' => __('Content Padding', 'ultimate-post-kit'),
497	'type' => Controls_Manager::DIMENSIONS,
498	'size_units' => ['px', 'em', '%'],
499	'selectors' => [
500	'{{WRAPPER}} .upk-snog-slider-wrap .upk-inner-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
501	],
502	]
503	);
504
505	$this->end_controls_section();
506
507	$this->start_controls_section(
508	'section_style_title',
509	[
510	'label' => esc_html__('Title', 'ultimate-post-kit'),
511	'tab' => Controls_Manager::TAB_STYLE,
512	'condition' => [
513	'show_title' => 'yes',
514	],
515	]
516	);
517
518	$this->add_control(
519	'title_style',
520	[
521	'label' => esc_html__('Style', 'ultimate-post-kit'),
522	'type' => Controls_Manager::SELECT,
523	'default' => 'default',
524	'options' => [
525	'default' => esc_html__('Default', 'ultimate-post-kit'),
526	'underline' => esc_html__('Underline', 'ultimate-post-kit'),
527	'middle-underline' => esc_html__('Middle Underline', 'ultimate-post-kit'),
528	'overline' => esc_html__('Overline', 'ultimate-post-kit'),
529	'middle-overline' => esc_html__('Middle Overline', 'ultimate-post-kit'),
530	],
531	]
532	);
533
534	$this->add_control(
535	'title_color',
536	[
537	'label' => esc_html__('Color', 'ultimate-post-kit'),
538	'type' => Controls_Manager::COLOR,
539	'selectors' => [
540	'{{WRAPPER}} .upk-snog-slider-wrap .upk-title a' => 'color: {{VALUE}};',
541	],
542	]
543	);
544
545	$this->add_control(
546	'title_hover_color',
547	[
548	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
549	'type' => Controls_Manager::COLOR,
550	'selectors' => [
551	'{{WRAPPER}} .upk-snog-slider-wrap .upk-title a:hover' => 'color: {{VALUE}};',
552	],
553	]
554	);
555
556	$this->add_responsive_control(
557	'title_padding',
558	[
559	'label' => __('Padding', 'ultimate-post-kit'),
560	'type' => Controls_Manager::DIMENSIONS,
561	'size_units' => ['px', 'em', '%'],
562	'selectors' => [
563	'{{WRAPPER}} .upk-snog-slider-wrap .upk-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
564	],
565	]
566	);
567
568	$this->add_responsive_control(
569	'title_margin',
570	[
571	'label' => __('Margin', 'ultimate-post-kit'),
572	'type' => Controls_Manager::DIMENSIONS,
573	'size_units' => ['px', 'em', '%'],
574	'selectors' => [
575	'{{WRAPPER}} .upk-snog-slider-wrap .upk-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
576	],
577	]
578	);
579
580	$this->add_group_control(
581	Group_Control_Typography::get_type(),
582	[
583	'name' => 'title_typography',
584	'label' => esc_html__('Typography', 'ultimate-post-kit'),
585	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-title',
586	]
587	);
588
589	$this->add_group_control(
590	Group_Control_Text_Shadow::get_type(),
591	[
592	'name' => 'title_text_shadow',
593	'label' => __('Text Shadow', 'ultimate-post-kit'),
594	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-title a',
595	]
596	);
597
598	$this->add_group_control(
599	Group_Control_Text_Stroke::get_type(),
600	[
601	'name' => 'title_text_stroke',
602	'label' => __('Text Stroke', 'ultimate-post-kit') . BDTUPK_NC,
603	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-title a',
604	]
605	);
606
607	$this->end_controls_section();
608
609	$this->start_controls_section(
610	'section_style_text',
611	[
612	'label' => esc_html__('Text', 'ultimate-post-kit'),
613	'tab' => Controls_Manager::TAB_STYLE,
614	'condition' => [
615	'show_excerpt' => 'yes',
616	],
617	]
618	);
619
620	$this->add_control(
621	'text_color',
622	[
623	'label' => esc_html__('Color', 'ultimate-post-kit'),
624	'type' => Controls_Manager::COLOR,
625	'selectors' => [
626	'{{WRAPPER}} .upk-snog-slider-wrap .upk-text' => 'color: {{VALUE}};',
627	],
628	]
629	);
630
631	$this->add_responsive_control(
632	'text_margin',
633	[
634	'label' => __('Margin', 'ultimate-post-kit'),
635	'type' => Controls_Manager::DIMENSIONS,
636	'size_units' => ['px', 'em', '%'],
637	'selectors' => [
638	'{{WRAPPER}} .upk-snog-slider-wrap .upk-text' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
639	]
640	]
641	);
642
643	$this->add_group_control(
644	Group_Control_Typography::get_type(),
645	[
646	'name' => 'text_typography',
647	'label' => esc_html__('Typography', 'ultimate-post-kit'),
648	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-text',
649	]
650	);
651
652	$this->end_controls_section();
653
654	$this->start_controls_section(
655	'section_style_meta',
656	[
657	'label' => esc_html__( 'Meta', 'ultimate-post-kit' ),
658	'tab' => Controls_Manager::TAB_STYLE,
659	'conditions' => [
660	'relation' => 'or',
661	'terms' => [
662	[
663	'name' => 'show_author',
664	'value' => 'yes'
665	],
666	[
667	'name' => 'show_date',
668	'value' => 'yes'
669	],
670	]
671	],
672	]
673	);
674
675	$this->add_control(
676	'meta_color',
677	[
678	'label' => esc_html__( 'Color', 'ultimate-post-kit' ),
679	'type' => Controls_Manager::COLOR,
680	'selectors' => [
681	'{{WRAPPER}} .upk-snog-slider-wrap .upk-meta, {{WRAPPER}} .upk-snog-slider-wrap .upk-meta .upk-author .upk-name' => 'color: {{VALUE}};',
682	],
683	]
684	);
685
686	$this->add_control(
687	'meta_hover_color',
688	[
689	'label' => esc_html__( 'Hover Color', 'ultimate-post-kit' ),
690	'type' => Controls_Manager::COLOR,
691	'selectors' => [
692	'{{WRAPPER}} .upk-snog-slider-wrap .upk-meta .upk-author .upk-name:hover' => 'color: {{VALUE}};',
693	],
694	]
695	);
696
697	$this->add_responsive_control(
698	'meta_spacing',
699	[
700	'label' => esc_html__('Space Between', 'ultimate-post-kit'),
701	'type' => Controls_Manager::SLIDER,
702	'range' => [
703	'px' => [
704	'min' => 0,
705	'max' => 50,
706	],
707	],
708	'selectors' => [
709	'{{WRAPPER}} .upk-snog-slider-wrap .upk-meta > div:before' => 'margin: 0 {{SIZE}}{{UNIT}};',
710	],
711	]
712	);
713
714	$this->add_responsive_control(
715	'meta_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-snog-slider .upk-meta' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
722	],
723	]
724	);
725
726	$this->add_group_control(
727	Group_Control_Typography::get_type(),
728	[
729	'name' => 'meta_typography',
730	'label' => esc_html__( 'Typography', 'ultimate-post-kit' ),
731	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-meta',
732	]
733	);
734
735	$this->end_controls_section();
736
737	$this->start_controls_section(
738	'section_style_category',
739	[
740	'label' => esc_html__('Category', 'ultimate-post-kit'),
741	'tab' => Controls_Manager::TAB_STYLE,
742	'condition' => [
743	'show_category' => 'yes'
744	],
745	]
746	);
747
748	$this->add_responsive_control(
749	'category_bottom_spacing',
750	[
751	'label' => esc_html__('Spacing', 'ultimate-post-kit'),
752	'type' => Controls_Manager::SLIDER,
753	'range' => [
754	'px' => [
755	'min' => 0,
756	'max' => 50,
757	],
758	],
759	'selectors' => [
760	'{{WRAPPER}} .upk-snog-slider-wrap .upk-category' => 'margin-bottom: {{SIZE}}{{UNIT}};',
761	],
762	]
763	);
764
765	$this->start_controls_tabs('tabs_category_style');
766
767	$this->start_controls_tab(
768	'tab_category_normal',
769	[
770	'label' => esc_html__('Normal', 'ultimate-post-kit'),
771	]
772	);
773
774	$this->add_control(
775	'category_color',
776	[
777	'label' => esc_html__('Color', 'ultimate-post-kit'),
778	'type' => Controls_Manager::COLOR,
779	'selectors' => [
780	'{{WRAPPER}} .upk-snog-slider-wrap .upk-category a' => 'color: {{VALUE}};',
781	],
782	]
783	);
784
785	$this->add_group_control(
786	Group_Control_Background::get_type(),
787	[
788	'name' => 'category_background',
789	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-category a',
790	]
791	);
792
793	$this->add_group_control(
794	Group_Control_Border::get_type(),
795	[
796	'name' => 'category_border',
797	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-category a',
798	]
799	);
800
801	$this->add_responsive_control(
802	'category_border_radius',
803	[
804	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
805	'type' => Controls_Manager::DIMENSIONS,
806	'size_units' => ['px', '%'],
807	'selectors' => [
808	'{{WRAPPER}} .upk-snog-slider-wrap .upk-category a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
809	],
810	]
811	);
812
813	$this->add_responsive_control(
814	'category_padding',
815	[
816	'label' => esc_html__('Padding', 'ultimate-post-kit'),
817	'type' => Controls_Manager::DIMENSIONS,
818	'size_units' => ['px', 'em', '%'],
819	'selectors' => [
820	'{{WRAPPER}} .upk-snog-slider-wrap .upk-category a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
821	],
822	]
823	);
824
825	$this->add_responsive_control(
826	'category_spacing',
827	[
828	'label' => esc_html__('Space Between', 'ultimate-post-kit'),
829	'type' => Controls_Manager::SLIDER,
830	'range' => [
831	'px' => [
832	'min' => 0,
833	'max' => 50,
834	],
835	],
836	'selectors' => [
837	'{{WRAPPER}} .upk-snog-slider-wrap .upk-category a+a' => 'margin-left: {{SIZE}}{{UNIT}};',
838	],
839	]
840	);
841
842	$this->add_group_control(
843	Group_Control_Box_Shadow::get_type(),
844	[
845	'name' => 'category_shadow',
846	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-category a',
847	]
848	);
849
850	$this->add_group_control(
851	Group_Control_Typography::get_type(),
852	[
853	'name' => 'category_typography',
854	'label' => esc_html__('Typography', 'ultimate-post-kit'),
855	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-category a',
856	]
857	);
858
859	$this->end_controls_tab();
860
861	$this->start_controls_tab(
862	'tab_category_hover',
863	[
864	'label' => esc_html__('Hover', 'ultimate-post-kit'),
865	'condition' => [
866	'show_category' => 'yes'
867	]
868	]
869	);
870
871	$this->add_control(
872	'category_hover_color',
873	[
874	'label' => esc_html__('Color', 'ultimate-post-kit'),
875	'type' => Controls_Manager::COLOR,
876	'selectors' => [
877	'{{WRAPPER}} .upk-snog-slider-wrap .upk-category a:hover' => 'color: {{VALUE}};',
878	],
879	]
880	);
881
882	$this->add_group_control(
883	Group_Control_Background::get_type(),
884	[
885	'name' => 'category_hover_background',
886	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-category a:hover',
887	]
888	);
889
890	$this->add_control(
891	'category_hover_border_color',
892	[
893	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
894	'type' => Controls_Manager::COLOR,
895	'condition' => [
896	'category_border_border!' => '',
897	],
898	'selectors' => [
899	'{{WRAPPER}} .upk-snog-slider-wrap .upk-category a:hover' => 'border-color: {{VALUE}};',
900	],
901	]
902	);
903
904	$this->end_controls_tab();
905
906	$this->end_controls_tabs();
907
908	$this->end_controls_section();
909
910
911	$this->start_controls_section(
912	'section_style_link_btn',
913	[
914	'label' => esc_html__('Read More', 'ultimate-post-kit'),
915	'tab' => Controls_Manager::TAB_STYLE,
916	]
917	);
918
919	$this->start_controls_tabs('tabs_link_btn_style');
920
921	$this->start_controls_tab(
922	'tab_link_btn_normal',
923	[
924	'label' => esc_html__('Normal', 'ultimate-post-kit'),
925	]
926	);
927
928	$this->add_control(
929	'link_btn_color',
930	[
931	'label' => esc_html__('Color', 'ultimate-post-kit'),
932	'type' => Controls_Manager::COLOR,
933	'selectors' => [
934	'{{WRAPPER}} .upk-snog-slider-wrap .upk-link-btn a' => 'color: {{VALUE}};',
935	],
936	]
937	);
938
939	$this->add_group_control(
940	Group_Control_Background::get_type(),
941	[
942	'name' => 'link_btn_background',
943	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-link-btn a',
944	]
945	);
946
947	$this->add_group_control(
948	Group_Control_Border::get_type(),
949	[
950	'name' => 'link_btn_border',
951	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-link-btn a',
952	]
953	);
954
955	$this->add_responsive_control(
956	'link_btn_border_radius',
957	[
958	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
959	'type' => Controls_Manager::DIMENSIONS,
960	'size_units' => ['px', '%'],
961	'selectors' => [
962	'{{WRAPPER}} .upk-snog-slider-wrap .upk-link-btn a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
963	],
964	]
965	);
966
967	$this->add_responsive_control(
968	'link_btn_padding',
969	[
970	'label' => esc_html__('Padding', 'ultimate-post-kit'),
971	'type' => Controls_Manager::DIMENSIONS,
972	'size_units' => ['px', 'em', '%'],
973	'selectors' => [
974	'{{WRAPPER}} .upk-snog-slider-wrap .upk-link-btn a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
975	],
976	]
977	);
978
979
980	$this->add_group_control(
981	Group_Control_Box_Shadow::get_type(),
982	[
983	'name' => 'link_btn_shadow',
984	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-link-btn a',
985	]
986	);
987
988	$this->add_group_control(
989	Group_Control_Typography::get_type(),
990	[
991	'name' => 'link_btn_typography',
992	'label' => esc_html__('Typography', 'ultimate-post-kit'),
993	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-link-btn a',
994	]
995	);
996
997	$this->end_controls_tab();
998
999	$this->start_controls_tab(
1000	'tab_link_btn_hover',
1001	[
1002	'label' => esc_html__('Hover', 'ultimate-post-kit'),
1003	]
1004	);
1005
1006	$this->add_control(
1007	'link_btn_hover_color',
1008	[
1009	'label' => esc_html__('Color', 'ultimate-post-kit'),
1010	'type' => Controls_Manager::COLOR,
1011	'selectors' => [
1012	'{{WRAPPER}} .upk-snog-slider-wrap .upk-link-btn a:hover' => 'color: {{VALUE}};',
1013	],
1014	]
1015	);
1016
1017	$this->add_group_control(
1018	Group_Control_Background::get_type(),
1019	[
1020	'name' => 'link_btn_hover_background',
1021	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-link-btn a:hover',
1022	]
1023	);
1024
1025	$this->add_control(
1026	'link_btn_hover_border_color',
1027	[
1028	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
1029	'type' => Controls_Manager::COLOR,
1030	'selectors' => [
1031	'{{WRAPPER}} .upk-snog-slider-wrap .upk-link-btn a:hover' => 'border-color: {{VALUE}};',
1032	],
1033	]
1034	);
1035
1036	$this->end_controls_tab();
1037
1038	$this->end_controls_tabs();
1039
1040	$this->add_control(
1041	'link_btn_line_heading',
1042	[
1043	'label' => esc_html__( 'LINE', 'ultimate-post-kit' ),
1044	'type' => Controls_Manager::HEADING,
1045	'separator' => 'before',
1046	]
1047	);
1048
1049	$this->add_control(
1050	'link_btn_line_color',
1051	[
1052	'label' => esc_html__('Color', 'ultimate-post-kit'),
1053	'type' => Controls_Manager::COLOR,
1054	'selectors' => [
1055	'{{WRAPPER}} .upk-snog-slider-wrap .upk-link-btn a::before' => 'background-color: {{VALUE}};',
1056	],
1057	]
1058	);
1059
1060	$this->add_control(
1061	'link_btn_line_hover_color',
1062	[
1063	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
1064	'type' => Controls_Manager::COLOR,
1065	'selectors' => [
1066	'{{WRAPPER}} .upk-snog-slider-wrap .upk-link-btn a:hover::before' => 'background-color: {{VALUE}};',
1067	],
1068	]
1069	);
1070
1071
1072
1073	$this->end_controls_section();
1074
1075
1076	$this->start_controls_section(
1077	'section_style_navigation',
1078	[
1079	'label' => esc_html__('Navigation', 'ultimate-post-kit'),
1080	'tab' => Controls_Manager::TAB_STYLE,
1081	'condition' => [
1082	'show_navigation' => 'yes'
1083	],
1084	]
1085	);
1086
1087	$this->add_control(
1088	'nav_arrows_icon',
1089	[
1090	'label' => esc_html__('Arrows Icon', 'ultimate-post-kit'),
1091	'type' => Controls_Manager::SELECT,
1092	'default' => '0',
1093	'options' => [
1094	'0' => esc_html__('Default', 'ultimate-post-kit'),
1095	'1' => esc_html__('Style 1', 'ultimate-post-kit'),
1096	'2' => esc_html__('Style 2', 'ultimate-post-kit'),
1097	'3' => esc_html__('Style 3', 'ultimate-post-kit'),
1098	'4' => esc_html__('Style 4', 'ultimate-post-kit'),
1099	'5' => esc_html__('Style 5', 'ultimate-post-kit'),
1100	'6' => esc_html__('Style 6', 'ultimate-post-kit'),
1101	'7' => esc_html__('Style 7', 'ultimate-post-kit'),
1102	'8' => esc_html__('Style 8', 'ultimate-post-kit'),
1103	'9' => esc_html__('Style 9', 'ultimate-post-kit'),
1104	'10' => esc_html__('Style 10', 'ultimate-post-kit'),
1105	'11' => esc_html__('Style 11', 'ultimate-post-kit'),
1106	'12' => esc_html__('Style 12', 'ultimate-post-kit'),
1107	'13' => esc_html__('Style 13', 'ultimate-post-kit'),
1108	'14' => esc_html__('Style 14', 'ultimate-post-kit'),
1109	'15' => esc_html__('Style 15', 'ultimate-post-kit'),
1110	'16' => esc_html__('Style 16', 'ultimate-post-kit'),
1111	'17' => esc_html__('Style 17', 'ultimate-post-kit'),
1112	'18' => esc_html__('Style 18', 'ultimate-post-kit'),
1113	'circle-1' => esc_html__('Style 19', 'ultimate-post-kit'),
1114	'circle-2' => esc_html__('Style 20', 'ultimate-post-kit'),
1115	'circle-3' => esc_html__('Style 21', 'ultimate-post-kit'),
1116	'circle-4' => esc_html__('Style 22', 'ultimate-post-kit'),
1117	'square-1' => esc_html__('Style 23', 'ultimate-post-kit'),
1118	],
1119	]
1120	);
1121
1122	$this->start_controls_tabs('tabs_navigation_arrows_style');
1123
1124	$this->start_controls_tab(
1125	'tabs_nav_arrows_normal',
1126	[
1127	'label' => __('Normal', 'ultimate-post-kit'),
1128
1129	]
1130	);
1131
1132	$this->add_control(
1133	'arrows_color',
1134	[
1135	'label' => __('Color', 'ultimate-post-kit'),
1136	'type' => Controls_Manager::COLOR,
1137	'selectors' => [
1138	'{{WRAPPER}} .upk-snog-slider-wrap .upk-nav-btn i' => 'color: {{VALUE}}',
1139	],
1140
1141	]
1142	);
1143
1144	$this->add_group_control(
1145	Group_Control_Background::get_type(),
1146	[
1147	'name' => 'arrows_background',
1148	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-nav-btn',
1149	]
1150	);
1151
1152	$this->add_group_control(
1153	Group_Control_Border::get_type(),
1154	[
1155	'name' => 'nav_arrows_border',
1156	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-nav-btn',
1157
1158	]
1159	);
1160
1161	$this->add_responsive_control(
1162	'border_radius',
1163	[
1164	'label' => __('Border Radius', 'ultimate-post-kit'),
1165	'type' => Controls_Manager::DIMENSIONS,
1166	'size_units' => ['px', '%'],
1167	'selectors' => [
1168	'{{WRAPPER}} .upk-snog-slider-wrap .upk-nav-btn' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1169	],
1170
1171	]
1172	);
1173
1174	$this->add_responsive_control(
1175	'arrows_padding',
1176	[
1177	'label' => esc_html__('Padding', 'ultimate-post-kit'),
1178	'type' => Controls_Manager::DIMENSIONS,
1179	'size_units' => ['px', 'em', '%'],
1180	'selectors' => [
1181	'{{WRAPPER}} .upk-snog-slider-wrap .upk-nav-btn' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1182	],
1183
1184	]
1185	);
1186
1187	$this->add_responsive_control(
1188	'arrows_margin',
1189	[
1190	'label' => esc_html__('Margin', 'ultimate-post-kit'),
1191	'type' => Controls_Manager::DIMENSIONS,
1192	'size_units' => ['px', 'em', '%'],
1193	'selectors' => [
1194	'{{WRAPPER}} .upk-snog-slider-wrap .upk-nav-btn' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1195	],
1196
1197	]
1198	);
1199
1200	$this->add_responsive_control(
1201	'arrows_size',
1202	[
1203	'label' => __('Size', 'ultimate-post-kit'),
1204	'type' => Controls_Manager::SLIDER,
1205	'range' => [
1206	'px' => [
1207	'min' => 10,
1208	'max' => 100,
1209	],
1210	],
1211	'selectors' => [
1212	'{{WRAPPER}} .upk-snog-slider-wrap .upk-nav-btn i' => 'font-size: {{SIZE \|\| 18}}{{UNIT}};',
1213	],
1214	]
1215	);
1216
1217	$this->end_controls_tab();
1218
1219	$this->start_controls_tab(
1220	'tabs_nav_arrows_hover',
1221	[
1222	'label' => __('Hover', 'ultimate-post-kit'),
1223
1224	]
1225	);
1226
1227	$this->add_control(
1228	'arrows_hover_color',
1229	[
1230	'label' => __('Color', 'ultimate-post-kit'),
1231	'type' => Controls_Manager::COLOR,
1232	'selectors' => [
1233	'{{WRAPPER}} .upk-snog-slider-wrap .upk-nav-btn:hover i' => 'color: {{VALUE}}',
1234	],
1235
1236	]
1237	);
1238
1239	$this->add_group_control(
1240	Group_Control_Background::get_type(),
1241	[
1242	'name' => 'arrows_hover_background',
1243	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-nav-btn:hover',
1244	]
1245	);
1246
1247	$this->add_control(
1248	'nav_arrows_hover_border_color',
1249	[
1250	'label' => __('Border Color', 'ultimate-post-kit'),
1251	'type' => Controls_Manager::COLOR,
1252	'selectors' => [
1253	'{{WRAPPER}} .upk-snog-slider-wrap .upk-nav-btn:hover' => 'border-color: {{VALUE}};',
1254	],
1255	'condition' => [
1256	'nav_arrows_border_border!' => ''
1257	]
1258	]
1259	);
1260
1261	$this->end_controls_tab();
1262
1263	$this->end_controls_tabs();
1264
1265	$this->end_controls_section();
1266
1267
1268	// Pagination Css Control
1269
1270	$this->start_controls_section (
1271	'section_style_pagination',
1272	[
1273	'label' => esc_html__('Pagination', 'ultimate-post-kit'),
1274	'tab' => Controls_Manager::TAB_STYLE,
1275	'condition' => [
1276	'show_pagination' => 'yes'
1277	],
1278	]
1279	);
1280
1281	$this->add_control(
1282	'pagination_color',
1283	[
1284	'label' => esc_html__('Color', 'ultimate-post-kit'),
1285	'type' => Controls_Manager::COLOR,
1286	'selectors' => [
1287	'{{WRAPPER}} .upk-snog-slider-wrap .upk-pagination-wrap .swiper-pagination-bullet' => 'color: {{VALUE}};',
1288	'{{WRAPPER}} .upk-snog-slider-wrap .upk-pagination-wrap .swiper-pagination-bullet::after' => 'background: {{VALUE}};',
1289	],
1290	]
1291	);
1292
1293	$this->add_group_control(
1294	Group_Control_Typography::get_type(),
1295	[
1296	'name' => 'pagination_typography',
1297	'label' => esc_html__('Typography', 'ultimate-post-kit'),
1298	'selector' => '{{WRAPPER}} .upk-snog-slider-wrap .upk-pagination-wrap .swiper-pagination-bullet',
1299	]
1300	);
1301
1302	$this->add_responsive_control(
1303	'pagination_spacing',
1304	[
1305	'label' => esc_html__('Space Between', 'ultimate-post-kit'),
1306	'type' => Controls_Manager::SLIDER,
1307	'range' => [
1308	'px' => [
1309	'min' => 0,
1310	'max' => 50,
1311	],
1312	],
1313	'selectors' => [
1314	'{{WRAPPER}} .upk-snog-slider-wrap .upk-pagination-wrap .upk-pagination' => 'grid-row-gap: {{SIZE}}{{UNIT}};',
1315	],
1316	]
1317	);
1318
1319	$this->add_control(
1320	'pagination_active_heading',
1321	[
1322	'label' => esc_html__( 'A C T I V E', 'ultimate-post-kit' ),
1323	'type' => Controls_Manager::HEADING,
1324	'separator' => 'before',
1325	]
1326	);
1327
1328	$this->add_control(
1329	'pagination_active_color',
1330	[
1331	'label' => esc_html__('Active Color', 'ultimate-post-kit'),
1332	'type' => Controls_Manager::COLOR,
1333	'selectors' => [
1334	'{{WRAPPER}} .upk-snog-slider-wrap .upk-pagination-wrap .swiper-pagination-bullet-active' => 'color: {{VALUE}};',
1335	'{{WRAPPER}} .upk-snog-slider-wrap .upk-pagination-wrap .swiper-pagination-bullet-active::after' => 'background: {{VALUE}};',
1336	],
1337	]
1338	);
1339
1340	$this->end_controls_section();
1341
1342	}
1343
1344	/**
1345	* Main query render for this widget
1346	* @param $posts_per_page number item query limit
1347	*/
1348	public function query_posts( $posts_per_page ) {
1349
1350	$default = $this->getGroupControlQueryArgs();
1351	$args = [];
1352	if ( $posts_per_page ) {
1353	$args['posts_per_page'] = $posts_per_page;
1354	// $args['paged'] = max( 1, get_query_var( 'paged' ), get_query_var( 'page' ) );
1355	}
1356	$args = array_merge( $default, $args );
1357	$this->_query = new WP_Query( $args );
1358	}
1359
1360	public function render_author() {
1361
1362	if ( ! $this->get_settings( 'show_author' ) ) {
1363	return;
1364	}
1365	?>
1366	<div class="upk-author">
1367	<span class="upk-by"><?php echo esc_html_x( 'by ', 'Frontend', 'ultimate-post-kit' ) ?></span>
1368	<a class="upk-name" href="<?php echo esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ) ?>">
1369	<?php echo esc_html( get_the_author() ) ?>
1370	</a>
1371	</div>
1372	<?php
1373	}
1374
1375
1376	public function render_header() {
1377	$settings = $this->get_settings_for_display();
1378	$id = 'upk-snog-slider-' . $this->get_id();
1379
1380	$this->add_render_attribute( 'snog-slider', 'class', ['upk-snog-slider'] );
1381
1382	$this->add_render_attribute(
1383	[
1384	'snog-slider' => [
1385	'data-settings' => [
1386	wp_json_encode(array_filter([
1387	"autoplay" => ( "yes" == $settings["autoplay"] ) ? [ "delay" => $settings["autoplay_speed"] ] : false,
1388	"loop" => ($settings["loop"] == "yes") ? true : false,
1389	"speed" => $settings["speed"]["size"],
1390	"effect" => 'slide',
1391	"lazy" => true,
1392	"grabCursor" => ($settings["grab_cursor"] === "yes") ? true : false,
1393	"pauseOnHover" => ("yes" == $settings["pauseonhover"]) ? true : false,
1394	"slidesPerView" => 1,
1395	"observer" => ($settings["observer"]) ? true : false,
1396	"observeParents" => ($settings["observer"]) ? true : false,
1397	"loopedSlides" => 4,
1398	// "allowTouchMove" => false,
1399	"lazy" => [
1400	"loadPrevNext" => "true",
1401	],
1402	]))
1403	],
1404	'data-widget-settings' => [
1405	wp_json_encode(
1406	[
1407	'id' => '#' . $id
1408	]
1409	)
1410	]
1411	]
1412	]
1413	);
1414
1415	$this->add_render_attribute('swiper', 'class', 'upk-main-slider swiper');
1416
1417	?>
1418	<div <?php $this->print_render_attribute_string( 'snog-slider' ); ?>>
1419	<div <?php $this->print_render_attribute_string('swiper'); ?>>
1420	<div class="swiper-wrapper">
1421	<?php
1422	}
1423
1424	public function render_footer() {
1425	$settings = $this->get_settings_for_display();
1426
1427	?>
1428
1429	</div>
1430	<?php if($settings['show_pagination']) : ?>
1431	<div class="upk-pagination-wrap">
1432	<div class="upk-pagination"></div>
1433	</div>
1434	<?php endif; ?>
1435
1436	</div>
1437	</div>
1438
1439	<?php
1440	}
1441
1442	function render_excerpt($excerpt_length) {
1443	if (!$this->get_settings('show_excerpt')) {
1444	return;
1445	}
1446	$strip_shortcode = $this->get_settings_for_display('strip_shortcode');
1447	?>
1448	<div class="upk-text" data-swiper-parallax-y ="-100" data-swiper-parallax-duration="700">
1449	<?php
1450	if (has_excerpt()) {
1451	the_excerpt();
1452	} else {
1453	echo wp_kses_post( ultimate_post_kit_custom_excerpt($excerpt_length, $strip_shortcode) );
1454	}
1455	?>
1456	</div>
1457	<?php
1458	}
1459
1460	public function render_post_grid_item($post_id, $image_size) {
1461	$settings = $this->get_settings_for_display();
1462
1463	$this->add_render_attribute('slider-item', 'class', 'upk-item swiper-slide', true);
1464
1465	?>
1466	<div <?php $this->print_render_attribute_string('slider-item'); ?>>
1467	<div class="upk-image-wrap">
1468	<?php $this->render_image(get_post_thumbnail_id($post_id), $image_size); ?>
1469	</div>
1470	</div>
1471	<?php
1472	}
1473
1474	public function render_content_item($excerpt_length) {
1475	$settings = $this->get_settings_for_display();
1476
1477	$this->add_render_attribute('slider-item', 'class', 'upk-item swiper-slide', true);
1478
1479	?>
1480	<div <?php $this->print_render_attribute_string('slider-item'); ?>>
1481	<div class="upk-content-wrap">
1482	<div class="upk-inner-content">
1483	<?php if ( $settings['show_category'] ) : ?>
1484	<div data-swiper-parallax-x ="-60" data-swiper-parallax-duration="500">
1485	<?php $this->render_category(); ?>
1486	</div>
1487	<?php endif; ?>
1488
1489	<?php if ( $settings['show_author'] or $settings['show_date'] or $settings['show_reading_time'] ) : ?>
1490	<div class="upk-meta" data-swiper-parallax-x ="-60" data-swiper-parallax-duration="600">
1491	<?php $this->render_author(); ?>
1492
1493	<?php if ($settings['show_date'] == 'yes') : ?>
1494	<div data-separator="<?php echo esc_html($settings['meta_separator']); ?>">
1495	<?php $this->render_date(); ?>
1496	</div>
1497	<?php endif; ?>
1498
1499	<?php if (_is_upk_pro_activated()) :
1500	if ('yes' === $settings['show_reading_time']) : ?>
1501	<div class="upk-reading-time" data-separator="<?php echo esc_html($settings['meta_separator']); ?>">
1502	<?php echo esc_html( ultimate_post_kit_reading_time(get_the_content(), $settings['avg_reading_speed'], $settings['hide_seconds'] ?? 'no', $settings['hide_minutes'] ?? 'no') ); ?>
1503	</div>
1504	<?php endif; ?>
1505	<?php endif; ?>
1506
1507	</div>
1508	<?php endif; ?>
1509
1510	<?php if ( $settings['show_title'] ) : ?>
1511	<div data-swiper-parallax-x ="-60" data-swiper-parallax-duration="700">
1512	<?php $this->render_title(substr($this->get_name(), 4)); ?>
1513	</div>
1514	<?php endif; ?>
1515
1516	<?php $this->render_excerpt($excerpt_length); ?>
1517
1518	<?php if ($settings['show_readmore'] === 'yes' and !empty($settings['readmore_text'])) : ?>
1519	<div class="upk-link-btn" data-swiper-parallax-x ="-60" data-swiper-parallax-duration="800">
1520	<a href="<?php echo esc_url(get_permalink()); ?>">
1521	<span><?php echo esc_html($settings['readmore_text']); ?></span>
1522	</a>
1523	</div>
1524	<?php endif; ?>
1525
1526	</div>
1527	</div>
1528	</div>
1529	<?php
1530	}
1531
1532	public function render_thumbnav($post_id, $image_size) {
1533	$settings = $this->get_settings_for_display();
1534
1535	$this->add_render_attribute('thumb-item', 'class', 'upk-item swiper-slide', true);
1536
1537	?>
1538	<div <?php $this->print_render_attribute_string('thumb-item'); ?>>
1539	<div class="upk-image-wrap">
1540	<?php $this->render_image(get_post_thumbnail_id($post_id), $image_size); ?>
1541	</div>
1542	</div>
1543	<?php
1544
1545	}
1546
1547	public function render() {
1548	$settings = $this->get_settings_for_display();
1549	$id = 'upk-snog-slider-' . $this->get_id();
1550
1551	$this->query_posts($settings['item_limit']['size']);
1552	$wp_query = $this->get_query();
1553
1554	if (!$wp_query->found_posts) {
1555	return;
1556	}
1557
1558	$this->add_render_attribute('swiper-thumbs', 'class', 'upk-snog-thumbs swiper');
1559	$this->add_render_attribute('swiper-content', 'class', 'upk-content-slider swiper');
1560
1561	?>
1562	<div class="upk-snog-slider-wrap" id="<?php echo esc_attr($id); ?>">
1563	<?php
1564
1565	$this->render_header();
1566
1567	while ( $wp_query->have_posts() ) {
1568	$wp_query->the_post();
1569	$thumbnail_size = $settings['primary_thumbnail_size'];
1570
1571	$this->render_post_grid_item( get_the_ID(), $thumbnail_size );
1572	}
1573
1574	$this->render_footer();
1575
1576	?>
1577	<div thumbsSlider="" <?php $this->print_render_attribute_string('swiper-thumbs'); ?>>
1578	<div class="swiper-wrapper">
1579	<?php
1580
1581	while ( $wp_query->have_posts() ) {
1582	$wp_query->the_post();
1583	$thumbnail_size = $settings['primary_thumbnail_size'];
1584
1585	$this->render_thumbnav( get_the_ID(), $thumbnail_size );
1586	}
1587
1588	?>
1589	</div>
1590	</div>
1591
1592	<div <?php $this->print_render_attribute_string('swiper-content'); ?>>
1593	<div class="swiper-wrapper">
1594	<?php
1595	while ( $wp_query->have_posts() ) {
1596	$wp_query->the_post();
1597
1598	$this->render_content_item( $settings['excerpt_length']);
1599	}
1600	?>
1601	</div>
1602
1603	<?php if ($settings['show_navigation']) : ?>
1604	<div class="upk-navigation-wrap">
1605	<div class="upk-nav-btn upk-navigation-prev">
1606	<i class="upk-icon-arrow-left-<?php echo esc_html($settings['nav_arrows_icon']); ?>" aria-hidden="true"></i>
1607	</div>
1608	<div class="upk-nav-btn upk-navigation-next">
1609	<i class="upk-icon-arrow-right-<?php echo esc_html($settings['nav_arrows_icon']); ?>" aria-hidden="true"></i>
1610	</div>
1611	</div>
1612	<?php endif; ?>
1613	</div>
1614
1615	</div>
1616
1617	<?php
1618	wp_reset_postdata();
1619	}
1620	}
1621