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

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

1,186 lines 40.2 KB

Raw Download Zip

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