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.13, at modules/snog-slider/widgets/snog-slider.php

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