king-addons / includes / widgets / Blog_Posts / Blog_Posts.php

Blog_Posts.php in King Addons for Elementor – 80+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce, Mega Menu, Popup Builder 51.1.76, at includes/widgets/Blog_Posts/Blog_Posts.php

2,574 lines 95.6 KB

Raw Download Zip

1	<?php /** @noinspection SpellCheckingInspection, DuplicatedCode, PhpUnused */
2
3	namespace King_Addons;
4
5	use Elementor\Controls_Manager;
6	use Elementor\Group_Control_Background;
7	use Elementor\Group_Control_Border;
8	use Elementor\Group_Control_Box_Shadow;
9	use Elementor\Group_Control_Css_Filter;
10	use Elementor\Group_Control_Typography;
11	use Elementor\Icons_Manager;
12	use Elementor\Widget_Base;
13	use WP_Query;
14
15	if (!defined('ABSPATH')) {
16	exit; // Exit if accessed directly.
17	}
18
19
20
21	class Blog_Posts extends Widget_Base
22	{
23
24
25	public function get_name(): string
26	{
27	return 'king-addons-blog-posts';
28	}
29
30	public function get_title(): string
31	{
32	return esc_html__(' Advanced Blog Posts Carousel', 'king-addons');
33	}
34
35	public function get_icon(): string
36	{
37	return 'king-addons-icon king-addons-blog-posts';
38	}
39
40	public function get_script_depends(): array
41	{
42	return [KING_ADDONS_ASSETS_UNIQUE_KEY . '-swiper-swiper'];
43	}
44
45	public function get_style_depends(): array
46	{
47	return [KING_ADDONS_ASSETS_UNIQUE_KEY . '-swiper-swiper', KING_ADDONS_ASSETS_UNIQUE_KEY . '-blog-posts-style'];
48	}
49
50	public function get_categories(): array
51	{
52	return ['king-addons'];
53	}
54
55	public function get_keywords(): array
56	{
57	return ['card', 'carousel', 'slider', 'scroller', 'swiper', 'content', 'button', 'dot', 'dots', 'navigation',
58	'cards', 'wheel', 'touch', 'nav', 'navigation', 'animation', 'effect', 'animated', 'template', 'link',
59	'left', 'right', 'top', 'bottom', 'vertical', 'horizontal', 'mouse', 'dragging', 'hover', 'over',
60	'hover over', 'picture', 'float', 'floating', 'sticky', 'click', 'target', 'point', 'king', 'addons',
61	'mouseover', 'page', 'blog posts', 'kingaddons', 'king-addons', 'team', 'members', 'testimonial',
62	'testimonials', 'reviews', ' team memebers', 'drag', 'scroll', 'scrolling', 'tabs', 'tab'];
63	}
64
65	public function get_custom_help_url()
66	{
67	return 'mailto:bug@kingaddons.com?subject=Bug Report - King Addons&body=Please describe the issue';
68	}
69
70	protected function register_controls(): void
71	{
72	/** START TAB: CONTENT ===================== */
73	/** SECTION: Carousel Settings */
74	$this->start_controls_section(
75	'kng_blog_posts_content_section_caousel_settings',
76	[
77	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Carousel Settings', 'king-addons'),
78	'tab' => Controls_Manager::TAB_CONTENT,
79	]
80	);
81
82	$this->add_control(
83	'kng_blog_posts_number_of_posts',
84	[
85	'label' => esc_html__('Number of latest posts', 'king-addons'),
86	'type' => Controls_Manager::NUMBER,
87	'min' => 1,
88	'step' => 1,
89	'default' => 5,
90	]
91	);
92
93	$this->add_control(
94	'kng_blog_posts_number_of_words',
95	[
96	'label' => esc_html__('Trim description to a certain number of words.', 'king-addons'),
97	'type' => Controls_Manager::NUMBER,
98	'min' => 1,
99	'step' => 1,
100	'default' => 30,
101	]
102	);
103
104	$this->add_control(
105	'kng_blog_posts_loop_switcher',
106	[
107	'label' => esc_html__('Loop Cards', 'king-addons'),
108	'type' => Controls_Manager::SWITCHER,
109	'default' => 'yes'
110	]
111	);
112
113	$this->add_control(
114	'kng_blog_posts_rewind_switcher',
115	[
116	'label' => esc_html__('Rewind Cards', 'king-addons'),
117	'description' => esc_html__('When enabled, clicking the next navigation button when on last slide will slide back to the first slide. Clicking the prev navigation button when on first slide will slide forward to the last slide. Should not be used together with loop mode.', 'king-addons'),
118	'type' => Controls_Manager::SWITCHER
119	]
120	);
121
122	$this->add_control(
123	'kng_blog_posts_ignore_sticky_posts_switcher',
124	[
125	'label' => esc_html__('Ignore sticky posts', 'king-addons'),
126	'description' => esc_html__('Check the page on live preview to see sticky posts.', 'king-addons'),
127	'type' => Controls_Manager::SWITCHER,
128	'default' => 'no'
129	]
130	);
131
132	$this->add_control(
133	'kng_blog_posts_autoplay_switcher',
134	[
135	'label' => esc_html__('Autoplay Carousel Cards', 'king-addons'),
136	'type' => Controls_Manager::SWITCHER,
137	'separator' => 'before',
138	]
139	);
140
141	$this->add_control(
142	'kng_blog_posts_autoplay_delay',
143	[
144	'label' => esc_html__('Delay between transitions (ms)', 'king-addons'),
145	'type' => Controls_Manager::NUMBER,
146	'min' => 0,
147	'step' => 10,
148	'default' => 2000,
149	'condition' => [
150	'kng_blog_posts_autoplay_switcher!' => '',
151	'kng_blog_posts_autoplay_like_ticker_switcher!' => 'yes',
152	]
153	]
154	);
155
156	$this->add_control(
157	'kng_blog_posts_autoplay_disableoninteraction_switcher',
158	[
159	'label' => esc_html__('Disable on interaction', 'king-addons'),
160	'description' => esc_html__('Autoplay will be disabled after user interactions (swipes), it will not be restarted every time after interaction.', 'king-addons'),
161	'type' => Controls_Manager::SWITCHER,
162	'condition' => [
163	'kng_blog_posts_autoplay_switcher!' => '',
164	]
165	]
166	);
167
168	$this->add_control(
169	'kng_blog_posts_autoplay_pausedonmouseenter_switcher',
170	[
171	'label' => esc_html__('Pause on mouse enter', 'king-addons'),
172	'description' => esc_html__('When enabled autoplay will be paused on pointer (mouse) enter over carousel container.', 'king-addons'),
173	'type' => Controls_Manager::SWITCHER,
174	'condition' => [
175	'kng_blog_posts_autoplay_switcher!' => '',
176	]
177	]
178	);
179
180	$this->add_control(
181	'kng_blog_posts_autoplay_reversedirection_switcher',
182	[
183	'label' => esc_html__('Reverse Direction', 'king-addons'),
184	'description' => esc_html__('Enables autoplay in reverse direction.', 'king-addons'),
185	'type' => Controls_Manager::SWITCHER,
186	'condition' => [
187	'kng_blog_posts_autoplay_switcher!' => '',
188	]
189	]
190	);
191
192	$this->add_control(
193	'kng_blog_posts_autoplay_like_ticker_switcher',
194	[
195	'label' => esc_html__('Autoplay Like Ticker (marquee effect)', 'king-addons'),
196	'description' => esc_html__('Autoscrolls cards as on ticker, also known as marquee effect.', 'king-addons'),
197	'type' => Controls_Manager::SWITCHER,
198	'condition' => [
199	'kng_blog_posts_autoplay_switcher!' => '',
200	],
201	]
202	);
203
204	$this->add_control(
205	'kng_blog_posts_autoplay_like_ticker_autoplay_speed',
206	[
207	'label' => esc_html__('Autoplay Speed (ms)', 'king-addons'),
208	'type' => Controls_Manager::NUMBER,
209	'min' => 0,
210	'step' => 10,
211	'default' => 6000,
212	'condition' => [
213	'kng_blog_posts_autoplay_like_ticker_switcher' => 'yes',
214	]
215	]
216	);
217
218	$this->add_control(
219	'kng_blog_posts_scrolling_speed',
220	[
221	'label' => esc_html__('Scrolling Speed (ms)', 'king-addons'),
222	'type' => Controls_Manager::NUMBER,
223	'min' => 0,
224	'step' => 10,
225	'default' => 600,
226	'separator' => 'before',
227	'condition' => [
228	'kng_blog_posts_autoplay_like_ticker_switcher!' => 'yes',
229	]
230	]
231	);
232
233	$this->end_controls_section();
234	/** END SECTION: Carousel Settings */
235
236
237	/** SECTION: Disable Card Items */
238	$this->start_controls_section(
239	'kng_blog_posts_content_section_disable_card_items',
240	[
241	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Disable Card Items', 'king-addons'),
242	'tab' => Controls_Manager::TAB_CONTENT,
243	]
244	);
245
246	$this->add_control(
247	'kng_blog_posts_cards_image_switcher',
248	[
249	'label' => esc_html__('Disable image', 'king-addons'),
250	'type' => Controls_Manager::SWITCHER,
251	'separator' => 'before',
252	]
253	);
254
255	$this->add_control(
256	'kng_blog_posts_cards_title_switcher',
257	[
258	'label' => esc_html__('Disable Title', 'king-addons'),
259	'type' => Controls_Manager::SWITCHER,
260	]
261	);
262
263	$this->add_control(
264	'kng_blog_posts_cards_description_switcher',
265	[
266	'label' => esc_html__('Disable Description', 'king-addons'),
267	'type' => Controls_Manager::SWITCHER,
268	]
269	);
270
271	$this->add_control(
272	'kng_blog_posts_cards_whole_text_container_switcher',
273	[
274	'label' => esc_html__('Disable whole text container', 'king-addons'),
275	'description' => esc_html__('Text container includes title and description.', 'king-addons'),
276	'type' => Controls_Manager::SWITCHER,
277	]
278	);
279
280	$this->end_controls_section();
281	/** END SECTION: Disable Card Items */
282
283	/** SECTION: Card Layout */
284	$this->start_controls_section(
285	'kng_blog_posts_content_section_card_layout',
286	[
287	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Card Layout', 'king-addons'),
288	'tab' => Controls_Manager::TAB_CONTENT,
289	]
290	);
291
292	$this->add_control(
293	'kng_blog_posts_cards_whole_card_title',
294	[
295	'label' => '<b>' . esc_html__('Whole Card', 'king-addons') . '</b>',
296	'type' => Controls_Manager::RAW_HTML,
297	]
298	);
299
300	$this->add_responsive_control(
301	'kng_blog_posts_cards_whole_card_align_card_full_height',
302	[
303	'label' => esc_html__('Make card full height', 'king-addons'),
304	'type' => Controls_Manager::SELECT,
305	'default' => '100%',
306	'options' => [
307	'100%' => esc_html__('No', 'king-addons'),
308	'auto' => esc_html__('Yes', 'king-addons'),
309	],
310	'selectors' => [
311	'{{WRAPPER}} .king-addons-blog-posts-card' => 'height: {{VALUE}};'
312	],
313	]
314	);
315
316	$this->add_responsive_control(
317	'kng_blog_posts_cards_whole_card_align_card',
318	[
319	'label' => esc_html__('Align Whole Card', 'king-addons'),
320	'type' => Controls_Manager::SELECT,
321	'options' => [
322	'unset' => esc_html__('Default', 'king-addons'),
323	'start' => esc_html__('Start', 'king-addons'),
324	'center' => esc_html__('Center', 'king-addons'),
325	'end' => esc_html__('End', 'king-addons'),
326	],
327	'default' => 'unset',
328	'selectors' => [
329	'{{WRAPPER}} .king-addons-blog-posts-card' => 'align-self: {{VALUE}};'
330	],
331	'condition' => [
332	'kng_blog_posts_cards_whole_card_align_card_full_height' => '100%'
333	],
334	]
335	);
336
337	$this->add_responsive_control(
338	'kng_blog_posts_cards_whole_card_align_card_content',
339	[
340	'label' => esc_html__('Align Card Content', 'king-addons'),
341	'type' => Controls_Manager::SELECT,
342	'options' => [
343	'unset' => esc_html__('Default', 'king-addons'),
344	'start' => esc_html__('Start', 'king-addons'),
345	'center' => esc_html__('Center', 'king-addons'),
346	'end' => esc_html__('End', 'king-addons'),
347	],
348	'default' => 'start',
349	'selectors' => [
350	'{{WRAPPER}} .king-addons-blog-posts-card .king-addons-blog-posts-card-inner' => 'justify-content: {{VALUE}};'
351	],
352	'condition' => [
353	'kng_blog_posts_cards_whole_card_align_card_full_height' => 'auto'
354	],
355	]
356	);
357
358	$this->add_control(
359	'kng_blog_posts_cards_image_container_title',
360	[
361	'label' => '<b>' . esc_html__('Image Container', 'king-addons') . '</b>',
362	'description' => esc_html__('Image container includes paddings and background color.', 'king-addons'),
363	'type' => Controls_Manager::RAW_HTML,
364	]
365	);
366
367	$this->add_responsive_control(
368	'kng_blog_posts_cards_image_container_position',
369	[
370	'label' => esc_html__('Position', 'king-addons'),
371	'type' => Controls_Manager::CHOOSE,
372	'default' => 'column',
373	'options' => [
374	'row' => [
375	'title' => esc_html__('Left', 'king-addons'),
376	'icon' => 'eicon-h-align-left',
377	],
378	'column' => [
379	'title' => esc_html__('Top', 'king-addons'),
380	'icon' => 'eicon-v-align-top',
381	],
382	'column-reverse' => [
383	'title' => esc_html__('Bottom', 'king-addons'),
384	'icon' => 'eicon-v-align-bottom',
385	],
386	'row-reverse' => [
387	'title' => esc_html__('Right', 'king-addons'),
388	'icon' => 'eicon-h-align-right',
389	],
390	],
391	'selectors' => [
392	'{{WRAPPER}} .king-addons-blog-posts-card-inner a' => 'flex-flow: {{VALUE}};',
393	],
394	]
395	);
396
397	$this->add_responsive_control(
398	'kng_blog_posts_cards_image_container_height_type',
399	[
400	'label' => esc_html__('Height', 'king-addons'),
401	'type' => Controls_Manager::SELECT,
402	'options' => [
403	'auto' => esc_html__('Auto', 'king-addons'),
404	'custom' => esc_html__('Custom (%)', 'king-addons'),
405	],
406	'default' => 'auto',
407	'selectors' => [
408	'{{WRAPPER}} .king-addons-blog-posts-card-container-1, {{WRAPPER}} .king-addons-blog-posts-image' => 'height: {{VALUE}};',
409	],
410	]
411	);
412
413	$this->add_responsive_control(
414	'kng_blog_posts_cards_image_container_height',
415	[
416	'label' => esc_html__('Custom height (%)', 'king-addons'),
417	'type' => Controls_Manager::NUMBER,
418	'min' => 0,
419	'max' => 100,
420	'step' => 1,
421	'default' => 100,
422	'selectors' => [
423	'{{WRAPPER}} .king-addons-blog-posts-card-container-1, {{WRAPPER}} .king-addons-blog-posts-image' => 'height: {{SIZE}}%;'
424	],
425	'condition' => [
426	'kng_blog_posts_cards_image_container_height_type' => 'custom'
427	],
428	]
429	);
430
431	$this->add_responsive_control(
432	'kng_blog_posts_cards_image_container_align_content',
433	[
434	'label' => esc_html__('Align Content', 'king-addons'),
435	'type' => Controls_Manager::SELECT,
436	'options' => [
437	'unset' => esc_html__('Default', 'king-addons'),
438	'start' => esc_html__('Start', 'king-addons'),
439	'center' => esc_html__('Center', 'king-addons'),
440	'end' => esc_html__('End', 'king-addons'),
441	],
442	'default' => 'center',
443	'selectors' => [
444	'{{WRAPPER}} .king-addons-blog-posts-card-container-1' => 'justify-content: {{VALUE}}; align-items: {{VALUE}}; align-self: {{VALUE}};',
445	'{{WRAPPER}} .king-addons-blog-posts-image' => 'justify-content: {{VALUE}}; align-items: {{VALUE}}; align-self: {{VALUE}};'
446	],
447	]
448	);
449
450	$this->add_control(
451	'kng_blog_posts_cards_text_container_title',
452	[
453	'label' => '<b>' . esc_html__('Text Container', 'king-addons') . '</b>' .
454	'<div class="elementor-control-field-description">' .
455	esc_html__('Text container includes title and description.', 'king-addons') .
456	'</div>',
457	'type' => Controls_Manager::RAW_HTML,
458	'separator' => 'before',
459	]
460	);
461
462	$this->add_responsive_control(
463	'kng_blog_posts_cards_text_container_width_type',
464	[
465	'label' => esc_html__('Width', 'king-addons'),
466	'type' => Controls_Manager::SELECT,
467	'options' => [
468	'auto' => esc_html__('Auto', 'king-addons'),
469	'custom' => esc_html__('Custom (%)', 'king-addons'),
470	],
471	'default' => 'custom',
472	]
473	);
474
475	$this->add_responsive_control(
476	'kng_blog_posts_cards_text_container_width',
477	[
478	'label' => esc_html__('Custom width (%)', 'king-addons'),
479	'type' => Controls_Manager::NUMBER,
480	'min' => 0,
481	'step' => 1,
482	'max' => 100,
483	'default' => 100,
484	'selectors' => [
485	'{{WRAPPER}} .king-addons-blog-posts-card-container-2' => 'width: {{SIZE}}%;'
486	],
487	'condition' => [
488	'kng_blog_posts_cards_text_container_width_type' => 'custom'
489	],
490	]
491	);
492
493	$this->add_responsive_control(
494	'kng_blog_posts_cards_text_container_align_content',
495	[
496	'label' => esc_html__('Align Content', 'king-addons'),
497	'type' => Controls_Manager::SELECT,
498	'options' => [
499	'unset' => esc_html__('Default', 'king-addons'),
500	'start' => esc_html__('Start', 'king-addons'),
501	'center' => esc_html__('Center', 'king-addons'),
502	'end' => esc_html__('End', 'king-addons'),
503	],
504	'default' => 'start',
505	'selectors' => [
506	'{{WRAPPER}} .king-addons-blog-posts-card-container-2' => 'justify-content: {{VALUE}}; align-items: {{VALUE}}; align-self: {{VALUE}};'
507	],
508	]
509	);
510
511	$this->end_controls_section();
512	/** END SECTION: Card Layout ===================== */
513
514	/** SECTION: Responsive Settings */
515	$this->start_controls_section(
516	'kng_blog_posts_content_section_responsive_settings',
517	[
518	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Responsive Settings', 'king-addons'),
519	'tab' => Controls_Manager::TAB_CONTENT,
520	]
521	);
522
523	$this->add_control(
524	'kng_blog_posts_desktop_title',
525	[
526	'label' => '<b>' . esc_html__('Desktop', 'king-addons') . '</b>',
527	'type' => Controls_Manager::RAW_HTML,
528	]
529	);
530
531	$this->add_control(
532	'kng_blog_posts_desktop_cards_per_view',
533	[
534	'label' => esc_html__('Cards per view', 'king-addons'),
535	'description' => esc_html__('The number of slides per view can be a fractional number like 4.5, 5.25, 6.45, etc., to indicate that further slides exist.', 'king-addons'),
536	'type' => Controls_Manager::NUMBER,
537	'min' => 1,
538	'step' => 0.1,
539	'default' => 4.0,
540	]
541	);
542
543	$this->add_control(
544	'kng_blog_posts_desktop_space_between_cards',
545	[
546	'label' => esc_html__('Space between cards (px)', 'king-addons'),
547	'type' => Controls_Manager::NUMBER,
548	'min' => 0,
549	'step' => 1,
550	'default' => 30,
551	'separator' => 'after',
552	]
553	);
554
555	$this->add_control(
556	'kng_blog_posts_tablet_title',
557	[
558	'label' => '<b>' . esc_html__('Tablet', 'king-addons') . '</b>',
559	'type' => Controls_Manager::RAW_HTML,
560	]
561	);
562
563	$this->add_control(
564	'kng_blog_posts_tablet_cards_per_view',
565	[
566	'label' => esc_html__('Cards per view', 'king-addons'),
567	'type' => Controls_Manager::NUMBER,
568	'min' => 1,
569	'step' => 0.1,
570	'default' => 3.0,
571	]
572	);
573
574	$this->add_control(
575	'kng_blog_posts_tablet_space_between_cards',
576	[
577	'label' => esc_html__('Space between cards (px)', 'king-addons'),
578	'type' => Controls_Manager::NUMBER,
579	'min' => 0,
580	'step' => 1,
581	'default' => 30,
582	'separator' => 'after',
583	]
584	);
585
586	$this->add_control(
587	'kng_blog_posts_tablet_breakpoint',
588	[
589	'label' => esc_html__('Breakpoint (px)', 'king-addons'),
590	'type' => Controls_Manager::NUMBER,
591	'min' => 1,
592	'step' => 1,
593	'default' => 1024,
594	]
595	);
596
597	$this->add_control(
598	'kng_blog_posts_mobile_title',
599	[
600	'label' => '<b>' . esc_html__('Mobile', 'king-addons') . '</b>',
601	'type' => Controls_Manager::RAW_HTML,
602	]
603	);
604
605	$this->add_control(
606	'kng_blog_posts_mobile_cards_per_view',
607	[
608	'label' => esc_html__('Cards per view', 'king-addons'),
609	'type' => Controls_Manager::NUMBER,
610	'min' => 1,
611	'step' => 0.1,
612	'default' => 1.0,
613	]
614	);
615
616	$this->add_control(
617	'kng_blog_posts_mobile_space_between_cards',
618	[
619	'label' => esc_html__('Space between cards (px)', 'king-addons'),
620	'type' => Controls_Manager::NUMBER,
621	'min' => 0,
622	'step' => 1,
623	'default' => 30,
624	]
625	);
626
627	$this->add_control(
628	'kng_blog_posts_mobile_breakpoint',
629	[
630	'label' => esc_html__('Breakpoint (px)', 'king-addons'),
631	'type' => Controls_Manager::NUMBER,
632	'min' => 1,
633	'step' => 1,
634	'default' => 767,
635	]
636	);
637
638	$this->end_controls_section();
639	/** END SECTION: Responsive Settings */
640
641	/** START SECTION: Navigation */
642	$this->start_controls_section(
643	'kng_blog_posts_content_section_nav',
644	[
645	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Navigation', 'king-addons'),
646	'tab' => Controls_Manager::TAB_CONTENT,
647	]
648	);
649
650	$this->add_control(
651	'kng_blog_posts_nav_switcher',
652	[
653	'label' => esc_html__('Enable navigation', 'king-addons'),
654	'type' => Controls_Manager::SWITCHER,
655	'default' => 'yes',
656	]
657	);
658
659	$this->add_responsive_control(
660	'kng_blog_posts_nav_display',
661	[
662	'label' => esc_html__('Display on different screen sizes', 'king-addons'),
663	'type' => Controls_Manager::SELECT,
664	'options' => [
665	'flex' => esc_html__('Show', 'king-addons'),
666	'none' => esc_html__('Hide', 'king-addons'),
667	],
668	'desktop_default' => 'flex',
669	'tablet_default' => 'none',
670	'mobile_default' => 'none',
671	'selectors' => [
672	'{{WRAPPER}} .king-addons-blog-posts-nav' => 'display: {{VALUE}};'
673	],
674	'condition' => [
675	'kng_blog_posts_nav_switcher' => 'yes'
676	]
677	]
678	);
679
680	$this->end_controls_section();
681	/** END SECTION: Navigation */
682
683	/** START SECTION: Pagination */
684	$this->start_controls_section(
685	'kng_blog_posts_content_section_pag',
686	[
687	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Pagination', 'king-addons'),
688	'tab' => Controls_Manager::TAB_CONTENT,
689	]
690	);
691
692	$this->add_control(
693	'kng_blog_posts_pag_switcher',
694	[
695	'label' => esc_html__('Enable pagination', 'king-addons'),
696	'type' => Controls_Manager::SWITCHER,
697	'default' => 'yes',
698	]
699	);
700
701	$this->add_control(
702	'kng_blog_posts_pag_type',
703	[
704	'label' => esc_html__('Type', 'king-addons'),
705	'type' => Controls_Manager::SELECT,
706	'options' => [
707	'bullets' => esc_html__('Bullets', 'king-addons'),
708	'progressbar' => esc_html__('Progress Bar', 'king-addons'),
709	'fraction' => esc_html__('Fraction', 'king-addons'),
710	],
711	'default' => 'bullets',
712	'condition' => [
713	'kng_blog_posts_pag_switcher' => 'yes'
714	]
715	]
716	);
717
718	// position top / bottom
719	$this->add_responsive_control(
720	'kng_blog_posts_pag_progressbar_position',
721	[
722	'label' => esc_html__('Progress bar position', 'king-addons'),
723	'description' => esc_html__('Check margin settings to properly set the position of the progress bar.', 'king-addons'),
724	'type' => Controls_Manager::SELECT,
725	'options' => [
726	'0' => esc_html__('Top', 'king-addons'),
727	'unset' => esc_html__('Bottom', 'king-addons'),
728	],
729	'default' => 'unset',
730	'selectors' => [
731	'{{WRAPPER}} .king-addons-blog-posts-pagination' => 'top: {{VALUE}}; bottom: 0;'
732	],
733	'condition' => [
734	'kng_blog_posts_pag_type' => 'progressbar',
735	]
736	]
737	);
738
739	$this->add_control(
740	'kng_blog_posts_pag_clickable_switcher',
741	[
742	'label' => esc_html__('Clickable Bullets', 'king-addons'),
743	'type' => Controls_Manager::SWITCHER,
744	'default' => 'yes',
745	'condition' => [
746	'kng_blog_posts_pag_type' => 'bullets',
747	]
748	]
749	);
750
751	$this->add_control(
752	'kng_blog_posts_pag_dynamic_switcher',
753	[
754	'label' => esc_html__('Dynamic Bullets', 'king-addons'),
755	'description' => esc_html__('Good to enable if you use bullets pagination with a lot of cards. So it will keep only few bullets visible at the same time.', 'king-addons'),
756	'type' => Controls_Manager::SWITCHER,
757	'default' => '',
758	'condition' => [
759	'kng_blog_posts_pag_type' => 'bullets',
760	]
761	]
762	);
763
764	$this->add_control(
765	'kng_blog_posts_pag_dynamic_number',
766	[
767	'label' => esc_html__('Number of Dynamic Bullets', 'king-addons'),
768	'description' => esc_html__('The number of main bullets visible when Dynamic Bullets enabled.', 'king-addons'),
769	'type' => Controls_Manager::NUMBER,
770	'min' => 1,
771	'step' => 1,
772	'default' => 1,
773	'condition' => [
774	'kng_blog_posts_pag_dynamic_switcher' => 'yes',
775	'kng_blog_posts_pag_type' => 'bullets',
776	]
777	]
778	);
779
780	$this->add_responsive_control(
781	'kng_blog_posts_pag_display',
782	[
783	'label' => esc_html__('Display on different screen sizes', 'king-addons'),
784	'type' => Controls_Manager::SELECT,
785	'options' => [
786	'block' => esc_html__('Show', 'king-addons'),
787	'none' => esc_html__('Hide', 'king-addons'),
788	],
789	'desktop_default' => 'block',
790	'tablet_default' => 'block',
791	'mobile_default' => 'block',
792	'selectors' => [
793	'{{WRAPPER}} .king-addons-blog-posts-pagination' => 'display: {{VALUE}};'
794	],
795	'condition' => [
796	'kng_blog_posts_pag_switcher' => 'yes'
797	]
798	]
799	);
800
801	$this->end_controls_section();
802	/** END SECTION: Pagination */
803
804	/** END TAB: CONTENT ===================== */
805
806	/** START TAB: STYLE ===================== */
807	$this->start_controls_section(
808	'kng_blog_posts_style_section_image',
809	[
810	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Image', 'king-addons'),
811	'tab' => Controls_Manager::TAB_STYLE,
812	]
813	);
814
815	$this->add_control(
816	'kng_blog_posts_image_size',
817	[
818	'label' => esc_html__('Image Resolution', 'king-addons'),
819	'type' => Controls_Manager::SELECT,
820	'options' => [
821	'thumbnail' => esc_html__('Thumbnail', 'king-addons'),
822	'medium' => esc_html__('Medium', 'king-addons'),
823	'large' => esc_html__('Large', 'king-addons'),
824	'full' => esc_html__('Full', 'king-addons'),
825	],
826	'default' => 'large',
827	]
828	);
829
830	$this->add_responsive_control(
831	'kng_blog_posts_image_height_type',
832	[
833	'label' => esc_html__('Height', 'king-addons'),
834	'type' => Controls_Manager::SELECT,
835	'options' => [
836	'auto' => esc_html__('Auto', 'king-addons'),
837	'custom-px' => esc_html__('Custom (px)', 'king-addons'),
838	'custom-pct' => esc_html__('Custom (%)', 'king-addons'),
839	],
840	'default' => 'custom-px',
841	]
842	);
843
844	$this->add_responsive_control(
845	'kng_blog_posts_image_width_type',
846	[
847	'label' => esc_html__('Width', 'king-addons'),
848	'type' => Controls_Manager::SELECT,
849	'options' => [
850	'auto' => esc_html__('Auto', 'king-addons'),
851	'custom-pct' => esc_html__('Width (%)', 'king-addons'),
852	'custom-px' => esc_html__('Maximum Width (px)', 'king-addons'),
853	],
854	'default' => 'auto',
855	]
856	);
857
858	$this->add_responsive_control(
859	'kng_blog_posts_image_width_pct',
860	[
861	'label' => esc_html__('Width (%)', 'king-addons'),
862	'type' => Controls_Manager::NUMBER,
863	'min' => 0,
864	'max' => 100,
865	'step' => 1,
866	'default' => 100,
867	'selectors' => [
868	'{{WRAPPER}} .king-addons-blog-posts-image img' => 'width: {{SIZE}}%;'
869	],
870	'condition' => [
871	'kng_blog_posts_image_width_type' => 'custom-pct'
872	]
873	]
874	);
875
876	$this->add_responsive_control(
877	'kng_blog_posts_image_width_px',
878	[
879	'label' => esc_html__('Maximum Width (px)', 'king-addons'),
880	'type' => Controls_Manager::NUMBER,
881	'min' => 0,
882	'step' => 1,
883	'default' => 200,
884	'selectors' => [
885	'{{WRAPPER}} .king-addons-blog-posts-image img' => 'max-width: {{SIZE}}px;'
886	],
887	'condition' => [
888	'kng_blog_posts_image_width_type' => 'custom-px'
889	]
890	]
891	);
892
893	$this->add_responsive_control(
894	'kng_blog_posts_image_height_px',
895	[
896	'label' => esc_html__('Height (px)', 'king-addons'),
897	'type' => Controls_Manager::NUMBER,
898	'min' => 0,
899	'step' => 1,
900	'default' => 200,
901	'selectors' => [
902	'{{WRAPPER}} .king-addons-blog-posts-image img' => 'height: {{SIZE}}px;'
903	],
904	'condition' => [
905	'kng_blog_posts_image_height_type' => 'custom-px'
906	]
907	]
908	);
909
910	$this->add_responsive_control(
911	'kng_blog_posts_image_height_pct',
912	[
913	'label' => esc_html__('Height (%)', 'king-addons'),
914	'type' => Controls_Manager::NUMBER,
915	'min' => 0,
916	'step' => 1,
917	'default' => 100,
918	'selectors' => [
919	'{{WRAPPER}} .king-addons-blog-posts-image img' => 'height: {{SIZE}}%;'
920	],
921	'condition' => [
922	'kng_blog_posts_image_height_type' => 'custom-pct'
923	]
924	]
925	);
926
927	$this->add_responsive_control(
928	'kng_blog_posts_image_fit',
929	[
930	'label' => esc_html__('Image Fit', 'king-addons'),
931	'type' => Controls_Manager::SELECT,
932	'options' => [
933	'cover' => esc_html__('Cover', 'king-addons'),
934	'contain' => esc_html__('Contain', 'king-addons'),
935	],
936	'default' => 'cover',
937	'selectors' => [
938	'{{WRAPPER}} .king-addons-blog-posts-image img' => 'object-fit: {{VALUE}};',
939	],
940	]
941	);
942
943	$this->add_responsive_control(
944	'kng_blog_posts_image_fit_position',
945	[
946	'label' => esc_html__('Image Fit Position', 'king-addons'),
947	'type' => Controls_Manager::SELECT,
948	'options' => [
949	'top' => esc_html__('Top', 'king-addons'),
950	'bottom' => esc_html__('Bottom', 'king-addons'),
951	'left' => esc_html__('Left', 'king-addons'),
952	'right' => esc_html__('Right', 'king-addons'),
953	'center' => esc_html__('Center', 'king-addons'),
954	],
955	'default' => 'center',
956	'selectors' => [
957	'{{WRAPPER}} .king-addons-blog-posts-image img' => 'object-position: {{VALUE}};',
958	],
959	'condition' => [
960	'kng_blog_posts_image_fit' => 'cover'
961	]
962	]
963	);
964
965	$this->add_control(
966	'kng_blog_posts_image_bg_color',
967	[
968	'label' => esc_html__('Background Color', 'king-addons'),
969	'type' => Controls_Manager::COLOR,
970	'default' => '',
971	'selectors' => [
972	'{{WRAPPER}} .king-addons-blog-posts-image' => 'background-color: {{VALUE}}',
973	],
974	'separator' => 'before',
975	]
976	);
977
978	$this->add_group_control(
979	Group_Control_Css_Filter::get_type(),
980	[
981	'label' => esc_html__('CSS Filter', 'king-addons'),
982	'name' => 'kng_blog_posts_image_css_filters',
983	'selector' => '{{WRAPPER}} .king-addons-blog-posts-image img',
984	]
985	);
986
987	$this->add_group_control(
988	Group_Control_Css_Filter::get_type(),
989	[
990	'label' => esc_html__('CSS Filter for image on card hover', 'king-addons'),
991	'name' => 'kng_blog_posts_image_css_filters_hover',
992	'selector' => '{{WRAPPER}} .king-addons-blog-posts-card:hover .king-addons-blog-posts-image img',
993	]
994	);
995
996	$this->add_responsive_control(
997	'kng_blog_posts_image_transition',
998	[
999	'label' => esc_html__('Transition duration on hover (ms)', 'king-addons'),
1000	'type' => Controls_Manager::NUMBER,
1001	'min' => 0,
1002	'step' => 10,
1003	'default' => 300,
1004	'selectors' => [
1005	'{{WRAPPER}} .king-addons-blog-posts-image img' => 'transition: all {{SIZE}}ms;'
1006	],
1007	]
1008	);
1009
1010	$this->add_control(
1011	'kng_blog_posts_image_scale_switcher',
1012	[
1013	'label' => esc_html__('Scale image on card hover', 'king-addons'),
1014	'type' => Controls_Manager::SWITCHER,
1015	]
1016	);
1017
1018	$this->add_responsive_control(
1019	'kng_blog_posts_image_scale_hover',
1020	[
1021	'label' => esc_html__('Scale on hover', 'king-addons'),
1022	'type' => Controls_Manager::NUMBER,
1023	'min' => 0,
1024	'step' => 0.01,
1025	'default' => 1.3,
1026	'selectors' => [
1027	'{{WRAPPER}} .king-addons-blog-posts-card:hover .king-addons-blog-posts-image img' => 'transform: scale({{SIZE}});'
1028	],
1029	'condition' => [
1030	'kng_blog_posts_image_scale_switcher' => 'yes',
1031	]
1032	]
1033	);
1034
1035	$this->add_responsive_control(
1036	'kng_blog_posts_image_padding',
1037	[
1038	'label' => esc_html__('Padding', 'king-addons'),
1039	'type' => Controls_Manager::DIMENSIONS,
1040	'size_units' => ['px', '%'],
1041	'default' => [
1042	'top' => 0,
1043	'right' => 0,
1044	'bottom' => 0,
1045	'left' => 0,
1046	'unit' => 'px',
1047	],
1048	'selectors' => [
1049	'{{WRAPPER}} .king-addons-blog-posts-image' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1050	]
1051	]
1052	);
1053
1054	$this->add_responsive_control(
1055	'kng_blog_posts_image_margin',
1056	[
1057	'label' => esc_html__('Margin', 'king-addons'),
1058	'type' => Controls_Manager::DIMENSIONS,
1059	'size_units' => ['px', '%'],
1060	'default' => [
1061	'top' => 0,
1062	'right' => 0,
1063	'bottom' => 0,
1064	'left' => 0,
1065	'unit' => 'px',
1066	],
1067	'selectors' => [
1068	'{{WRAPPER}} .king-addons-blog-posts-image' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1069	]
1070	]
1071	);
1072
1073	$this->add_group_control(
1074	Group_Control_Box_Shadow::get_type(),
1075	[
1076	'name' => 'kng_blog_posts_image_box_shadow',
1077	'selector' => '{{WRAPPER}} .king-addons-blog-posts-image',
1078	]
1079	);
1080
1081	$this->add_group_control(
1082	Group_Control_Border::get_type(),
1083	[
1084	'name' => 'kng_blog_posts_image_border',
1085	'selector' => '{{WRAPPER}} .king-addons-blog-posts-image',
1086	'fields_options' => [
1087	'border' => [
1088	'default' => 'none',
1089	],
1090	],
1091	]
1092	);
1093
1094	$this->add_responsive_control(
1095	'kng_blog_posts_image_border_radius',
1096	[
1097	'label' => esc_html__('Border Radius', 'king-addons'),
1098	'type' => Controls_Manager::DIMENSIONS,
1099	'size_units' => ['px', '%'],
1100	'default' => [
1101	'top' => 0,
1102	'right' => 0,
1103	'bottom' => 0,
1104	'left' => 0,
1105	'unit' => 'px',
1106	],
1107	'selectors' => [
1108	'{{WRAPPER}} .king-addons-blog-posts-image' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1109	]
1110	]
1111	);
1112
1113	$this->end_controls_section();
1114
1115	$this->start_controls_section(
1116	'kng_blog_posts_style_section_title',
1117	[
1118	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Title', 'king-addons'),
1119	'tab' => Controls_Manager::TAB_STYLE,
1120	]
1121	);
1122
1123	$this->add_group_control(
1124	Group_Control_Typography::get_type(),
1125	[
1126	'name' => 'kng_blog_posts_title_typography',
1127	'selector' => '{{WRAPPER}} .king-addons-blog-posts-title',
1128	]
1129	);
1130
1131	$this->add_control(
1132	'kng_blog_posts_title_txt_color',
1133	[
1134	'label' => esc_html__('Text Color', 'king-addons'),
1135	'type' => Controls_Manager::COLOR,
1136	'default' => '',
1137	'selectors' => [
1138	'{{WRAPPER}} .king-addons-blog-posts-title' => 'color: {{VALUE}}'
1139	],
1140	]
1141	);
1142
1143	$this->add_control(
1144	'kng_blog_posts_title_txt_color_hover',
1145	[
1146	'label' => esc_html__('Text Color on hover', 'king-addons'),
1147	'type' => Controls_Manager::COLOR,
1148	'default' => '',
1149	'selectors' => [
1150	'{{WRAPPER}} .king-addons-blog-posts-title:hover' => 'color: {{VALUE}}'
1151	],
1152	]
1153	);
1154
1155	$this->add_responsive_control(
1156	'kng_blog_posts_title_txt_color_transition',
1157	[
1158	'label' => esc_html__('Transition duration on hover (ms)', 'king-addons'),
1159	'type' => Controls_Manager::NUMBER,
1160	'min' => 0,
1161	'step' => 10,
1162	'default' => 300,
1163	'selectors' => [
1164	'{{WRAPPER}} .king-addons-blog-posts-title' => 'transition: color {{SIZE}}ms;'
1165	],
1166	]
1167	);
1168
1169	$this->add_control(
1170	'kng_blog_posts_title_bg_color',
1171	[
1172	'label' => esc_html__('Background Color', 'king-addons'),
1173	'type' => Controls_Manager::COLOR,
1174	'default' => '',
1175	'selectors' => [
1176	'{{WRAPPER}} .king-addons-blog-posts-title' => 'background-color: {{VALUE}}',
1177	],
1178	]
1179	);
1180
1181	$this->add_control(
1182	'kng_blog_posts_title_txt_align',
1183	[
1184	'label' => esc_html__('Text Align', 'king-addons'),
1185	'type' => Controls_Manager::CHOOSE,
1186	'default' => 'center',
1187	'options' => [
1188	'left' => [
1189	'title' => esc_html__('Left', 'king-addons'),
1190	'icon' => 'eicon-h-align-left',
1191	],
1192	'center' => [
1193	'title' => esc_html__('Center', 'king-addons'),
1194	'icon' => 'eicon-h-align-center',
1195	],
1196	'right' => [
1197	'title' => esc_html__('Right', 'king-addons'),
1198	'icon' => 'eicon-h-align-right',
1199	],
1200	],
1201	'selectors' => [
1202	'{{WRAPPER}} .king-addons-blog-posts-title' => 'text-align: {{VALUE}};',
1203	]
1204	]
1205	);
1206
1207	$this->add_responsive_control(
1208	'kng_blog_posts_title_padding',
1209	[
1210	'label' => esc_html__('Padding', 'king-addons'),
1211	'type' => Controls_Manager::DIMENSIONS,
1212	'size_units' => ['px', '%'],
1213	'default' => [
1214	'top' => 10,
1215	'right' => 10,
1216	'bottom' => 10,
1217	'left' => 10,
1218	'unit' => 'px',
1219	],
1220	'selectors' => [
1221	'{{WRAPPER}} .king-addons-blog-posts-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1222	]
1223	]
1224	);
1225
1226	$this->add_responsive_control(
1227	'kng_blog_posts_title_margin',
1228	[
1229	'label' => esc_html__('Margin', 'king-addons'),
1230	'type' => Controls_Manager::DIMENSIONS,
1231	'size_units' => ['px', '%'],
1232	'default' => [
1233	'top' => 0,
1234	'right' => 0,
1235	'bottom' => 0,
1236	'left' => 0,
1237	'unit' => 'px',
1238	],
1239	'selectors' => [
1240	'{{WRAPPER}} .king-addons-blog-posts-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1241	]
1242	]
1243	);
1244
1245	$this->add_group_control(
1246	Group_Control_Box_Shadow::get_type(),
1247	[
1248	'name' => 'kng_blog_posts_title_box_shadow',
1249	'selector' => '{{WRAPPER}} .king-addons-blog-posts-title',
1250	]
1251	);
1252
1253	$this->add_group_control(
1254	Group_Control_Border::get_type(),
1255	[
1256	'name' => 'kng_blog_posts_title_border',
1257	'selector' => '{{WRAPPER}} .king-addons-blog-posts-title',
1258	'fields_options' => [
1259	'border' => [
1260	'default' => 'none',
1261	],
1262	],
1263	]
1264	);
1265
1266	$this->add_responsive_control(
1267	'kng_blog_posts_title_border_radius',
1268	[
1269	'label' => esc_html__('Border Radius', 'king-addons'),
1270	'type' => Controls_Manager::DIMENSIONS,
1271	'size_units' => ['px', '%'],
1272	'default' => [
1273	'top' => 0,
1274	'right' => 0,
1275	'bottom' => 0,
1276	'left' => 0,
1277	'unit' => 'px',
1278	],
1279	'selectors' => [
1280	'{{WRAPPER}} .king-addons-blog-posts-title' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1281	]
1282	]
1283	);
1284
1285	$this->end_controls_section();
1286
1287	$this->start_controls_section(
1288	'kng_blog_posts_style_section_description',
1289	[
1290	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Description', 'king-addons'),
1291	'tab' => Controls_Manager::TAB_STYLE,
1292	]
1293	);
1294
1295	$this->add_group_control(
1296	Group_Control_Typography::get_type(),
1297	[
1298	'name' => 'kng_blog_posts_description_typography',
1299	'selector' => '{{WRAPPER}} .king-addons-blog-posts-description, {{WRAPPER}} .king-addons-blog-posts-description:hover',
1300	]
1301	);
1302
1303	$this->add_control(
1304	'kng_blog_posts_description_txt_color',
1305	[
1306	'label' => esc_html__('Text Color', 'king-addons'),
1307	'type' => Controls_Manager::COLOR,
1308	'default' => '#000000',
1309	'selectors' => [
1310	'{{WRAPPER}} .king-addons-blog-posts-description, {{WRAPPER}} .king-addons-blog-posts-description:hover' => 'color: {{VALUE}}'
1311	],
1312	]
1313	);
1314
1315	$this->add_control(
1316	'kng_blog_posts_description_bg_color',
1317	[
1318	'label' => esc_html__('Background Color', 'king-addons'),
1319	'type' => Controls_Manager::COLOR,
1320	'default' => '',
1321	'selectors' => [
1322	'{{WRAPPER}} .king-addons-blog-posts-description, {{WRAPPER}} .king-addons-blog-posts-description:hover' => 'background-color: {{VALUE}}',
1323	],
1324	]
1325	);
1326
1327	$this->add_control(
1328	'kng_blog_posts_description_txt_align',
1329	[
1330	'label' => esc_html__('Text Align', 'king-addons'),
1331	'type' => Controls_Manager::CHOOSE,
1332	'default' => 'center',
1333	'options' => [
1334	'left' => [
1335	'title' => esc_html__('Left', 'king-addons'),
1336	'icon' => 'eicon-h-align-left',
1337	],
1338	'center' => [
1339	'title' => esc_html__('Center', 'king-addons'),
1340	'icon' => 'eicon-h-align-center',
1341	],
1342	'right' => [
1343	'title' => esc_html__('Right', 'king-addons'),
1344	'icon' => 'eicon-h-align-right',
1345	],
1346	],
1347	'selectors' => [
1348	'{{WRAPPER}} .king-addons-blog-posts-description, {{WRAPPER}} .king-addons-blog-posts-description:hover' => 'text-align: {{VALUE}};',
1349	]
1350	]
1351	);
1352
1353	$this->add_responsive_control(
1354	'kng_blog_posts_description_padding',
1355	[
1356	'label' => esc_html__('Padding', 'king-addons'),
1357	'type' => Controls_Manager::DIMENSIONS,
1358	'size_units' => ['px', '%'],
1359	'default' => [
1360	'top' => 10,
1361	'right' => 10,
1362	'bottom' => 10,
1363	'left' => 10,
1364	'unit' => 'px',
1365	],
1366	'selectors' => [
1367	'{{WRAPPER}} .king-addons-blog-posts-description, {{WRAPPER}} .king-addons-blog-posts-description:hover' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1368	]
1369	]
1370	);
1371
1372	$this->add_responsive_control(
1373	'kng_blog_posts_description_margin',
1374	[
1375	'label' => esc_html__('Margin', 'king-addons'),
1376	'type' => Controls_Manager::DIMENSIONS,
1377	'size_units' => ['px', '%'],
1378	'default' => [
1379	'top' => 0,
1380	'right' => 0,
1381	'bottom' => 0,
1382	'left' => 0,
1383	'unit' => 'px',
1384	],
1385	'selectors' => [
1386	'{{WRAPPER}} .king-addons-blog-posts-description, {{WRAPPER}} .king-addons-blog-posts-description:hover' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1387	]
1388	]
1389	);
1390
1391	$this->add_group_control(
1392	Group_Control_Box_Shadow::get_type(),
1393	[
1394	'name' => 'kng_blog_posts_description_box_shadow',
1395	'selector' => '{{WRAPPER}} .king-addons-blog-posts-description, {{WRAPPER}} .king-addons-blog-posts-description:hover',
1396	]
1397	);
1398
1399	$this->add_group_control(
1400	Group_Control_Border::get_type(),
1401	[
1402	'name' => 'kng_blog_posts_description_border',
1403	'selector' => '{{WRAPPER}} .king-addons-blog-posts-description, {{WRAPPER}} .king-addons-blog-posts-description:hover',
1404	'fields_options' => [
1405	'border' => [
1406	'default' => 'none',
1407	],
1408	],
1409	]
1410	);
1411
1412	$this->add_responsive_control(
1413	'kng_blog_posts_description_border_radius',
1414	[
1415	'label' => esc_html__('Border Radius', 'king-addons'),
1416	'type' => Controls_Manager::DIMENSIONS,
1417	'size_units' => ['px', '%'],
1418	'default' => [
1419	'top' => 0,
1420	'right' => 0,
1421	'bottom' => 0,
1422	'left' => 0,
1423	'unit' => 'px',
1424	],
1425	'selectors' => [
1426	'{{WRAPPER}} .king-addons-blog-posts-description, {{WRAPPER}} .king-addons-blog-posts-description:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1427	]
1428	]
1429	);
1430
1431	$this->end_controls_section();
1432
1433	/** START SECTION: Navigation */
1434	$this->start_controls_section(
1435	'kng_blog_posts_style_section_nav',
1436	[
1437	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Navigation', 'king-addons'),
1438	'tab' => Controls_Manager::TAB_STYLE,
1439	]
1440	);
1441
1442	$this->add_control(
1443	'kng_blog_posts_nav_icon_prev_title',
1444	[
1445	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Previous button', 'king-addons'),
1446	'type' => Controls_Manager::HEADING,
1447	]
1448	);
1449
1450	$this->add_control(
1451	'kng_blog_posts_nav_icon_prev',
1452	[
1453	'label' => esc_html__('Icon', 'king-addons'),
1454	'type' => Controls_Manager::ICONS,
1455	'skin' => 'inline',
1456	'label_block' => false,
1457	'default' => [
1458	'value' => 'fas fa-chevron-left',
1459	'library' => 'fa-solid',
1460	],
1461	]
1462	);
1463
1464	$this->add_responsive_control(
1465	'kng_blog_posts_nav_margin_prev',
1466	[
1467	'label' => esc_html__('Margin', 'king-addons'),
1468	'type' => Controls_Manager::DIMENSIONS,
1469	'size_units' => ['px'],
1470	'default' => [
1471	'top' => 0,
1472	'right' => 0,
1473	'bottom' => 0,
1474	'left' => 0,
1475	'unit' => 'px',
1476	'isLinked' => false
1477	],
1478	'selectors' => [
1479	'{{WRAPPER}} .king-addons-blog-posts-nav-prev .king-addons-blog-posts-nav-inner' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1480	]
1481	]
1482	);
1483
1484
1485	$this->add_responsive_control(
1486	'kng_blog_posts_nav_prev_transform_scale',
1487	[
1488	'label' => esc_html__('Scale on hover (%)', 'king-addons'),
1489	'type' => Controls_Manager::NUMBER,
1490	'step' => 0.1,
1491	'min' => 0,
1492	'default' => 1.3,
1493	'selectors' => [
1494	'{{WRAPPER}} .king-addons-blog-posts-nav-prev:hover .king-addons-blog-posts-nav-inner' => 'transform: scale({{VALUE}});',
1495	],
1496	]
1497	);
1498
1499	$this->add_responsive_control(
1500	'kng_blog_posts_nav_position_v_prev',
1501	[
1502	'type' => Controls_Manager::SLIDER,
1503	'label' => esc_html__('Vertical position (%)', 'king-addons'),
1504	'size_units' => ['%'],
1505	'range' => [
1506	'%' => [
1507	'min' => 0,
1508	'max' => 100,
1509	],
1510	],
1511	'default' => [
1512	'unit' => '%',
1513	'size' => 50,
1514	],
1515	'selectors' => [
1516	'{{WRAPPER}} .king-addons-blog-posts-nav-prev' => 'top: {{SIZE}}{{UNIT}};',
1517	],
1518	]
1519	);
1520
1521	$this->add_responsive_control(
1522	'kng_blog_posts_nav_position_h_prev',
1523	[
1524	'type' => Controls_Manager::SLIDER,
1525	'label' => esc_html__('Horizontal position (%)', 'king-addons'),
1526	'size_units' => ['%'],
1527	'range' => [
1528	'%' => [
1529	'min' => 0,
1530	'max' => 100,
1531	],
1532	],
1533	'default' => [
1534	'unit' => '%',
1535	'size' => 0,
1536	],
1537	'selectors' => [
1538	'{{WRAPPER}} .king-addons-blog-posts-nav-prev' => 'left: {{SIZE}}{{UNIT}};',
1539	],
1540	]
1541	);
1542
1543	$this->add_control(
1544	'kng_blog_posts_nav_icon_next_title',
1545	[
1546	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Next button', 'king-addons'),
1547	'type' => Controls_Manager::HEADING,
1548	'separator' => 'before',
1549	]
1550	);
1551
1552	$this->add_control(
1553	'kng_blog_posts_nav_icon_next',
1554	[
1555	'label' => esc_html__('Icon', 'king-addons'),
1556	'type' => Controls_Manager::ICONS,
1557	'skin' => 'inline',
1558	'label_block' => false,
1559	'default' => [
1560	'value' => 'fas fa-chevron-right',
1561	'library' => 'fa-solid',
1562	],
1563	]
1564	);
1565
1566	$this->add_responsive_control(
1567	'kng_blog_posts_nav_margin_next',
1568	[
1569	'label' => esc_html__('Margin', 'king-addons'),
1570	'type' => Controls_Manager::DIMENSIONS,
1571	'size_units' => ['px'],
1572	'default' => [
1573	'top' => 0,
1574	'right' => 0,
1575	'bottom' => 0,
1576	'left' => 0,
1577	'unit' => 'px',
1578	'isLinked' => false
1579	],
1580	'selectors' => [
1581	'{{WRAPPER}} .king-addons-blog-posts-nav-next .king-addons-blog-posts-nav-inner' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1582	]
1583	]
1584	);
1585
1586	$this->add_responsive_control(
1587	'kng_blog_posts_nav_next_transform_scale',
1588	[
1589	'label' => esc_html__('Scale on hover (%)', 'king-addons'),
1590	'type' => Controls_Manager::NUMBER,
1591	'step' => 0.1,
1592	'min' => 0,
1593	'default' => 1.3,
1594	'selectors' => [
1595	'{{WRAPPER}} .king-addons-blog-posts-nav-next:hover .king-addons-blog-posts-nav-inner' => 'transform: scale({{VALUE}});',
1596	],
1597	]
1598	);
1599
1600	$this->add_responsive_control(
1601	'kng_blog_posts_nav_position_v_next',
1602	[
1603	'type' => Controls_Manager::SLIDER,
1604	'label' => esc_html__('Vertical position (%)', 'king-addons'),
1605	'size_units' => ['%'],
1606	'range' => [
1607	'%' => [
1608	'min' => 0,
1609	'max' => 100,
1610	],
1611	],
1612	'default' => [
1613	'unit' => '%',
1614	'size' => 50,
1615	],
1616	'selectors' => [
1617	'{{WRAPPER}} .king-addons-blog-posts-nav-next' => 'top: {{SIZE}}{{UNIT}};',
1618	],
1619	]
1620	);
1621
1622	$this->add_responsive_control(
1623	'kng_blog_posts_nav_position_h_next',
1624	[
1625	'type' => Controls_Manager::SLIDER,
1626	'label' => esc_html__('Horizontal position (%)', 'king-addons'),
1627	'size_units' => ['%'],
1628	'range' => [
1629	'%' => [
1630	'min' => 0,
1631	'max' => 100,
1632	],
1633	],
1634	'default' => [
1635	'unit' => '%',
1636	'size' => 100,
1637	],
1638	'selectors' => [
1639	'{{WRAPPER}} .king-addons-blog-posts-nav-next' => 'right: calc(100% - {{SIZE}}{{UNIT}});',
1640	],
1641	]
1642	);
1643
1644	// common
1645	$this->add_control(
1646	'kng_blog_posts_nav_icon_common_title',
1647	[
1648	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Common settings', 'king-addons'),
1649	'type' => Controls_Manager::HEADING,
1650	'separator' => 'before',
1651	]
1652	);
1653
1654	$this->add_responsive_control(
1655	'kng_blog_posts_nav_icon_size',
1656	[
1657	'label' => esc_html__('Icon Size', 'king-addons'),
1658	'type' => Controls_Manager::NUMBER,
1659	'step' => 1,
1660	'min' => 0,
1661	'default' => 32,
1662	'selectors' => [
1663	'{{WRAPPER}} .king-addons-blog-posts-nav i' => 'font-size: {{VALUE}}px; width: {{VALUE}}px;',
1664	'{{WRAPPER}} .king-addons-blog-posts-nav img' => 'width: {{VALUE}}px; height: {{VALUE}}px;',
1665	'{{WRAPPER}} .king-addons-blog-posts-nav svg' => 'width: {{VALUE}}px; height: {{VALUE}}px;'
1666	],
1667	]
1668	);
1669
1670	$this->add_responsive_control(
1671	'kng_blog_posts_nav_transition_icon',
1672	[
1673	'label' => esc_html__('Transition duration for icon on hover (ms)', 'king-addons'),
1674	'type' => Controls_Manager::NUMBER,
1675	'min' => 0,
1676	'step' => 10,
1677	'default' => 300,
1678	'selectors' => [
1679	'{{WRAPPER}} .king-addons-blog-posts-nav i' => 'transition: all {{SIZE}}ms;',
1680	'{{WRAPPER}} .king-addons-blog-posts-nav img' => 'transition: all {{SIZE}}ms;',
1681	'{{WRAPPER}} .king-addons-blog-posts-nav svg' => 'transition: all {{SIZE}}ms;',
1682	'{{WRAPPER}} .king-addons-blog-posts-nav .king-addons-blog-posts-nav-inner' => 'transition: all {{SIZE}}ms;',
1683	],
1684	]
1685	);
1686
1687	$this->add_responsive_control(
1688	'kng_blog_posts_nav_padding',
1689	[
1690	'label' => esc_html__('Padding', 'king-addons'),
1691	'type' => Controls_Manager::DIMENSIONS,
1692	'size_units' => ['px', '%'],
1693	'default' => [
1694	'top' => 10,
1695	'right' => 10,
1696	'bottom' => 10,
1697	'left' => 10,
1698	'unit' => 'px',
1699	],
1700	'selectors' => [
1701	'{{WRAPPER}} .king-addons-blog-posts-nav-inner' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1702	]
1703	]
1704	);
1705
1706	$this->start_controls_tabs('kng_blog_posts_nav_tabs');
1707
1708	$this->start_controls_tab(
1709	'kng_blog_posts_nav_tab_normal',
1710	[
1711	'label' => esc_html__('Normal', 'king-addons'),
1712	]
1713	);
1714
1715	$this->add_control(
1716	'kng_blog_posts_nav_color',
1717	[
1718	'label' => esc_html__('Color', 'king-addons'),
1719	'type' => Controls_Manager::COLOR,
1720	'default' => '#00000033',
1721	'selectors' => [
1722	'{{WRAPPER}} .king-addons-blog-posts-nav i' => 'color: {{VALUE}};',
1723	'{{WRAPPER}} .king-addons-blog-posts-nav svg' => 'fill: {{VALUE}};'
1724	],
1725	]
1726	);
1727
1728	$this->add_control(
1729	'kng_blog_posts_nav_bg_color',
1730	[
1731	'label' => esc_html__('Background Color', 'king-addons'),
1732	'type' => Controls_Manager::COLOR,
1733	'default' => '',
1734	'selectors' => [
1735	'{{WRAPPER}} .king-addons-blog-posts-nav-inner' => 'background-color: {{VALUE}}',
1736	],
1737	]
1738	);
1739
1740	$this->add_group_control(
1741	Group_Control_Box_Shadow::get_type(),
1742	[
1743	'name' => 'kng_blog_posts_nav_box_shadow',
1744	'selector' => '{{WRAPPER}} .king-addons-blog-posts-nav-inner',
1745	]
1746	);
1747
1748	$this->add_group_control(
1749	Group_Control_Border::get_type(),
1750	[
1751	'name' => 'kng_blog_posts_nav_border',
1752	'selector' => '{{WRAPPER}} .king-addons-blog-posts-nav-inner',
1753	'fields_options' => [
1754	'border' => [
1755	'default' => 'none',
1756	],
1757	],
1758	]
1759	);
1760
1761	$this->add_responsive_control(
1762	'kng_blog_posts_nav_border_radius',
1763	[
1764	'label' => esc_html__('Border Radius', 'king-addons'),
1765	'type' => Controls_Manager::DIMENSIONS,
1766	'size_units' => ['px', '%'],
1767	'default' => [
1768	'top' => 100,
1769	'right' => 100,
1770	'bottom' => 100,
1771	'left' => 100,
1772	'unit' => '%',
1773	],
1774	'selectors' => [
1775	'{{WRAPPER}} .king-addons-blog-posts-nav-inner' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1776	]
1777	]
1778	);
1779	$this->end_controls_tab();
1780
1781	$this->start_controls_tab(
1782	'kng_blog_posts_nav_tab_hover',
1783	[
1784	'label' => esc_html__('Hover', 'king-addons'),
1785	]
1786	);
1787
1788	$this->add_control(
1789	'kng_blog_posts_nav_color_hover',
1790	[
1791	'label' => esc_html__('Color', 'king-addons'),
1792	'type' => Controls_Manager::COLOR,
1793	'selectors' => [
1794	'{{WRAPPER}} .king-addons-blog-posts-nav i:hover' => 'color: {{VALUE}};',
1795	'{{WRAPPER}} .king-addons-blog-posts-nav svg:hover' => 'fill: {{VALUE}};'
1796	],
1797	]
1798	);
1799
1800	$this->add_control(
1801	'kng_blog_posts_nav_bg_color_hover',
1802	[
1803	'label' => esc_html__('Background Color', 'king-addons'),
1804	'type' => Controls_Manager::COLOR,
1805	'selectors' => [
1806	'{{WRAPPER}} .king-addons-blog-posts-nav-inner:hover' => 'background-color: {{VALUE}}',
1807	],
1808	]
1809	);
1810
1811	$this->add_group_control(
1812	Group_Control_Box_Shadow::get_type(),
1813	[
1814	'name' => 'kng_blog_posts_nav_box_shadow_hover',
1815	'selector' => '{{WRAPPER}} .king-addons-blog-posts-nav-inner:hover',
1816	]
1817	);
1818
1819	$this->add_group_control(
1820	Group_Control_Border::get_type(),
1821	[
1822	'name' => 'kng_blog_posts_nav_border_hover',
1823	'selector' => '{{WRAPPER}} .king-addons-blog-posts-nav-inner:hover',
1824	]
1825	);
1826
1827	$this->add_responsive_control(
1828	'kng_blog_posts_nav_border_radius_hover',
1829	[
1830	'label' => esc_html__('Border Radius', 'king-addons'),
1831	'type' => Controls_Manager::DIMENSIONS,
1832	'size_units' => ['px', '%'],
1833	'selectors' => [
1834	'{{WRAPPER}} .king-addons-blog-posts-nav-inner:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1835	]
1836	]
1837	);
1838
1839	$this->end_controls_tab();
1840
1841	$this->end_controls_tabs();
1842	$this->end_controls_section();
1843	/** END SECTION: Navigation */
1844
1845	/** SECTION: Pagination */
1846	$this->start_controls_section(
1847	'kng_blog_posts_style_section_pag',
1848	[
1849	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Pagination', 'king-addons'),
1850	'tab' => Controls_Manager::TAB_STYLE,
1851	]
1852	);
1853
1854	$this->add_control(
1855	'kng_blog_posts_pag_color',
1856	[
1857	'label' => esc_html__('Color', 'king-addons'),
1858	'type' => Controls_Manager::COLOR,
1859	'default' => '#000000',
1860	'selectors' => [
1861	'{{WRAPPER}} .king-addons-blog-posts-pagination' => '--swiper-theme-color: {{VALUE}}; --swiper-pagination-fraction-color: {{VALUE}};',
1862	],
1863	]
1864	);
1865
1866	$this->add_control(
1867	'kng_blog_posts_pag_color_second',
1868	[
1869	'label' => esc_html__('Second Color', 'king-addons'),
1870	'type' => Controls_Manager::COLOR,
1871	'default' => '#00000033',
1872	'selectors' => [
1873	'{{WRAPPER}} .king-addons-blog-posts-pagination' => '--swiper-pagination-progressbar-bg-color: {{VALUE}}; --swiper-pagination-bullet-inactive-color: {{VALUE}}; --swiper-pagination-bullet-inactive-opacity: 1;',
1874	],
1875	]
1876	);
1877
1878	$this->add_control(
1879	'kng_blog_posts_pag_bullets_title',
1880	[
1881	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Bullets type', 'king-addons'),
1882	'type' => Controls_Manager::HEADING,
1883	'separator' => 'before',
1884	]
1885	);
1886
1887	$this->add_responsive_control(
1888	'kng_blog_posts_pag_bullets_size',
1889	[
1890	'label' => esc_html__('Size', 'king-addons'),
1891	'type' => Controls_Manager::NUMBER,
1892	'min' => 0,
1893	'step' => 1,
1894	'default' => 8,
1895	'selectors' => [
1896	'{{WRAPPER}} .king-addons-blog-posts-pagination' => '--swiper-pagination-bullet-size: {{SIZE}}px;'
1897	],
1898	]
1899	);
1900
1901	$this->add_responsive_control(
1902	'kng_blog_posts_pag_bullets_gap',
1903	[
1904	'label' => esc_html__('Bullets gap', 'king-addons'),
1905	'type' => Controls_Manager::NUMBER,
1906	'min' => 0,
1907	'step' => 1,
1908	'default' => 4,
1909	'selectors' => [
1910	'{{WRAPPER}} .king-addons-blog-posts-pagination' => '--swiper-pagination-bullet-horizontal-gap: {{SIZE}}px;'
1911	],
1912	]
1913	);
1914
1915	$this->add_control(
1916	'kng_blog_posts_pag_progressbar_title',
1917	[
1918	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Progress bar type', 'king-addons'),
1919	'type' => Controls_Manager::HEADING,
1920	'separator' => 'before',
1921	]
1922	);
1923
1924	$this->add_responsive_control(
1925	'kng_blog_posts_pag_progressbar_size',
1926	[
1927	'label' => esc_html__('Size', 'king-addons'),
1928	'type' => Controls_Manager::NUMBER,
1929	'min' => 0,
1930	'step' => 1,
1931	'default' => 4,
1932	'selectors' => [
1933	'{{WRAPPER}} .king-addons-blog-posts-pagination' => '--swiper-pagination-progressbar-size: {{SIZE}}px;'
1934	],
1935	]
1936	);
1937
1938	$this->add_control(
1939	'kng_blog_posts_pag_fraction_title',
1940	[
1941	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Fraction type', 'king-addons'),
1942	'type' => Controls_Manager::HEADING,
1943	'separator' => 'before',
1944	]
1945	);
1946
1947	$this->add_group_control(
1948	Group_Control_Typography::get_type(),
1949	[
1950	'name' => 'kng_blog_posts_pag_fraction_typography',
1951	'selector' => '{{WRAPPER}} .king-addons-blog-posts-pagination.swiper-pagination-fraction',
1952	]
1953	);
1954
1955	$this->end_controls_section();
1956	/** END SECTION: Pagination */
1957
1958	/** SECTION: Whole Carousel */
1959	$this->start_controls_section(
1960	'kng_blog_posts_style_section_whole_carousel',
1961	[
1962	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Whole Carousel', 'king-addons'),
1963	'tab' => Controls_Manager::TAB_STYLE,
1964	]
1965	);
1966
1967	$this->add_group_control(
1968	Group_Control_Background::get_type(),
1969	[
1970	'name' => 'kng_blog_posts_whole_carousel_bg',
1971	'selector' => '{{WRAPPER}} .king-addons-blog-posts-items'
1972	]
1973	);
1974
1975	$this->add_responsive_control(
1976	'kng_blog_posts_whole_carousel_margin',
1977	[
1978	'label' => esc_html__('Whole carousel margin', 'king-addons'),
1979	'type' => Controls_Manager::DIMENSIONS,
1980	'size_units' => ['px', '%'],
1981	'default' => [
1982	'top' => 0,
1983	'right' => 42,
1984	'bottom' => 10,
1985	'left' => 42,
1986	'unit' => 'px',
1987	],
1988	'tablet_default' => [
1989	'top' => 0,
1990	'right' => 0,
1991	'bottom' => 0,
1992	'left' => 0,
1993	'unit' => 'px',
1994	],
1995	'mobile_default' => [
1996	'top' => 0,
1997	'right' => 0,
1998	'bottom' => 0,
1999	'left' => 0,
2000	'unit' => 'px',
2001	],
2002	'selectors' => [
2003	'{{WRAPPER}} .king-addons-blog-posts-items' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2004	]
2005	]
2006	);
2007
2008	$this->add_responsive_control(
2009	'kng_blog_posts_whole_carousel_margin_wrapper',
2010	[
2011	'label' => esc_html__('Cards wrapper margin', 'king-addons'),
2012	'type' => Controls_Manager::DIMENSIONS,
2013	'size_units' => ['px', '%'],
2014	'default' => [
2015	'top' => 10,
2016	'right' => 0,
2017	'bottom' => 42,
2018	'left' => 0,
2019	'unit' => 'px',
2020	],
2021	'tablet_default' => [
2022	'top' => 10,
2023	'right' => 0,
2024	'bottom' => 42,
2025	'left' => 0,
2026	'unit' => 'px',
2027	],
2028	'mobile_default' => [
2029	'top' => 10,
2030	'right' => 0,
2031	'bottom' => 42,
2032	'left' => 0,
2033	'unit' => 'px',
2034	],
2035	'selectors' => [
2036	'{{WRAPPER}} .king-addons-blog-posts-items .swiper-wrapper' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2037	]
2038	]
2039	);
2040
2041	$this->add_responsive_control(
2042	'kng_blog_posts_whole_carousel_padding',
2043	[
2044	'label' => esc_html__('Padding', 'king-addons'),
2045	'type' => Controls_Manager::DIMENSIONS,
2046	'size_units' => ['px', '%'],
2047	'default' => [
2048	'top' => 0,
2049	'right' => 0,
2050	'bottom' => 0,
2051	'left' => 0,
2052	'unit' => 'px',
2053	],
2054	'selectors' => [
2055	'{{WRAPPER}} .king-addons-blog-posts-items' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2056	]
2057	]
2058	);
2059
2060	$this->add_group_control(
2061	Group_Control_Box_Shadow::get_type(),
2062	[
2063	'name' => 'kng_blog_posts_whole_carousel_box_shadow',
2064	'selector' => '{{WRAPPER}} .king-addons-blog-posts-items',
2065	]
2066	);
2067
2068	$this->add_group_control(
2069	Group_Control_Border::get_type(),
2070	[
2071	'name' => 'kng_blog_posts_whole_carousel_border',
2072	'selector' => '{{WRAPPER}} .king-addons-blog-posts-items',
2073	'fields_options' => [
2074	'border' => [
2075	'default' => 'none',
2076	],
2077	],
2078	]
2079	);
2080
2081	$this->add_responsive_control(
2082	'kng_blog_posts_whole_carousel_border_radius',
2083	[
2084	'label' => esc_html__('Border Radius', 'king-addons'),
2085	'type' => Controls_Manager::DIMENSIONS,
2086	'size_units' => ['px', '%'],
2087	'default' => [
2088	'top' => 0,
2089	'right' => 0,
2090	'bottom' => 0,
2091	'left' => 0,
2092	'unit' => 'px',
2093	],
2094	'selectors' => [
2095	'{{WRAPPER}} .king-addons-blog-posts-items' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2096	]
2097	]
2098	);
2099
2100	$this->end_controls_section();
2101	/** END SECTION: Whole Carousel */
2102
2103	$this->start_controls_section(
2104	'kng_blog_posts_style_section_whole_card',
2105	[
2106	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Whole Card', 'king-addons'),
2107	'tab' => Controls_Manager::TAB_STYLE,
2108	]
2109	);
2110
2111	$this->add_responsive_control(
2112	'kng_blog_posts_whole_card_transition',
2113	[
2114	'label' => esc_html__('Transition duration on card hover (ms)', 'king-addons'),
2115	'type' => Controls_Manager::NUMBER,
2116	'min' => 0,
2117	'step' => 10,
2118	'default' => 300,
2119	'selectors' => [
2120	'{{WRAPPER}} .king-addons-blog-posts-card-inner' => 'transition: all {{SIZE}}ms;'
2121	],
2122	]
2123	);
2124
2125	$this->start_controls_tabs('kng_blog_posts_whole_card_tabs');
2126
2127	$this->start_controls_tab(
2128	'kng_blog_posts_whole_card_tab_normal',
2129	[
2130	'label' => esc_html__('Normal', 'king-addons'),
2131	]
2132	);
2133
2134	$this->add_group_control(
2135	Group_Control_Background::get_type(),
2136	[
2137	'name' => 'kng_blog_posts_whole_card_bg',
2138	'selector' => '{{WRAPPER}} .king-addons-blog-posts-card-inner'
2139	]
2140	);
2141
2142	$this->add_responsive_control(
2143	'kng_blog_posts_whole_card_padding',
2144	[
2145	'label' => esc_html__('Padding', 'king-addons'),
2146	'type' => Controls_Manager::DIMENSIONS,
2147	'size_units' => ['px', '%'],
2148	'default' => [
2149	'top' => 0,
2150	'right' => 0,
2151	'bottom' => 0,
2152	'left' => 0,
2153	'unit' => 'px',
2154	],
2155	'selectors' => [
2156	'{{WRAPPER}} .king-addons-blog-posts-card-inner' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2157	]
2158	]
2159	);
2160
2161	$this->add_group_control(
2162	Group_Control_Box_Shadow::get_type(),
2163	[
2164	'name' => 'kng_blog_posts_whole_card_box_shadow',
2165	'selector' => '{{WRAPPER}} .king-addons-blog-posts-card-inner',
2166	]
2167	);
2168
2169	$this->add_group_control(
2170	Group_Control_Border::get_type(),
2171	[
2172	'name' => 'kng_blog_posts_whole_card_border',
2173	'selector' => '{{WRAPPER}} .king-addons-blog-posts-card-inner',
2174	'fields_options' => [
2175	'border' => [
2176	'default' => 'none',
2177	],
2178	],
2179	]
2180	);
2181
2182	$this->add_responsive_control(
2183	'kng_blog_posts_whole_card_border_radius',
2184	[
2185	'label' => esc_html__('Border Radius', 'king-addons'),
2186	'type' => Controls_Manager::DIMENSIONS,
2187	'size_units' => ['px', '%'],
2188	'default' => [
2189	'top' => 0,
2190	'right' => 0,
2191	'bottom' => 0,
2192	'left' => 0,
2193	'unit' => 'px',
2194	],
2195	'selectors' => [
2196	'{{WRAPPER}} .king-addons-blog-posts-card-inner' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2197	]
2198	]
2199	);
2200
2201	$this->end_controls_tab();
2202
2203	$this->start_controls_tab(
2204	'kng_blog_posts_whole_card_tab_hover',
2205	[
2206	'label' => esc_html__('Hover', 'king-addons'),
2207	]
2208	);
2209
2210	$this->add_group_control(
2211	Group_Control_Background::get_type(),
2212	[
2213	'name' => 'kng_blog_posts_whole_card_bg_hover',
2214	'selector' => '{{WRAPPER}} .king-addons-blog-posts-card-inner:hover'
2215	]
2216	);
2217
2218	$this->add_responsive_control(
2219	'kng_blog_posts_whole_card_padding_hover',
2220	[
2221	'label' => esc_html__('Padding', 'king-addons'),
2222	'type' => Controls_Manager::DIMENSIONS,
2223	'size_units' => ['px', '%'],
2224	'selectors' => [
2225	'{{WRAPPER}} .king-addons-blog-posts-card-inner:hover' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2226	]
2227	]
2228	);
2229
2230	$this->add_group_control(
2231	Group_Control_Box_Shadow::get_type(),
2232	[
2233	'name' => 'kng_blog_posts_whole_card_box_shadow_hover',
2234	'selector' => '{{WRAPPER}} .king-addons-blog-posts-card-inner:hover',
2235	]
2236	);
2237
2238	$this->add_group_control(
2239	Group_Control_Border::get_type(),
2240	[
2241	'name' => 'kng_blog_posts_whole_card_border_hover',
2242	'selector' => '{{WRAPPER}} .king-addons-blog-posts-card-inner:hover',
2243	]
2244	);
2245
2246	$this->add_responsive_control(
2247	'kng_blog_posts_whole_card_border_radius_hover',
2248	[
2249	'label' => esc_html__('Border Radius', 'king-addons'),
2250	'type' => Controls_Manager::DIMENSIONS,
2251	'size_units' => ['px', '%'],
2252	'selectors' => [
2253	'{{WRAPPER}} .king-addons-blog-posts-card-inner:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2254	]
2255	]
2256	);
2257
2258	$this->end_controls_tab();
2259	$this->end_controls_tabs();
2260	$this->end_controls_section();
2261
2262	$this->start_controls_section(
2263	'kng_blog_posts_style_section_whole_text_container',
2264	[
2265	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Whole Text Container', 'king-addons'),
2266	'tab' => Controls_Manager::TAB_STYLE,
2267	]
2268	);
2269
2270	$this->add_control(
2271	'kng_blog_posts_style_section_whole_text_container_title',
2272	[
2273	'label' => '<span class="elementor-control-field-description">' .
2274	esc_html__('Text container includes title and description.', 'king-addons') .
2275	'</span>',
2276	'type' => Controls_Manager::RAW_HTML,
2277	]
2278	);
2279
2280	$this->add_responsive_control(
2281	'kng_blog_posts_whole_text_container_bg_color',
2282	[
2283	'label' => esc_html__('Background Color', 'king-addons'),
2284	'type' => Controls_Manager::COLOR,
2285	'default' => '',
2286	'selectors' => [
2287	'{{WRAPPER}} .king-addons-blog-posts-card-container-2' => 'background-color: {{VALUE}}',
2288	],
2289	]
2290	);
2291
2292	$this->add_responsive_control(
2293	'kng_blog_posts_whole_text_container_padding',
2294	[
2295	'label' => esc_html__('Padding', 'king-addons'),
2296	'type' => Controls_Manager::DIMENSIONS,
2297	'size_units' => ['px', '%'],
2298	'default' => [
2299	'top' => 0,
2300	'right' => 0,
2301	'bottom' => 0,
2302	'left' => 0,
2303	'unit' => 'px',
2304	],
2305	'selectors' => [
2306	'{{WRAPPER}} .king-addons-blog-posts-card-container-2' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2307	]
2308	]
2309	);
2310
2311	$this->add_responsive_control(
2312	'kng_blog_posts_whole_text_container_margin',
2313	[
2314	'label' => esc_html__('Margin', 'king-addons'),
2315	'type' => Controls_Manager::DIMENSIONS,
2316	'size_units' => ['px', '%'],
2317	'default' => [
2318	'top' => 0,
2319	'right' => 0,
2320	'bottom' => 0,
2321	'left' => 0,
2322	'unit' => 'px',
2323	],
2324	'selectors' => [
2325	'{{WRAPPER}} .king-addons-blog-posts-card-container-2' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2326	]
2327	]
2328	);
2329
2330	$this->add_group_control(
2331	Group_Control_Box_Shadow::get_type(),
2332	[
2333	'name' => 'kng_blog_posts_whole_text_container_box_shadow',
2334	'selector' => '{{WRAPPER}} .king-addons-blog-posts-card-container-2',
2335	]
2336	);
2337
2338	$this->add_group_control(
2339	Group_Control_Border::get_type(),
2340	[
2341	'name' => 'kng_blog_posts_whole_text_container_border',
2342	'selector' => '{{WRAPPER}} .king-addons-blog-posts-card-container-2',
2343	'fields_options' => [
2344	'border' => [
2345	'default' => 'none',
2346	],
2347	],
2348	]
2349	);
2350
2351	$this->add_responsive_control(
2352	'kng_blog_posts_whole_text_container_border_radius',
2353	[
2354	'label' => esc_html__('Border Radius', 'king-addons'),
2355	'type' => Controls_Manager::DIMENSIONS,
2356	'size_units' => ['px', '%'],
2357	'default' => [
2358	'top' => 0,
2359	'right' => 0,
2360	'bottom' => 0,
2361	'left' => 0,
2362	'unit' => 'px',
2363	],
2364	'selectors' => [
2365	'{{WRAPPER}} .king-addons-blog-posts-card-container-2' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2366	]
2367	]
2368	);
2369
2370	$this->end_controls_section();
2371
2372	/** END TAB: STYLE ===================== */
2373	}
2374
2375	protected function render(): void
2376	{
2377	$settings = $this->get_settings();
2378	$this_ID = $this->get_id();
2379
2380	$query_args = [
2381	'posts_per_page' => $settings['kng_blog_posts_number_of_posts'],
2382	'post_type' => 'post',
2383	'post_status' => 'publish',
2384	'ignore_sticky_posts' => 'yes' === $settings['kng_blog_posts_ignore_sticky_posts_switcher'],
2385	];
2386
2387	$query = new WP_Query($query_args);
2388
2389	/** START: BLOG POSTS===================== */
2390	?>
2391	<div class="king-addons-blog-posts-items-wrap">
2392	<div class="king-addons-blog-posts-items king-addons-blog-posts-items-<?php echo esc_attr($this_ID); ?> swiper-container swiper">
2393	<div class="swiper-wrapper<?php if ('yes' === $settings['kng_blog_posts_autoplay_like_ticker_switcher']) {
2394	echo ' king-addons-blog-posts-autoplay-like-ticker';
2395	} ?>">
2396	<?php
2397	/** Blog Item */
2398
2399	if ($query->have_posts()) {
2400
2401	while ($query->have_posts()) {
2402
2403	$query->the_post();
2404
2405	global $post;
2406
2407	$excerpt = $post->post_excerpt ? wp_trim_words($post->post_excerpt, $settings['kng_blog_posts_number_of_words'], '...') : wp_trim_words($post->post_content, $settings['kng_blog_posts_number_of_words'], '...');
2408
2409	/** open card div */
2410	echo '<div class="swiper-slide king-addons-blog-posts-card king-addons-blog-posts-cursor-pointer">';
2411
2412	/** open inner div */
2413	echo '<div class="king-addons-blog-posts-card-inner">';
2414	echo '<a href="' . esc_url(get_permalink($post->ID)) . '">';
2415
2416	// CONTAINER 1
2417	if ('yes' !== $settings['kng_blog_posts_cards_image_switcher']) {
2418	if (has_post_thumbnail($post->ID)) {
2419	echo '<div class="king-addons-blog-posts-card-container-1">';
2420
2421	// image
2422	echo '<div class="king-addons-blog-posts-image">';
2423	echo '<img src="' . esc_url(get_the_post_thumbnail_url($post->ID, $settings['kng_blog_posts_image_size'])) . '" alt="' . esc_attr($post->post_title) . '">';
2424	echo '</div>';
2425
2426	echo '</div>';
2427	}
2428	}
2429	// END CONTAINER 1
2430
2431	// CONTAINER 2
2432	if ('yes' !== $settings['kng_blog_posts_cards_whole_text_container_switcher']) {
2433	echo '<div class="king-addons-blog-posts-card-container-2">';
2434
2435	// post title
2436	if ('yes' !== $settings['kng_blog_posts_cards_title_switcher']) {
2437	echo '<div class="king-addons-blog-posts-title">';
2438	echo esc_html($post->post_title);
2439	echo '</div>';
2440	}
2441
2442	// post description
2443	if ('yes' !== $settings['kng_blog_posts_cards_description_switcher']) {
2444	echo '<div class="king-addons-blog-posts-description">';
2445	echo esc_html($excerpt);
2446	echo '</div>';
2447	}
2448	echo '</div>';
2449	}
2450	// END CONTAINER 2
2451
2452	echo '</a>';
2453	/** close card inner div */
2454	echo '</div>';
2455
2456	/** close card div */
2457	echo '</div>';
2458	}
2459	wp_reset_postdata();
2460	}
2461	/** END: Blog Item */
2462	?>
2463	</div>
2464	</div>
2465	<?php
2466
2467	// pagination
2468	if ('yes' === $settings['kng_blog_posts_pag_switcher']) {
2469	echo '<div class="swiper-pagination king-addons-blog-posts-pagination king-addons-blog-posts-pagination-' .
2470	esc_attr($this_ID) .
2471	(('yes' === $settings['kng_blog_posts_autoplay_like_ticker_switcher']) ? ' king-addons-blog-posts-autoplay-like-ticker-pag' : '') .
2472	'"></div>';
2473	}
2474
2475	// navigation
2476	if ('yes' === $settings['kng_blog_posts_nav_switcher']) {
2477
2478	echo '<div class="king-addons-blog-posts-nav-prev king-addons-blog-posts-nav-prev-' . esc_attr($this_ID) . ' king-addons-blog-posts-nav">';
2479	echo '<div class="king-addons-blog-posts-nav-inner">';
2480	Icons_Manager::render_icon($settings['kng_blog_posts_nav_icon_prev']);
2481	echo '</div>';
2482	echo '</div>';
2483
2484	echo '<div class="king-addons-blog-posts-nav-next king-addons-blog-posts-nav-next-' . esc_attr($this_ID) . ' king-addons-blog-posts-nav">';
2485	echo '<div class="king-addons-blog-posts-nav-inner">';
2486	Icons_Manager::render_icon($settings['kng_blog_posts_nav_icon_next']);
2487	echo '</div>';
2488	echo '</div>';
2489
2490	}
2491	?>
2492	</div>
2493	<?php
2494
2495	$js_swiper_check_if_DOM_already_loaded = "document.readyState === 'complete'";
2496	$js_swiper_check_if_DOM_not_already_loaded = "window.addEventListener('load', function () {";
2497
2498	$js_swiper = "new Swiper('.king-addons-blog-posts-items-" . esc_js($this_ID) . "', {";
2499	$js_swiper .= "direction: 'horizontal',";
2500
2501	$js_swiper .= "slidesPerView: " . esc_js($settings['kng_blog_posts_desktop_cards_per_view']) . ",";
2502	$js_swiper .= "spaceBetween: " . esc_js($settings['kng_blog_posts_desktop_space_between_cards']) . ",";
2503
2504	// Responsive breakpoints
2505	$js_swiper .= 'breakpoints: {0: {slidesPerView: ' .
2506	esc_js($settings['kng_blog_posts_mobile_cards_per_view']) . ', spaceBetween: ' .
2507	esc_js($settings['kng_blog_posts_mobile_space_between_cards']) . '}, ';
2508	$js_swiper .=
2509	esc_js(($settings['kng_blog_posts_mobile_breakpoint'] + 1)) . ': {slidesPerView: ' .
2510	esc_js($settings['kng_blog_posts_tablet_cards_per_view']) . ', spaceBetween: ' .
2511	esc_js($settings['kng_blog_posts_tablet_space_between_cards']) . '}, ';
2512	$js_swiper .=
2513	esc_js(($settings['kng_blog_posts_tablet_breakpoint'] + 1)) . ': {slidesPerView: ' .
2514	esc_js($settings['kng_blog_posts_desktop_cards_per_view']) . ', spaceBetween: ' .
2515	esc_js($settings['kng_blog_posts_desktop_space_between_cards']) . '}},';
2516
2517	// Scrolling speed
2518	if ('yes' !== $settings['kng_blog_posts_autoplay_like_ticker_switcher']) {
2519	$js_swiper .= "speed: " . esc_js($settings['kng_blog_posts_scrolling_speed']) . ",";
2520	} else {
2521	$js_swiper .= "speed: " . esc_js($settings['kng_blog_posts_autoplay_like_ticker_autoplay_speed']) . ",";
2522	}
2523
2524	// Pagination
2525	if ('yes' === $settings['kng_blog_posts_pag_switcher']) {
2526	$js_swiper .= "pagination: {el: '.king-addons-blog-posts-pagination-" .
2527	esc_js($this_ID) . "', " .
2528	('yes' === $settings['kng_blog_posts_pag_clickable_switcher'] ? 'clickable: true, ' : '');
2529	if ('yes' === $settings['kng_blog_posts_pag_dynamic_switcher']) {
2530	$js_swiper .= 'dynamicBullets: true, ';
2531	$js_swiper .= 'dynamicMainBullets: ' . esc_js($settings['kng_blog_posts_pag_dynamic_number'] . ', ');
2532	}
2533	$js_swiper .= "type: '" . esc_js($settings['kng_blog_posts_pag_type']) . "'},";
2534	}
2535
2536	// Navigation
2537	if ('yes' === $settings['kng_blog_posts_nav_switcher']) {
2538	$js_swiper .= "navigation: {nextEl: '.king-addons-blog-posts-nav-next-" .
2539	esc_js($this_ID) . "', prevEl: '.king-addons-blog-posts-nav-prev-" .
2540	esc_js($this_ID) . "'},";
2541	}
2542
2543	// Loop
2544	if ('yes' === $settings['kng_blog_posts_loop_switcher']) {
2545	$js_swiper .= "loop: true,";
2546	}
2547
2548	// Rewind
2549	if ('yes' === $settings['kng_blog_posts_rewind_switcher']) {
2550	$js_swiper .= "rewind: true,";
2551	}
2552
2553	// Autoplay
2554	if ('yes' === $settings['kng_blog_posts_autoplay_switcher']) {
2555	$js_swiper .= "autoplay: {";
2556	if ('yes' !== $settings['kng_blog_posts_autoplay_like_ticker_switcher']) {
2557	$js_swiper .= "delay: " . esc_js($settings['kng_blog_posts_autoplay_delay']) . ",";
2558	} else {
2559	$js_swiper .= "delay: 0,";
2560	}
2561	$js_swiper .= "disableOnInteraction: " . ('yes' === $settings['kng_blog_posts_autoplay_disableoninteraction_switcher'] ? 'true' : 'false') . ",";
2562	$js_swiper .= "pauseOnMouseEnter: " . ('yes' === $settings['kng_blog_posts_autoplay_pausedonmouseenter_switcher'] ? 'true' : 'false') . ",";
2563	$js_swiper .= "reverseDirection: " . ('yes' === $settings['kng_blog_posts_autoplay_reversedirection_switcher'] ? 'true' : 'false') . ",";
2564	$js_swiper .= "},";
2565	}
2566
2567	$js_swiper .= "})";
2568
2569	$js_swiper_full = $js_swiper_check_if_DOM_already_loaded . ' ?' . $js_swiper . ' : ' . $js_swiper_check_if_DOM_not_already_loaded . $js_swiper . '; });';
2570
2571	wp_print_inline_script_tag($js_swiper_full);
2572	/** END: BLOG POSTS ===================== */
2573	}
2574	}