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

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

1,836 lines 52.4 KB

Raw Download Zip

1	<?php
2
3	namespace UltimatePostKit\Modules\AlterGrid\Widgets;
4
5	use Elementor\Controls_Manager;
6	use Elementor\Group_Control_Border;
7	use Elementor\Group_Control_Box_Shadow;
8	use Elementor\Group_Control_Typography;
9	use Elementor\Group_Control_Text_Shadow;
10	use Elementor\Group_Control_Image_Size;
11	use Elementor\Group_Control_Background;
12	use Elementor\Icons_Manager;
13
14	use UltimatePostKit\Traits\Global_Widget_Controls;
15	use UltimatePostKit\Traits\Global_Widget_Functions;
16	use UltimatePostKit\Includes\Controls\GroupQuery\Group_Control_Query;
17	use WP_Query;
18
19	if (!defined('ABSPATH')) {
20	exit;
21	} // Exit if accessed directly
22
23	class Alter_Grid extends Group_Control_Query {
24
25	use Global_Widget_Controls;
26	use Global_Widget_Functions;
27
28	private $_query = null;
29
30	public function get_name() {
31	return 'upk-alter-grid';
32	}
33
34	public function get_title() {
35	return BDTUPK . esc_html__('Alter Grid', 'ultimate-post-kit');
36	}
37
38	public function get_icon() {
39	return 'upk-widget-icon upk-icon-alter-grid';
40	}
41
42	public function get_categories() {
43	return ['ultimate-post-kit'];
44	}
45
46	public function get_keywords() {
47	return ['post', 'grid', 'blog', 'recent', 'news', 'alter'];
48	}
49
50	public function get_style_depends() {
51	if ($this->upk_is_edit_mode()) {
52	return ['upk-all-styles'];
53	} else {
54	return ['upk-font', 'upk-alter-grid'];
55	}
56	}
57
58	public function get_script_depends() {
59	if ($this->upk_is_edit_mode()) {
60	return ['upk-all-scripts'];
61	} else {
62	return ['upk-ajax-loadmore'];
63	}
64	}
65
66	public function get_custom_help_url() {
67	return 'https://youtu.be/lJdoW-aPAe8';
68	}
69
70	public function get_query() {
71	return $this->_query;
72	}
73
74	public function has_widget_inner_wrapper(): bool {
75	return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
76	}
77
78
79	protected function register_controls() {
80	$this->start_controls_section(
81	'section_content_layout',
82	[
83	'label' => esc_html__('Layout', 'ultimate-post-kit'),
84	]
85	);
86
87	$this->add_control(
88	'grid_style',
89	[
90	'label' => esc_html__('Layout Style', 'ultimate-post-kit'),
91	'type' => Controls_Manager::SELECT,
92	'default' => '1',
93	'options' => [
94	'1' => esc_html__('Style 01', 'ultimate-post-kit'),
95	'2' => esc_html__('Style 02', 'ultimate-post-kit'),
96	'3' => esc_html__('Style 03', 'ultimate-post-kit'),
97	],
98	]
99	);
100
101	$column_size = apply_filters('upk_column_size', '');
102
103	$this->add_responsive_control(
104	'columns',
105	[
106	'label' => esc_html__('Columns', 'ultimate-post-kit') . BDTUPK_PC,
107	'type' => Controls_Manager::SELECT,
108	'default' => '3',
109	'tablet_default' => '2',
110	'mobile_default' => '1',
111	'options' => [
112	'1' => esc_html__('1', 'ultimate-post-kit'),
113	'2' => esc_html__('2', 'ultimate-post-kit'),
114	'3' => esc_html__('3', 'ultimate-post-kit'),
115	'4' => esc_html__('4', 'ultimate-post-kit'),
116	'5' => esc_html__('5', 'ultimate-post-kit'),
117	'6' => esc_html__('6', 'ultimate-post-kit'),
118	],
119	'selectors' => [
120	'{{WRAPPER}} .upk-alter-grid .upk-style-1' => $column_size,
121	],
122	'condition' => [
123	'grid_style' => ['1']
124	],
125	'classes' => BDTUPK_IS_PC
126	]
127	);
128
129	$this->add_responsive_control(
130	'row_gap',
131	[
132	'label' => esc_html__('Row Gap', 'ultimate-post-kit'),
133	'type' => Controls_Manager::SLIDER,
134	'selectors' => [
135	'{{WRAPPER}} .upk-alter-grid .upk-post-grid' => 'grid-row-gap: {{SIZE}}{{UNIT}};',
136	]
137	]
138	);
139
140	$this->add_responsive_control(
141	'column_gap',
142	[
143	'label' => esc_html__('Column Gap', 'ultimate-post-kit'),
144	'type' => Controls_Manager::SLIDER,
145	'selectors' => [
146	'{{WRAPPER}} .upk-alter-grid .upk-post-grid' => 'grid-column-gap: {{SIZE}}{{UNIT}};',
147	]
148	]
149	);
150
151	$this->add_responsive_control(
152	'image_height',
153	[
154	'label' => esc_html__('Image Height', 'ultimate-post-kit'),
155	'type' => Controls_Manager::SLIDER,
156	'range' => [
157	'px' => [
158	'min' => 100,
159	'max' => 800,
160	],
161	],
162	'selectors' => [
163	'{{WRAPPER}} .upk-alter-grid .upk-img-wrap .upk-main-img .upk-img' => 'height: {{SIZE}}px;',
164	],
165	'condition' => [
166	'grid_style' => ['1']
167	]
168	]
169	);
170
171	$this->add_responsive_control(
172	'secondary_image_height',
173	[
174	'label' => esc_html__('Secondary Image Height', 'ultimate-post-kit'),
175	'type' => Controls_Manager::SLIDER,
176	'range' => [
177	'px' => [
178	'min' => 100,
179	'max' => 800,
180	],
181	],
182	'selectors' => [
183	'{{WRAPPER}} .upk-alter-grid .upk-style-2 .upk-item:nth-child(4n+2), {{WRAPPER}} .upk-alter-grid .upk-style-2 .upk-item:nth-child(4n+3), {{WRAPPER}} .upk-alter-grid .upk-style-2 .upk-item:nth-child(4n+4), {{WRAPPER}} .upk-alter-grid .upk-style-3 .upk-item:nth-child(5n+2) .upk-img-wrap .upk-main-img .upk-img, {{WRAPPER}} .upk-alter-grid .upk-style-3 .upk-item:nth-child(5n+3) .upk-img-wrap .upk-main-img .upk-img, {{WRAPPER}} .upk-alter-grid .upk-style-3 .upk-item:nth-child(5n+4) .upk-img-wrap .upk-main-img .upk-img, {{WRAPPER}} .upk-alter-grid .upk-style-3 .upk-item:nth-child(5n+5) .upk-img-wrap .upk-main-img .upk-img' => 'height: {{SIZE}}px;',
184	],
185	'condition' => [
186	'grid_style' => ['2', '3']
187	]
188	]
189	);
190
191	$this->add_responsive_control(
192	'secondary_image_width',
193	[
194	'label' => esc_html__('Secondary Image Width', 'ultimate-post-kit'),
195	'type' => Controls_Manager::SLIDER,
196	'range' => [
197	'px' => [
198	'min' => 100,
199	'max' => 800,
200	],
201	],
202	'selectors' => [
203	'{{WRAPPER}} .upk-alter-grid .upk-style-2 .upk-item:nth-child(4n+2) .upk-img-wrap .upk-main-img, {{WRAPPER}} .upk-alter-grid .upk-style-2 .upk-item:nth-child(4n+3) .upk-img-wrap .upk-main-img, {{WRAPPER}} .upk-alter-grid .upk-style-2 .upk-item:nth-child(4n+4) .upk-img-wrap .upk-main-img' => 'width: {{SIZE}}px;',
204	],
205	'condition' => [
206	'grid_style' => ['2']
207	]
208	]
209	);
210
211	$this->add_group_control(
212	Group_Control_Image_Size::get_type(),
213	[
214	'name' => 'primary_thumbnail',
215	'exclude' => ['custom'],
216	'default' => 'medium',
217	]
218	);
219
220	$this->add_control(
221	'content_on_image',
222	[
223	'label' => esc_html__('Content on Image', 'ultimate-post-kit') . BDTUPK_PC,
224	'type' => Controls_Manager::SWITCHER,
225	'prefix_class' => 'upk-content-on-image-',
226	'separator' => 'before',
227	'classes' => BDTUPK_IS_PC,
228	'render_type' => 'template',
229	'condition' => [
230	'grid_style' => ['1']
231	]
232	]
233	);
234
235	$this->add_control(
236	'alter_grid_notice',
237	[
238	'type' => Controls_Manager::RAW_HTML,
239	'raw' => esc_html__( 'If you enable this feature, Read more type "on image" will not work.', 'ultimate-post-kit' ),
240	'content_classes' => 'elementor-panel-alert elementor-panel-alert-warning',
241	'condition' => [
242	'content_on_image' => 'yes',
243	],
244	]
245	);
246
247	$this->add_responsive_control(
248	'item_height',
249	[
250	'label' => esc_html__('Item Height', 'ultimate-post-kit'),
251	'type' => Controls_Manager::SLIDER,
252	'range' => [
253	'px' => [
254	'min' => 100,
255	'max' => 800,
256	],
257	],
258	'selectors' => [
259	'{{WRAPPER}}.upk-content-on-image-yes .upk-alter-grid .upk-item' => 'height: {{SIZE}}px;',
260	],
261	'condition' => [
262	'content_on_image' => 'yes'
263	]
264	]
265	);
266
267	$this->add_responsive_control(
268	'content_height',
269	[
270	'label' => esc_html__('Content Height', 'ultimate-post-kit'),
271	'type' => Controls_Manager::SLIDER,
272	'range' => [
273	'px' => [
274	'min' => 50,
275	'max' => 200,
276	],
277	],
278	'selectors' => [
279	'{{WRAPPER}}.upk-content-on-image-yes .upk-alter-grid .upk-item .upk-content' => 'height: {{SIZE}}px;',
280	],
281	'condition' => [
282	'content_on_image' => 'yes'
283	]
284	]
285	);
286
287	$this->end_controls_section();
288
289	// Query Settings
290	$this->start_controls_section(
291	'section_post_query_builder',
292	[
293	'label' => esc_html__('Query', 'ultimate-post-kit'),
294	'tab' => Controls_Manager::TAB_CONTENT,
295	]
296	);
297
298	$this->add_control(
299	'item_limit',
300	[
301	'label' => esc_html__('Item Limit', 'ultimate-post-kit'),
302	'type' => Controls_Manager::SLIDER,
303	'range' => [
304	'px' => [
305	'min' => 0,
306	'max' => 21,
307	'step' => 3
308	],
309	],
310	'default' => [
311	'size' => 6,
312	],
313	'condition' => [
314	'grid_style' => ['1']
315	]
316	]
317	);
318
319	$this->add_control(
320	'item_limit_2',
321	[
322	'label' => esc_html__('Item Limit', 'ultimate-post-kit'),
323	'type' => Controls_Manager::SLIDER,
324	'range' => [
325	'px' => [
326	'min' => 0,
327	'max' => 20,
328	'step' => 4
329	],
330	],
331	'default' => [
332	'size' => 4,
333	],
334	'condition' => [
335	'grid_style' => ['2']
336	]
337	]
338	);
339
340	$this->add_control(
341	'item_limit_3',
342	[
343	'label' => esc_html__('Item Limit', 'ultimate-post-kit'),
344	'type' => Controls_Manager::SLIDER,
345	'range' => [
346	'px' => [
347	'min' => 0,
348	'max' => 20,
349	'step' => 5
350	],
351	],
352	'default' => [
353	'size' => 5,
354	],
355	'condition' => [
356	'grid_style' => ['3']
357	]
358	]
359	);
360
361	$this->register_query_builder_controls();
362
363	$this->end_controls_section();
364
365	$this->start_controls_section(
366	'section_content_additional',
367	[
368	'label' => esc_html__('Additional Options', 'ultimate-post-kit'),
369	]
370	);
371
372	//Global Title & Text Controls
373	$this->register_title_controls();
374	$this->register_text_controls();
375
376	$this->add_control(
377	'show_author',
378	[
379	'label' => esc_html__('Show Author', 'ultimate-post-kit'),
380	'type' => Controls_Manager::SWITCHER,
381	'default' => 'yes',
382	'separator' => 'before'
383	]
384	);
385
386	$this->add_control(
387	'meta_separator',
388	[
389	'label' => esc_html__('Separator', 'ultimate-post-kit'),
390	'type' => Controls_Manager::TEXT,
391	'default' => '\|',
392	'label_block' => false,
393	]
394	);
395
396	//Global Date Controls
397	$this->register_date_controls();
398
399	// if (_is_upk_pro_activated()) :
400	// endif;
401	//Global Reading Time Controls
402	$this->register_reading_time_controls();
403
404	$this->add_control(
405	'show_category',
406	[
407	'label' => esc_html__('Show Category', 'ultimate-post-kit'),
408	'type' => Controls_Manager::SWITCHER,
409	'default' => 'yes',
410	'separator' => 'before'
411	]
412	);
413
414	$this->add_control(
415	'primary_meta_end_position',
416	[
417	'label' => esc_html__('Primary Meta End Position', 'ultimate-post-kit'),
418	'type' => Controls_Manager::SWITCHER,
419	'default' => 'yes',
420	'prefix_class' => 'upk-primary-meta-end-position--',
421	]
422	);
423
424	$this->add_control(
425	'secondary_meta_end_position',
426	[
427	'label' => esc_html__('Secondary Meta End Position', 'ultimate-post-kit'),
428	'type' => Controls_Manager::SWITCHER,
429	'prefix_class' => 'upk-secondary-meta-end-position--',
430	'condition' => [
431	'grid_style!' => '1'
432	]
433	]
434	);
435
436	$this->add_control(
437	'readmore_type',
438	[
439	'label' => esc_html__('Read More Type', 'ultimate-post-kit') . BDTUPK_PC,
440	'type' => Controls_Manager::SELECT,
441	'default' => 'none',
442	'options' => [
443	'none' => esc_html__('None', 'ultimate-post-kit'),
444	'classic' => esc_html__('Classic', 'ultimate-post-kit'),
445	'on_image' => esc_html__('On Image', 'ultimate-post-kit'),
446	],
447	'separator' => 'before',
448	'classes' => BDTUPK_IS_PC,
449	]
450	);
451
452	$this->add_control(
453	'show_post_format',
454	[
455	'label' => esc_html__('Post Format', 'ultimate-post-kit'),
456	'type' => Controls_Manager::SWITCHER,
457	'separator' => 'before'
458	]
459	);
460
461	$this->add_control(
462	'show_pagination',
463	[
464	'label' => esc_html__('Pagination', 'ultimate-post-kit'),
465	'type' => Controls_Manager::SWITCHER,
466	'separator' => 'before'
467	]
468	);
469
470	//Global Ajax Controls
471	$this->register_ajax_loadmore_controls();
472
473	$this->add_control(
474	'global_link',
475	[
476	'label' => esc_html__('Item Wrapper Link', 'ultimate-post-kit'),
477	'type' => Controls_Manager::SWITCHER,
478	'prefix_class' => 'upk-global-link-',
479	'description' => esc_html__('Be aware! When Item Wrapper Link activated then title link and read more link will not work', 'ultimate-post-kit'),
480	]
481	);
482
483	$this->end_controls_section();
484
485	$this->start_controls_section(
486	'section_content_readmore',
487	[
488	'label' => esc_html__('Read More', 'ultimate-post-kit'),
489	'condition' => [
490	'readmore_type' => 'classic',
491	],
492	]
493	);
494
495	$this->add_control(
496	'readmore_text',
497	[
498	'label' => esc_html__('Read More Text', 'ultimate-post-kit'),
499	'type' => Controls_Manager::TEXT,
500	'dynamic' => [ 'active' => true ],
501	'default' => esc_html__('Read More', 'ultimate-post-kit'),
502	'placeholder' => esc_html__('Read More', 'ultimate-post-kit'),
503	]
504	);
505
506	$this->add_control(
507	'readmore_icon',
508	[
509	'label' => esc_html__('Icon', 'ultimate-post-kit'),
510	'type' => Controls_Manager::ICONS,
511	'label_block' => false,
512	'skin' => 'inline'
513	]
514	);
515
516	$this->add_control(
517	'readmore_icon_align',
518	[
519	'label' => esc_html__('Icon Position', 'ultimate-post-kit'),
520	'type' => Controls_Manager::CHOOSE,
521	'default' => 'right',
522	'toggle' => false,
523	'options' => [
524	'left' => [
525	'title' => esc_html__('Left', 'ultimate-post-kit'),
526	'icon' => 'eicon-h-align-left',
527	],
528	'right' => [
529	'title' => esc_html__('Right', 'ultimate-post-kit'),
530	'icon' => 'eicon-h-align-right',
531	],
532	],
533	'condition' => [
534	'readmore_icon[value]!' => '',
535	],
536	]
537	);
538
539	$this->add_responsive_control(
540	'readmore_icon_indent',
541	[
542	'label' => esc_html__('Icon Spacing', 'ultimate-post-kit'),
543	'type' => Controls_Manager::SLIDER,
544	'default' => [
545	'size' => 8,
546	],
547	'range' => [
548	'px' => [
549	'max' => 50,
550	],
551	],
552	'condition' => [
553	'readmore_icon[value]!' => '',
554	],
555	'selectors' => [
556	'{{WRAPPER}} .upk-alter-grid .upk-button-icon-align-right' => is_rtl() ? 'margin-right: {{SIZE}}{{UNIT}};' : 'margin-left: {{SIZE}}{{UNIT}};',
557	'{{WRAPPER}} .upk-alter-grid .upk-button-icon-align-left' => is_rtl() ? 'margin-left: {{SIZE}}{{UNIT}};' : 'margin-right: {{SIZE}}{{UNIT}};',
558	],
559	]
560	);
561
562	$this->end_controls_section();
563
564	//Style
565	$this->start_controls_section(
566	'upk_section_style',
567	[
568	'label' => esc_html__('Items', 'ultimate-post-kit'),
569	'tab' => Controls_Manager::TAB_STYLE,
570	]
571	);
572
573	$this->add_control(
574	'overlay_blur_effect',
575	[
576	'label' => esc_html__('Glassmorphism', 'ultimate-post-kit'),
577	'type' => Controls_Manager::SWITCHER,
578	// translators: %1s: Opening anchor tag with link to MDN backdrop-filter documentation, %2s: Closing anchor tag
579	'description' => sprintf(__('This feature will not work in the Firefox browser untill you enable browser compatibility so please %1s look here %2s', 'ultimate-post-kit'), '<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility" target="_blank">', '</a>'),
580	'default' => 'yes',
581	'condition' => [
582	'content_on_image' => 'yes'
583	]
584	]
585	);
586
587	$this->add_control(
588	'overlay_blur_level',
589	[
590	'label' => esc_html__('Blur Level', 'ultimate-post-kit'),
591	'type' => Controls_Manager::SLIDER,
592	'range' => [
593	'px' => [
594	'min' => 0,
595	'step' => 1,
596	'max' => 50,
597	]
598	],
599	'default' => [
600	'size' => 10
601	],
602	'selectors' => [
603	'{{WRAPPER}}.upk-content-on-image-yes .upk-alter-grid .upk-content' => 'backdrop-filter: blur({{SIZE}}px); -webkit-backdrop-filter: blur({{SIZE}}px);'
604	],
605	'condition' => [
606	'overlay_blur_effect' => 'yes',
607	'content_on_image' => 'yes'
608	]
609	]
610	);
611
612	$this->add_responsive_control(
613	'content_padding',
614	[
615	'label' => esc_html__('Content Padding', 'ultimate-post-kit'),
616	'type' => Controls_Manager::DIMENSIONS,
617	'size_units' => ['px', 'em', '%'],
618	'selectors' => [
619	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
620	],
621	]
622	);
623
624	$this->start_controls_tabs('tabs_item_style');
625
626	$this->start_controls_tab(
627	'tab_item_normal',
628	[
629	'label' => esc_html__('Normal', 'ultimate-post-kit'),
630	]
631	);
632
633	$this->add_group_control(
634	Group_Control_Background::get_type(),
635	[
636	'name' => 'itam_background',
637	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item',
638	'condition' => [
639	'content_on_image!' => 'yes'
640	]
641	]
642	);
643
644	$this->add_group_control(
645	Group_Control_Background::get_type(),
646	[
647	'name' => 'itam_content_background',
648	'selector' => '{{WRAPPER}}.upk-content-on-image-yes .upk-alter-grid .upk-content',
649	'exclude' => ['image'],
650	'condition' => [
651	'content_on_image' => 'yes'
652	]
653	]
654	);
655
656	$this->add_group_control(
657	Group_Control_Border::get_type(),
658	[
659	'name' => 'item_border',
660	'label' => esc_html__('Border', 'ultimate-post-kit'),
661	'placeholder' => '1px',
662	'default' => '1px',
663	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item',
664	'separator' => 'before'
665	]
666	);
667
668	$this->add_responsive_control(
669	'item_border_radius',
670	[
671	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
672	'type' => Controls_Manager::DIMENSIONS,
673	'size_units' => ['px', '%'],
674	'selectors' => [
675	'{{WRAPPER}} .upk-alter-grid .upk-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
676	],
677	]
678	);
679
680	$this->add_group_control(
681	Group_Control_Box_Shadow::get_type(),
682	[
683	'name' => 'item_box_shadow',
684	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item',
685	]
686	);
687
688	$this->end_controls_tab();
689
690	$this->start_controls_tab(
691	'tab_item_hover',
692	[
693	'label' => esc_html__('Hover', 'ultimate-post-kit'),
694	]
695	);
696
697	$this->add_group_control(
698	Group_Control_Background::get_type(),
699	[
700	'name' => 'itam_background_color_hover',
701	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item:hover',
702	'condition' => [
703	'content_on_image!' => 'yes'
704	]
705	]
706	);
707
708	$this->add_group_control(
709	Group_Control_Background::get_type(),
710	[
711	'name' => 'itam_content_hover_background',
712	'selector' => '{{WRAPPER}}.upk-content-on-image-yes .upk-alter-grid .upk-item:hover .upk-content',
713	'exclude' => ['image'],
714	'condition' => [
715	'content_on_image' => 'yes'
716	]
717	]
718	);
719
720	$this->add_control(
721	'item_border_color_hover',
722	[
723	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
724	'type' => Controls_Manager::COLOR,
725	'selectors' => [
726	'{{WRAPPER}} .upk-alter-grid .upk-item:hover' => 'border-color: {{VALUE}};'
727	],
728	'condition' => [
729	'item_border_border!' => ''
730	]
731	]
732	);
733
734	$this->add_group_control(
735	Group_Control_Box_Shadow::get_type(),
736	[
737	'name' => 'item_box_shadow_hover',
738	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item:hover',
739	]
740	);
741
742	$this->end_controls_tab();
743
744	$this->end_controls_tabs();
745
746	$this->end_controls_section();
747
748	$this->start_controls_section(
749	'section_style_title',
750	[
751	'label' => esc_html__('Title', 'ultimate-post-kit'),
752	'tab' => Controls_Manager::TAB_STYLE,
753	'condition' => [
754	'show_title' => 'yes',
755	],
756	]
757	);
758
759	$this->add_control(
760	'title_style',
761	[
762	'label' => esc_html__('Style', 'ultimate-post-kit'),
763	'type' => Controls_Manager::SELECT,
764	'default' => 'underline',
765	'options' => [
766	'underline' => esc_html__('Underline', 'ultimate-post-kit'),
767	'middle-underline' => esc_html__('Middle Underline', 'ultimate-post-kit'),
768	'overline' => esc_html__('Overline', 'ultimate-post-kit'),
769	'middle-overline' => esc_html__('Middle Overline', 'ultimate-post-kit'),
770	],
771	]
772	);
773
774	$this->add_control(
775	'title_color',
776	[
777	'label' => esc_html__('Color', 'ultimate-post-kit'),
778	'type' => Controls_Manager::COLOR,
779	'selectors' => [
780	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-title a' => 'color: {{VALUE}};',
781	],
782	]
783	);
784
785	$this->add_control(
786	'title_hover_color',
787	[
788	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
789	'type' => Controls_Manager::COLOR,
790	'selectors' => [
791	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-title a:hover' => 'color: {{VALUE}};',
792	],
793	]
794	);
795
796	$this->add_responsive_control(
797	'title_spacing',
798	[
799	'label' => esc_html__('Spacing', 'ultimate-post-kit'),
800	'type' => Controls_Manager::SLIDER,
801	'range' => [
802	'px' => [
803	'min' => 0,
804	'max' => 50,
805	],
806	],
807	'selectors' => [
808	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-title' => 'margin-bottom: {{SIZE}}{{UNIT}};',
809	],
810	]
811	);
812
813	$this->add_group_control(
814	Group_Control_Typography::get_type(),
815	[
816	'name' => 'title_typography',
817	'label' => esc_html__('Typography', 'ultimate-post-kit'),
818	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-title',
819	]
820	);
821
822	$this->add_group_control(
823	Group_Control_Typography::get_type(),
824	[
825	'name' => 'secondary_title_typography',
826	'label' => esc_html__('Secondary Typography', 'ultimate-post-kit'),
827	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-style-2 .upk-item:nth-child(4n+2) .upk-title, {{WRAPPER}} .upk-alter-grid .upk-style-2 .upk-item:nth-child(4n+3) .upk-title, {{WRAPPER}} .upk-alter-grid .upk-style-2 .upk-item:nth-child(4n+4) .upk-title, {{WRAPPER}} .upk-alter-grid .upk-style-3 .upk-item:nth-child(5n+2) .upk-title, {{WRAPPER}} .upk-alter-grid .upk-style-3 .upk-item:nth-child(5n+3) .upk-title, {{WRAPPER}} .upk-alter-grid .upk-style-3 .upk-item:nth-child(5n+4) .upk-title, {{WRAPPER}} .upk-alter-grid .upk-style-3 .upk-item:nth-child(5n+5) .upk-title',
828	'condition' => [
829	'grid_style' => ['2', '3']
830	]
831	]
832	);
833
834	$this->add_control(
835	'title_advanced_style',
836	[
837	'label' => esc_html__('Advanced Style', 'ultimate-post-kit'),
838	'type' => Controls_Manager::SWITCHER,
839	]
840	);
841
842	$this->add_control(
843	'title_background',
844	[
845	'label' => esc_html__('Background Color', 'ultimate-post-kit'),
846	'type' => Controls_Manager::COLOR,
847	'selectors' => [
848	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-title a' => 'background-color: {{VALUE}};',
849	],
850	'condition' => [
851	'title_advanced_style' => 'yes'
852	]
853	]
854	);
855
856	$this->add_group_control(
857	Group_Control_Text_Shadow::get_type(),
858	[
859	'name' => 'title_text_shadow',
860	'label' => esc_html__('Text Shadow', 'ultimate-post-kit'),
861	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-title a',
862	'condition' => [
863	'title_advanced_style' => 'yes'
864	]
865	]
866	);
867
868	$this->add_group_control(
869	Group_Control_Border::get_type(),
870	[
871	'name' => 'title_border',
872	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-title a',
873	'condition' => [
874	'title_advanced_style' => 'yes'
875	]
876	]
877	);
878
879	$this->add_responsive_control(
880	'title_border_radius',
881	[
882	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
883	'type' => Controls_Manager::DIMENSIONS,
884	'size_units' => ['px', '%'],
885	'selectors' => [
886	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-title a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
887	],
888	'condition' => [
889	'title_advanced_style' => 'yes'
890	]
891	]
892	);
893
894	$this->add_group_control(
895	Group_Control_Box_Shadow::get_type(),
896	[
897	'name' => 'title_box_shadow',
898	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-title a',
899	'condition' => [
900	'title_advanced_style' => 'yes'
901	]
902	]
903	);
904
905	$this->add_responsive_control(
906	'title_text_padding',
907	[
908	'label' => esc_html__('Padding', 'ultimate-post-kit'),
909	'type' => Controls_Manager::DIMENSIONS,
910	'size_units' => ['px', 'em', '%'],
911	'selectors' => [
912	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-title a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
913	],
914	'condition' => [
915	'title_advanced_style' => 'yes'
916	]
917	]
918	);
919
920	$this->end_controls_section();
921
922	$this->start_controls_section(
923	'section_style_text',
924	[
925	'label' => esc_html__('Text', 'ultimate-post-kit'),
926	'tab' => Controls_Manager::TAB_STYLE,
927	'condition' => [
928	'show_excerpt' => 'yes',
929	],
930	]
931	);
932
933	$this->add_control(
934	'text_color',
935	[
936	'label' => esc_html__('Color', 'ultimate-post-kit'),
937	'type' => Controls_Manager::COLOR,
938	'selectors' => [
939	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-text-wrap .upk-text' => 'color: {{VALUE}};',
940	],
941	]
942	);
943
944	$this->add_group_control(
945	Group_Control_Typography::get_type(),
946	[
947	'name' => 'text_typography',
948	'label' => esc_html__('Typography', 'ultimate-post-kit'),
949	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-text-wrap .upk-text',
950	]
951	);
952
953	$this->add_responsive_control(
954	'text_margin',
955	[
956	'label' => esc_html__('Margin', 'ultimate-post-kit'),
957	'type' => Controls_Manager::DIMENSIONS,
958	'size_units' => ['px', 'em', '%'],
959	'selectors' => [
960	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-text-wrap .upk-text' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
961	]
962	]
963	);
964
965	$this->end_controls_section();
966
967	$this->start_controls_section(
968	'section_style_meta',
969	[
970	'label' => esc_html__('Meta', 'ultimate-post-kit'),
971	'tab' => Controls_Manager::TAB_STYLE,
972	'conditions' => [
973	'relation' => 'or',
974	'terms' => [
975	[
976	'name' => 'show_author',
977	'value' => 'yes'
978	],
979	[
980	'name' => 'show_date',
981	'value' => 'yes'
982	]
983	]
984	],
985	]
986	);
987
988	$this->add_control(
989	'meta_color',
990	[
991	'label' => esc_html__('Color', 'ultimate-post-kit'),
992	'type' => Controls_Manager::COLOR,
993	'selectors' => [
994	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-meta .upk-blog-author a, {{WRAPPER}} .upk-alter-grid .upk-item .upk-meta' => 'color: {{VALUE}};',
995	],
996	]
997	);
998
999	$this->add_control(
1000	'meta_hover_color',
1001	[
1002	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
1003	'type' => Controls_Manager::COLOR,
1004	'selectors' => [
1005	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-meta .upk-blog-author a:hover' => 'color: {{VALUE}};',
1006	],
1007	]
1008	);
1009
1010	$this->add_responsive_control(
1011	'meta_spacing',
1012	[
1013	'label' => esc_html__('Space Between', 'ultimate-post-kit'),
1014	'type' => Controls_Manager::SLIDER,
1015	'range' => [
1016	'px' => [
1017	'min' => 0,
1018	'max' => 50,
1019	],
1020	],
1021	'selectors' => [
1022	'{{WRAPPER}} .upk-alter-grid .upk-meta > div:before' => 'margin: 0 {{SIZE}}{{UNIT}};',
1023	],
1024	]
1025	);
1026
1027	$this->add_group_control(
1028	Group_Control_Typography::get_type(),
1029	[
1030	'name' => 'meta_typography',
1031	'label' => esc_html__('Typography', 'ultimate-post-kit'),
1032	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-meta',
1033	]
1034	);
1035
1036	$this->end_controls_section();
1037
1038	$this->start_controls_section(
1039	'section_style_category',
1040	[
1041	'label' => esc_html__('Category', 'ultimate-post-kit'),
1042	'tab' => Controls_Manager::TAB_STYLE,
1043	'condition' => [
1044	'show_category' => 'yes',
1045	],
1046	]
1047	);
1048
1049	$this->add_responsive_control(
1050	'category_spacing',
1051	[
1052	'label' => esc_html__('Spacing', 'ultimate-post-kit'),
1053	'type' => Controls_Manager::SLIDER,
1054	'range' => [
1055	'px' => [
1056	'min' => 0,
1057	'max' => 50,
1058	],
1059	],
1060	'selectors' => [
1061	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-category' => 'margin-bottom: {{SIZE}}{{UNIT}};',
1062	],
1063	]
1064	);
1065
1066	$this->start_controls_tabs('tabs_category_style');
1067
1068	$this->start_controls_tab(
1069	'tab_category_normal',
1070	[
1071	'label' => esc_html__('Normal', 'ultimate-post-kit'),
1072	]
1073	);
1074
1075	$this->add_control(
1076	'category_color',
1077	[
1078	'label' => esc_html__('Color', 'ultimate-post-kit'),
1079	'type' => Controls_Manager::COLOR,
1080	'selectors' => [
1081	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-category a' => 'color: {{VALUE}};',
1082	],
1083	]
1084	);
1085
1086	$this->add_group_control(
1087	Group_Control_Background::get_type(),
1088	[
1089	'name' => 'category_background',
1090	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-category a',
1091	]
1092	);
1093
1094	$this->add_group_control(
1095	Group_Control_Border::get_type(),
1096	[
1097	'name' => 'category_border',
1098	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-category a',
1099	]
1100	);
1101
1102	$this->add_responsive_control(
1103	'category_border_radius',
1104	[
1105	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
1106	'type' => Controls_Manager::DIMENSIONS,
1107	'size_units' => ['px', '%'],
1108	'selectors' => [
1109	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-category a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1110	],
1111	]
1112	);
1113
1114	$this->add_responsive_control(
1115	'category_padding',
1116	[
1117	'label' => esc_html__('Padding', 'ultimate-post-kit'),
1118	'type' => Controls_Manager::DIMENSIONS,
1119	'size_units' => ['px', 'em', '%'],
1120	'selectors' => [
1121	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-category a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1122	],
1123	]
1124	);
1125
1126	$this->add_responsive_control(
1127	'category_margin',
1128	[
1129	'label' => esc_html__('Margin', 'ultimate-post-kit'),
1130	'type' => Controls_Manager::DIMENSIONS,
1131	'size_units' => ['px', 'em', '%'],
1132	'selectors' => [
1133	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-category' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1134	],
1135	]
1136	);
1137
1138	$this->add_responsive_control(
1139	'category_spacing_between',
1140	[
1141	'label' => esc_html__('Space Between', 'ultimate-post-kit'),
1142	'type' => Controls_Manager::SLIDER,
1143	'range' => [
1144	'px' => [
1145	'min' => 0,
1146	'max' => 50,
1147	],
1148	],
1149	'selectors' => [
1150	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-category a+a' => 'margin-left: {{SIZE}}{{UNIT}};',
1151	],
1152	]
1153	);
1154
1155
1156	$this->add_group_control(
1157	Group_Control_Box_Shadow::get_type(),
1158	[
1159	'name' => 'category_shadow',
1160	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-category a',
1161	]
1162	);
1163
1164	$this->add_group_control(
1165	Group_Control_Typography::get_type(),
1166	[
1167	'name' => 'category_typography',
1168	'label' => esc_html__('Typography', 'ultimate-post-kit'),
1169	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-category a',
1170	]
1171	);
1172
1173	$this->end_controls_tab();
1174
1175	$this->start_controls_tab(
1176	'tab_category_hover',
1177	[
1178	'label' => esc_html__('Hover', 'ultimate-post-kit'),
1179	]
1180	);
1181
1182	$this->add_control(
1183	'category_hover_color',
1184	[
1185	'label' => esc_html__('Color', 'ultimate-post-kit'),
1186	'type' => Controls_Manager::COLOR,
1187	'selectors' => [
1188	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-category a:hover' => 'color: {{VALUE}};',
1189	],
1190	]
1191	);
1192
1193	$this->add_group_control(
1194	Group_Control_Background::get_type(),
1195	[
1196	'name' => 'category_hover_background',
1197	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-category a:hover',
1198	]
1199	);
1200
1201	$this->add_control(
1202	'category_hover_border_color',
1203	[
1204	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
1205	'type' => Controls_Manager::COLOR,
1206	'condition' => [
1207	'category_border_border!' => '',
1208	],
1209	'selectors' => [
1210	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-category a:hover' => 'border-color: {{VALUE}};',
1211	],
1212	]
1213	);
1214
1215	$this->end_controls_tab();
1216
1217	$this->end_controls_tabs();
1218
1219	$this->end_controls_section();
1220
1221	if (_is_upk_pro_activated()) {
1222	$this->start_controls_section(
1223	'section_style_readmore',
1224	[
1225	'label' => esc_html__('Read More', 'ultimate-post-kit'),
1226	'tab' => Controls_Manager::TAB_STYLE,
1227	'condition' => [
1228	'readmore_type' => 'classic',
1229	],
1230	]
1231	);
1232
1233	$this->start_controls_tabs('tabs_readmore_style');
1234
1235	$this->start_controls_tab(
1236	'tab_readmore_normal',
1237	[
1238	'label' => esc_html__('Normal', 'ultimate-post-kit'),
1239	]
1240	);
1241
1242	$this->add_control(
1243	'readmore_color',
1244	[
1245	'label' => esc_html__('Color', 'ultimate-post-kit'),
1246	'type' => Controls_Manager::COLOR,
1247	'selectors' => [
1248	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore' => 'color: {{VALUE}};',
1249	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore svg *' => 'fill: {{VALUE}};',
1250	],
1251	]
1252	);
1253
1254	$this->add_group_control(
1255	Group_Control_Background::get_type(),
1256	[
1257	'name' => 'readmore_background',
1258	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore',
1259	]
1260	);
1261
1262	$this->add_group_control(
1263	Group_Control_Border::get_type(),
1264	[
1265	'name' => 'readmore_border',
1266	'label' => esc_html__('Border', 'ultimate-post-kit'),
1267	'placeholder' => '1px',
1268	'default' => '1px',
1269	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore',
1270	]
1271	);
1272
1273	$this->add_responsive_control(
1274	'readmore_border_radius',
1275	[
1276	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
1277	'type' => Controls_Manager::DIMENSIONS,
1278	'size_units' => ['px', '%'],
1279	'selectors' => [
1280	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1281	],
1282	]
1283	);
1284
1285	$this->add_responsive_control(
1286	'readmore_padding',
1287	[
1288	'label' => esc_html__('Padding', 'ultimate-post-kit'),
1289	'type' => Controls_Manager::DIMENSIONS,
1290	'size_units' => ['px', 'em', '%'],
1291	'selectors' => [
1292	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1293	],
1294	]
1295	);
1296
1297	$this->add_responsive_control(
1298	'readmore_margin',
1299	[
1300	'label' => esc_html__('Margin', 'ultimate-post-kit'),
1301	'type' => Controls_Manager::DIMENSIONS,
1302	'size_units' => ['px', 'em', '%'],
1303	'selectors' => [
1304	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1305	]
1306	]
1307	);
1308
1309	$this->add_group_control(
1310	Group_Control_Box_Shadow::get_type(),
1311	[
1312	'name' => 'readmore_shadow',
1313	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore',
1314	]
1315	);
1316
1317	$this->add_group_control(
1318	Group_Control_Typography::get_type(),
1319	[
1320	'name' => 'readmore_typography',
1321	'label' => esc_html__('Typography', 'ultimate-post-kit'),
1322	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore',
1323	]
1324	);
1325
1326	$this->end_controls_tab();
1327
1328	$this->start_controls_tab(
1329	'tab_readmore_hover',
1330	[
1331	'label' => esc_html__('Hover', 'ultimate-post-kit'),
1332	]
1333	);
1334
1335	$this->add_control(
1336	'readmore_hover_color',
1337	[
1338	'label' => esc_html__('Color', 'ultimate-post-kit'),
1339	'type' => Controls_Manager::COLOR,
1340	'selectors' => [
1341	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore:hover' => 'color: {{VALUE}};',
1342	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore:hover svg *' => 'fill: {{VALUE}};',
1343	],
1344	]
1345	);
1346
1347	$this->add_group_control(
1348	Group_Control_Background::get_type(),
1349	[
1350	'name' => 'readmore_hover_background',
1351	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore:hover',
1352	]
1353	);
1354
1355	$this->add_control(
1356	'readmore_hover_border_color',
1357	[
1358	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
1359	'type' => Controls_Manager::COLOR,
1360	'condition' => [
1361	'readmore_border_border!' => '',
1362	],
1363	'selectors' => [
1364	'{{WRAPPER}} .upk-alter-grid .upk-item .upk-readmore:hover' => 'border-color: {{VALUE}};',
1365	],
1366	]
1367	);
1368
1369	$this->add_control(
1370	'readmore_hover_animation',
1371	[
1372	'label' => esc_html__('Animation', 'ultimate-post-kit'),
1373	'type' => Controls_Manager::HOVER_ANIMATION,
1374	]
1375	);
1376
1377	$this->end_controls_tab();
1378
1379	$this->end_controls_tabs();
1380
1381	$this->end_controls_section();
1382
1383	$this->start_controls_section(
1384	'section_style_readmore_on_image',
1385	[
1386	'label' => esc_html__('Read More On Image', 'ultimate-post-kit'),
1387	'tab' => Controls_Manager::TAB_STYLE,
1388	'condition' => [
1389	'readmore_type' => 'on_image',
1390	],
1391	]
1392	);
1393
1394	$this->add_control(
1395	'readmore_on_image_color',
1396	[
1397	'label' => esc_html__('Color', 'ultimate-post-kit'),
1398	'type' => Controls_Manager::COLOR,
1399	'selectors' => [
1400	'{{WRAPPER}} .upk-alter-grid .upk-readmore-on-image .upk-readmore-icon:before, {{WRAPPER}} .upk-alter-grid .upk-item:hover .upk-readmore-on-image .upk-readmore-icon span:before, {{WRAPPER}} .upk-alter-grid .upk-item:hover .upk-readmore-on-image .upk-readmore-icon span:after' => 'background: {{VALUE}};',
1401	],
1402	]
1403	);
1404
1405	$this->add_control(
1406	'item_image_overlay_color',
1407	[
1408	'label' => esc_html__('Overlay Color', 'ultimate-post-kit'),
1409	'type' => Controls_Manager::COLOR,
1410	'selectors' => [
1411	'{{WRAPPER}} .upk-alter-grid .upk-readmore-on-image:before' => 'background: linear-gradient(0deg, {{VALUE}} 0, rgba(141, 153, 174, 0.1) 100%);',
1412	],
1413	]
1414	);
1415
1416	$this->end_controls_section();
1417	}
1418
1419	$this->start_controls_section(
1420	'section_style_post_format',
1421	[
1422	'label' => esc_html__('Post Format', 'ultimate-post-kit'),
1423	'tab' => Controls_Manager::TAB_STYLE,
1424	'condition' => [
1425	'show_post_format' => 'yes',
1426	],
1427	]
1428	);
1429
1430	$this->start_controls_tabs('tabs_post_format_style');
1431
1432	$this->start_controls_tab(
1433	'tab_post_format_normal',
1434	[
1435	'label' => esc_html__('Normal', 'ultimate-post-kit'),
1436	]
1437	);
1438
1439	$this->add_control(
1440	'post_format_color',
1441	[
1442	'label' => esc_html__('Color', 'ultimate-post-kit'),
1443	'type' => Controls_Manager::COLOR,
1444	'selectors' => [
1445	'{{WRAPPER}} .upk-alter-grid .upk-post-format a' => 'color: {{VALUE}};',
1446	],
1447	]
1448	);
1449
1450	$this->add_group_control(
1451	Group_Control_Background::get_type(),
1452	[
1453	'name' => 'post_format_background',
1454	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-post-format a',
1455	]
1456	);
1457
1458	$this->add_group_control(
1459	Group_Control_Border::get_type(),
1460	[
1461	'name' => 'post_format_border',
1462	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-post-format a',
1463	]
1464	);
1465
1466	$this->add_responsive_control(
1467	'post_format_border_radius',
1468	[
1469	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
1470	'type' => Controls_Manager::DIMENSIONS,
1471	'size_units' => ['px', '%'],
1472	'selectors' => [
1473	'{{WRAPPER}} .upk-alter-grid .upk-post-format a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1474	],
1475	]
1476	);
1477
1478	$this->add_responsive_control(
1479	'post_format_padding',
1480	[
1481	'label' => esc_html__('Padding', 'ultimate-post-kit'),
1482	'type' => Controls_Manager::DIMENSIONS,
1483	'size_units' => ['px', 'em', '%'],
1484	'selectors' => [
1485	'{{WRAPPER}} .upk-alter-grid .upk-post-format a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1486	],
1487	]
1488	);
1489
1490	$this->add_responsive_control(
1491	'post_format_margin',
1492	[
1493	'label' => esc_html__('Margin', 'ultimate-post-kit'),
1494	'type' => Controls_Manager::DIMENSIONS,
1495	'size_units' => ['px', 'em', '%'],
1496	'selectors' => [
1497	'{{WRAPPER}} .upk-alter-grid .upk-post-format a' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1498	],
1499	]
1500	);
1501
1502	$this->add_group_control(
1503	Group_Control_Box_Shadow::get_type(),
1504	[
1505	'name' => 'post_format_shadow',
1506	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-post-format a',
1507	]
1508	);
1509
1510	$this->add_group_control(
1511	Group_Control_Typography::get_type(),
1512	[
1513	'name' => 'post_format_typography',
1514	'label' => esc_html__('Typography', 'ultimate-post-kit'),
1515	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-post-format a',
1516	]
1517	);
1518
1519	$this->end_controls_tab();
1520
1521	$this->start_controls_tab(
1522	'tab_post_format_hover',
1523	[
1524	'label' => esc_html__('Hover', 'ultimate-post-kit'),
1525	]
1526	);
1527
1528	$this->add_control(
1529	'post_format_hover_color',
1530	[
1531	'label' => esc_html__('Color', 'ultimate-post-kit'),
1532	'type' => Controls_Manager::COLOR,
1533	'selectors' => [
1534	'{{WRAPPER}} .upk-alter-grid .upk-post-format a:hover' => 'color: {{VALUE}};',
1535	],
1536	]
1537	);
1538
1539	$this->add_group_control(
1540	Group_Control_Background::get_type(),
1541	[
1542	'name' => 'post_format_hover_background',
1543	'selector' => '{{WRAPPER}} .upk-alter-grid .upk-post-format a:hover',
1544	]
1545	);
1546
1547	$this->add_control(
1548	'post_format_hover_border_color',
1549	[
1550	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
1551	'type' => Controls_Manager::COLOR,
1552	'condition' => [
1553	'post_format_border_border!' => '',
1554	],
1555	'selectors' => [
1556	'{{WRAPPER}} .upk-alter-grid .upk-post-format a:hover' => 'border-color: {{VALUE}};',
1557	],
1558	]
1559	);
1560
1561	$this->end_controls_tab();
1562
1563	$this->end_controls_tabs();
1564
1565	$this->end_controls_section();
1566
1567	//Global Pagination Controls
1568	$this->register_pagination_controls();
1569
1570	//Global ajax style controls
1571	$this->register_ajax_loadmore_style_controls();
1572	}
1573
1574	/**
1575	* Main query render for this widget
1576	* @param $posts_per_page number item query limit
1577	*/
1578	public function query_posts($posts_per_page) {
1579
1580	$default = $this->getGroupControlQueryArgs();
1581	$args = [];
1582	if ($posts_per_page) {
1583	$args['posts_per_page'] = $posts_per_page;
1584	$args['paged'] = max(1, get_query_var('paged'), get_query_var('page'));
1585	}
1586	$args = array_merge($default, $args);
1587	$this->_query = new WP_Query($args);
1588	}
1589
1590	public function render_readmore() {
1591	$settings = $this->get_settings_for_display();
1592
1593	$animation = ($this->get_settings('readmore_hover_animation')) ? ' elementor-animation-' . $this->get_settings('readmore_hover_animation') : '';
1594
1595	?>
1596
1597	<a
1598	href="<?php echo esc_url(get_permalink()); ?>"
1599	class="upk-readmore upk-display-inline-block <?php echo esc_attr($animation); ?>"
1600	aria-label="<?php echo esc_attr__( 'Read More Button', 'ultimate-post-kit' ); ?>"
1601	>
1602	<?php echo esc_html($this->get_settings('readmore_text')); ?>
1603
1604	<?php if ($settings['readmore_icon']['value']) : ?>
1605	<span class="upk-button-icon-align-<?php echo esc_attr($this->get_settings('readmore_icon_align')); ?>">
1606	<?php Icons_Manager::render_icon($settings['readmore_icon'], ['aria-hidden' => 'true', 'class' => 'fa-fw']); ?>
1607	</span>
1608	<?php endif; ?>
1609	</a>
1610	<?php
1611	}
1612
1613	public function render_readmore_on_image() {
1614
1615	?>
1616	<a
1617	href="<?php echo esc_url(get_permalink()); ?>"
1618	class="upk-readmore-on-image"
1619	aria-label="<?php echo esc_attr__( 'Read More Button', 'ultimate-post-kit' ); ?>"
1620	>
1621	<span class="upk-readmore-icon"><span></span></span>
1622	</a>
1623	<?php
1624	}
1625
1626	public function render_post_grid_item($post_id, $image_size, $excerpt_length) {
1627	$settings = $this->get_settings_for_display();
1628
1629	if ('yes' == $settings['global_link']) {
1630
1631	$this->add_render_attribute('grid-item', 'onclick', "window.open('" . esc_url(get_permalink()) . "', '_self')", true);
1632	}
1633	$this->add_render_attribute('grid-item', 'class', 'upk-item', true);
1634
1635	?>
1636	<div <?php $this->print_render_attribute_string('grid-item'); ?>>
1637	<div class="upk-item-box">
1638	<div class="upk-img-wrap">
1639	<div class="upk-main-img">
1640	<?php $this->render_image(get_post_thumbnail_id($post_id), $image_size); ?>
1641	<?php if (_is_upk_pro_activated()) : ?>
1642	<?php if ($settings['readmore_type'] == 'on_image') : ?>
1643	<?php $this->render_readmore_on_image(); ?>
1644	<?php endif; ?>
1645	<?php endif; ?>
1646	<?php $this->render_post_format(); ?>
1647	</div>
1648	</div>
1649
1650	<div class="upk-content">
1651	<div>
1652
1653	<?php $this->render_category(); ?>
1654
1655	<?php $this->render_title(substr($this->get_name(), 4)); ?>
1656	<div class="upk-text-wrap">
1657	<?php $this->render_excerpt($excerpt_length); ?>
1658	<?php if (_is_upk_pro_activated()) : ?>
1659	<?php if ($settings['readmore_type'] == 'classic') : ?>
1660	<?php $this->render_readmore(); ?>
1661	<?php endif; ?>
1662	<?php endif; ?>
1663	</div>
1664
1665	<?php if ($settings['show_author'] or $settings['show_date'] or $settings['show_reading_time']) : ?>
1666	<div class="upk-meta">
1667	<?php if ($settings['show_author']) : ?>
1668	<div class="upk-blog-author" data-separator="<?php echo esc_html($settings['meta_separator']); ?>">
1669	<a
1670	class="author-name"
1671	href="<?php echo esc_url( get_author_posts_url(get_the_author_meta('ID')) ); ?>"
1672	aria-label="<?php echo esc_attr( 'View all posts by ' . get_the_author() ); ?>"
1673	>
1674	<?php echo esc_html( get_the_author() ) ?>
1675	</a>
1676	</div>
1677	<?php endif; ?>
1678	<?php if ('yes' === $settings['show_date']) : ?>
1679	<div data-separator="<?php echo esc_html($settings['meta_separator']); ?>">
1680	<?php $this->render_date(); ?>
1681	</div>
1682	<?php endif; ?>
1683
1684	<?php if (_is_upk_pro_activated()) :
1685	if ('yes' === $settings['show_reading_time']) : ?>
1686	<div class="upk-reading-time" data-separator="<?php echo esc_html($settings['meta_separator']); ?>">
1687	<?php echo esc_html( ultimate_post_kit_reading_time( get_the_content(), $settings['avg_reading_speed'], $settings['hide_seconds'] ?? 'no', $settings['hide_minutes'] ?? 'no' ) ); ?>
1688	</div>
1689	<?php endif; ?>
1690	<?php endif; ?>
1691	</div>
1692	<?php endif; ?>
1693
1694	</div>
1695	</div>
1696
1697	</div>
1698	</div>
1699	<?php
1700	}
1701
1702	protected function render() {
1703	$settings = $this->get_settings_for_display();
1704
1705	if ($settings['grid_style'] == '2') {
1706	$this->query_posts($settings['item_limit_2']['size']);
1707	} elseif ($settings['grid_style'] == '3') {
1708	$this->query_posts($settings['item_limit_3']['size']);
1709	} else {
1710	$this->query_posts($settings['item_limit']['size']);
1711	}
1712
1713	$wp_query = $this->get_query();
1714
1715	if (!$wp_query->have_posts()) {
1716	return;
1717	}
1718
1719	$this->add_render_attribute('grid-wrap', 'class', 'upk-post-grid upk-ajax-grid-wrap');
1720	$this->add_render_attribute('grid-wrap', 'class', 'upk-style-' . $settings['grid_style']);
1721
1722	$this->add_render_attribute(
1723	[
1724	'upk-alter-grid' => [
1725	'class' => 'upk-alter-grid upk-ajax-grid',
1726	'data-loadmore' => [
1727	wp_json_encode(
1728	array_filter([
1729	'loadmore_enable' => $settings['ajax_loadmore_enable'],
1730	'loadmore_btn' => $settings['ajax_loadmore_btn'],
1731	'infinite_scroll' => $settings['ajax_loadmore_infinite_scroll'],
1732	])
1733	),
1734	],
1735	],
1736	]
1737	);
1738
1739	if ( $settings['ajax_loadmore_enable'] == 'yes' ) {
1740	$ajax_settings = [
1741	'posts_source' => isset( $settings['posts_source'] ) ? $settings['posts_source'] : 'post',
1742	'posts_per_page' => isset( $posts_load ) ? $posts_load : 6,
1743	'ajax_item_load' => isset( $settings['ajax_loadmore_items'] ) ? $settings['ajax_loadmore_items'] : 3,
1744	'posts_selected_ids' => isset( $settings['posts_selected_ids'] ) ? $settings['posts_selected_ids'] : '',
1745	'posts_include_by' => isset( $settings['posts_include_by'] ) ? $settings['posts_include_by'] : [],
1746	'posts_include_author_ids' => isset( $settings['posts_include_author_ids'] ) ? $settings['posts_include_author_ids'] : '',
1747	'posts_include_term_ids' => isset( $settings['posts_include_term_ids'] ) ? $settings['posts_include_term_ids'] : '',
1748	'posts_exclude_by' => isset( $settings['posts_exclude_by'] ) ? $settings['posts_exclude_by'] : [],
1749	'posts_exclude_ids' => isset( $settings['posts_exclude_ids'] ) ? $settings['posts_exclude_ids'] : '',
1750	'posts_exclude_author_ids' => isset( $settings['posts_exclude_author_ids'] ) ? $settings['posts_exclude_author_ids'] : '',
1751	'posts_exclude_term_ids' => isset( $settings['posts_exclude_term_ids'] ) ? $settings['posts_exclude_term_ids'] : '',
1752	'posts_offset' => isset( $settings['posts_offset'] ) ? $settings['posts_offset'] : 0,
1753	'posts_select_date' => isset( $settings['posts_select_date'] ) ? $settings['posts_select_date'] : '',
1754	'posts_date_before' => isset( $settings['posts_date_before'] ) ? $settings['posts_date_before'] : '',
1755	'posts_date_after' => isset( $settings['posts_date_after'] ) ? $settings['posts_date_after'] : '',
1756	'posts_orderby' => isset( $settings['posts_orderby'] ) ? $settings['posts_orderby'] : 'date',
1757	'posts_order' => isset( $settings['posts_order'] ) ? $settings['posts_order'] : 'DESC',
1758	'posts_ignore_sticky_posts' => isset( $settings['posts_ignore_sticky_posts'] ) ? $settings['posts_ignore_sticky_posts'] : 'no',
1759	'posts_only_with_featured_image'=> isset( $settings['posts_only_with_featured_image'] ) ? $settings['posts_only_with_featured_image'] : 'no',
1760	// Grid Settings
1761	'show_title' => isset( $settings['show_title'] ) ? $settings['show_title'] : 'yes',
1762	'title_tags' => isset( $settings['title_tags'] ) ? $settings['title_tags'] : 'h3',
1763	'show_excerpt' => isset( $settings['show_excerpt'] ) ? $settings['show_excerpt'] : 'yes',
1764	'show_author' => isset( $settings['show_author'] ) ? $settings['show_author'] : 'yes',
1765	'show_date' => isset( $settings['show_date'] ) ? $settings['show_date'] : 'yes',
1766	'show_time' => isset( $settings['show_time'] ) ? $settings['show_time'] : 'no',
1767	'upk_link_new_tab' => isset( $settings['upk_link_new_tab'] ) ? $settings['upk_link_new_tab'] : 'no',
1768	'show_category' => isset( $settings['show_category'] ) ? $settings['show_category'] : 'yes',
1769	'content_on_image' => isset( $settings['content_on_image'] ) ? $settings['content_on_image'] : 'no',
1770	'readmore_type' => isset( $settings['readmore_type'] ) ? $settings['readmore_type'] : 'none',
1771	'readmore_text' => isset( $settings['readmore_text'] ) ? $settings['readmore_text'] : 'Read More',
1772	'readmore_icon' => isset( $settings['readmore_icon'] ) ? $settings['readmore_icon'] : '',
1773	'readmore_icon_align' => isset( $settings['readmore_icon_align'] ) ? $settings['readmore_icon_align'] : 'right',
1774	'show_reading_time' => isset( $settings['show_reading_time'] ) ? $settings['show_reading_time'] : 'no',
1775	'avg_reading_speed' => isset( $settings['avg_reading_speed'] ) ? $settings['avg_reading_speed'] : 200,
1776	'hide_seconds' => isset( $settings['hide_seconds'] ) ? $settings['hide_seconds'] : 'no',
1777	'hide_minutes' => isset( $settings['hide_minutes'] ) ? $settings['hide_minutes'] : 'no',
1778	'meta_separator' => isset( $settings['meta_separator'] ) ? $settings['meta_separator'] : '\|',
1779	'human_diff_time' => isset( $settings['human_diff_time'] ) ? $settings['human_diff_time'] : 'no',
1780	'human_diff_time_short' => isset( $settings['human_diff_time_short'] ) ? $settings['human_diff_time_short'] : 'no',
1781	'show_post_format' => isset( $settings['show_post_format'] ) ? $settings['show_post_format'] : 'no',
1782	'excerpt_length' => isset( $settings['excerpt_length'] ) ? $settings['excerpt_length'] : 20,
1783	'title_style' => isset( $settings['title_style'] ) ? $settings['title_style'] : 'underline',
1784	'global_link' => isset( $settings['global_link'] ) ? $settings['global_link'] : 'no',
1785	];
1786
1787	$this->add_render_attribute(
1788	[
1789	'upk-alter-grid' => [
1790	'data-settings' => [
1791	wp_json_encode( $ajax_settings ),
1792	],
1793	],
1794	]
1795	);
1796	}
1797
1798	if (isset($settings['upk_in_animation_show']) && ($settings['upk_in_animation_show'] == 'yes')) {
1799	$this->add_render_attribute('grid-wrap', 'class', 'upk-in-animation');
1800	if (isset($settings['upk_in_animation_delay']['size'])) {
1801	$this->add_render_attribute('grid-wrap', 'data-in-animation-delay', $settings['upk_in_animation_delay']['size']);
1802	}
1803	}
1804
1805	?>
1806
1807	<div <?php $this->print_render_attribute_string('upk-alter-grid'); ?>>
1808	<div <?php $this->print_render_attribute_string('grid-wrap'); ?>>
1809
1810	<?php while ($wp_query->have_posts()) :
1811	$wp_query->the_post();
1812
1813	$thumbnail_size = $settings['primary_thumbnail_size'];
1814
1815	?>
1816
1817	<?php $this->render_post_grid_item(get_the_ID(), $thumbnail_size, $settings['excerpt_length']); ?>
1818
1819	<?php endwhile; ?>
1820	</div>
1821	</div>
1822
1823	<?php $this->render_ajax_loadmore(); ?>
1824
1825	<?php
1826
1827	if ($settings['show_pagination']) { ?>
1828	<div class="ep-pagination">
1829	<?php ultimate_post_kit_post_pagination($wp_query, $this->get_id()); ?>
1830	</div>
1831	<?php
1832	}
1833	wp_reset_postdata();
1834	}
1835	}
1836