Blog_Grid.php — Spider Elements – Premium Elementor Widgets & Addons Library 1.6.3

spider-elements / widgets / Blog_Grid.php

spider-elements / widgets Last commit date

templates 1 year ago Accordion.php 1 year ago Alerts_Box.php 1 year ago Before_after.php 1 year ago Blog_Grid.php 1 year ago Cheat_Sheet.php 1 year ago Counter.php 1 year ago Icon_Box.php 1 year ago Integrations.php 1 year ago List_Item.php 1 year ago Tabs.php 1 year ago Team_Carousel.php 1 year ago Testimonial.php 1 year ago Timeline.php 1 year ago Video_Playlist.php 1 year ago Video_Popup.php 1 year ago

Blog_Grid.php

1509 lines

1	<?php
2	/**
3	* Use namespace to avoid conflict
4	*/
5
6	namespace SPEL\Widgets;
7
8	use Elementor\Widget_Base;
9	use Elementor\Controls_Manager;
10	use Elementor\Group_Control_Typography;
11	// Exit if accessed directly
12	if ( ! defined( 'ABSPATH' ) ) {
13	exit;
14	}
15
16
17	/**
18	* Blog Grid
19	*
20	* Elementor widget for Blog Grid.
21	*
22	* @since 1.7.0
23	*/
24	class Blog_Grid extends Widget_Base {
25
26	public static function get_taxonomies( $cate = 'post', $type = 0 ) {
27	$post_cat = self::_get_terms( $cate );
28
29	$tag = isset( $post_cat[ $type ] ) && ! empty( $post_cat[ $type ] ) ? $post_cat[ $type ] : 'category';
30	$terms = get_terms( array(
31	'taxonomy' => $tag,
32	'orderby' => 'name',
33	'order' => 'DESC',
34	'hide_empty' => false,
35	'number' => 1500
36	) );
37
38	return $terms;
39	}
40
41	public function get_name() {
42	return 'docy_blog_grid'; // ID of the widget (Don't change this name)
43	}
44
45	public function get_title() {
46	return esc_html__( 'Blog Grid', 'spider-elements' );
47	}
48
49	public function get_icon() {
50	return 'eicon-post spel-icon';
51	}
52
53	public function get_categories() {
54	return [ 'spider-elements' ];
55	}
56
57	/**
58	* Name: get_style_depends()
59	* Desc: Register the required CSS dependencies for the frontend.
60	*/
61	public function get_style_depends() {
62	return [ 'slick', 'slick-theme', 'spel-main' ];
63	}
64
65	/**
66	* Name: get_script_depends()
67	* Desc: Register the required JS dependencies for the frontend.
68	*/
69	public function get_script_depends() {
70	return [ 'slick', 'spel-el-widgets' ];
71	}
72
73	/**
74	* Name: register_controls()
75	* Desc: Register controls for these widgets
76	* Params: no params
77	* Return: @void
78	* Since: @1.0.0
79	* Package: @spider-elements
80	* Author: spider-themes
81	*/
82	protected function register_controls() {
83	$this->elementor_layout_setting();
84	$this->elementor_post_setting();
85	//style section
86	$this->elementor_blog_style_section();
87
88	}
89
90	/**
91	* Name: elementor_layout_setting()
92	* Desc: Register the Content Tab output on the Elementor editor.
93	* Params: no params
94	* Return: @void
95	* Since: @1.0.0
96	* Package: @spider-elements
97	* Author: spider-themes
98	*/
99	public function elementor_layout_setting() {
100
101	//============================= Filter Options =================================== //
102	$this->start_controls_section(
103	'blog_layout', [
104	'label' => esc_html__( 'Layout', 'spider-elements' ),
105	]
106	);
107
108	// Style
109	$this->add_control(
110	'style', [
111	'label' => esc_html__( 'Skin', 'spider-elements' ),
112	'type' => Controls_Manager::CHOOSE,
113	'options' => [
114	'1' => [
115	'title' => esc_html__( 'Style 01', 'spider-elements' ),
116	'icon' => 'blog_1',
117	],
118	'2' => [
119	'title' => esc_html__( 'Style 02', 'spider-elements' ),
120	'icon' => 'blog_2',
121	],
122	'3' => [
123	'title' => esc_html__( 'Style 03', 'spider-elements' ),
124	'icon' => 'blog_3',
125	],
126	'4' => [
127	'title' => esc_html__( 'Style 04', 'spider-elements' ),
128	'icon' => 'blog_4',
129	],
130	'5' => [
131	'title' => esc_html__( 'Blog Carousel 05', 'spider-elements' ),
132	'icon' => 'blog_5',
133	],
134	],
135	'toggle' => false,
136	'default' => '1',
137	]
138	);
139
140	$this->add_control(
141	'column_grid', [
142	'label' => esc_html__( 'Column', 'spider-elements' ),
143	'type' => Controls_Manager::SELECT,
144	'options' => [
145	'6' => esc_html__( 'Two Column', 'spider-elements' ),
146	'4' => esc_html__( 'Three Column', 'spider-elements' ),
147	'3' => esc_html__( 'Four Column', 'spider-elements' ),
148	'2' => esc_html__( 'Six Column', 'spider-elements' ),
149	],
150	'default' => '4 ',
151	'condition' => [
152	'style' => [ '1', '2', '3', '4', ],
153	'style!' => [ '5' ]
154	]
155	]
156	);
157
158	$this->end_controls_section(); //End Filter
159
160	// arrow icon control section
161	$this->start_controls_section(
162	'arrow_icon_section', [
163	'label' => esc_html__( 'Arrow Icon', 'spider-elements' ),
164	'condition' => [
165	'style' => [ '5' ],
166	'style!' => [ '1', '2', '3', '4', ]
167	]
168	]
169	);
170
171	$this->add_control(
172	'left_arrow_icon', [
173	'label' => esc_html__( 'Left Icon', 'spider-elements' ),
174	'type' => Controls_Manager::ICONS,
175	'label_block' => true,
176	'default' => [
177	'value' => 'arrow_carrot-left',
178	'library' => 'ElegantIcons',
179	],
180	]
181	);
182
183	$this->add_control(
184	'right_arrow_icon', [
185	'label' => esc_html__( 'Right Icon', 'spider-elements' ),
186	'type' => Controls_Manager::ICONS,
187	'default' => [
188	'value' => 'arrow_carrot-right',
189	'library' => 'ElegantIcons',
190	],
191	]
192	);
193
194	$this->end_controls_section();
195
196	}
197
198	/**
199	* Name: elementor_post_setting()
200	* Desc: Register the Content Tab output on the Elementor editor.
201	* Params: no params
202	* Return: @void
203	* Since: @1.0.0
204	* Package: @spider-elements
205	* Author: spider-themes
206	*/
207
208	public function elementor_post_setting() {
209
210	$this->start_controls_section(
211	'settings_section',
212	[
213	'label' => esc_html__( 'Query Settings', 'spider-elements' ),
214	'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
215	]
216	);
217	$this->add_control(
218	'blog_queryby', [
219	'label' => esc_html__( 'Query by', 'spider-elements' ),
220	'type' => \Elementor\Controls_Manager::CHOOSE,
221	'options' => apply_filters( 'blog_query_by', [
222	'all' => [
223	'title' => esc_html__( 'All', 'spider-elements' ),
224	'icon' => 'fas fa-border-none',
225	],
226	'categories' => [
227	'title' => esc_html__( 'By Categories', 'spider-elements' ),
228	'icon' => 'eicon-product-categories',
229	],
230	'posts' => [
231	'title' => esc_html__( 'By Posts', 'spider-elements' ),
232	'icon' => 'eicon-post-list',
233	],
234	'postype' => [
235	'title' => esc_html__( 'By Posttype', 'spider-elements' ),
236	'icon' => 'eicon-editor-list-ul',
237	],
238
239	] ),
240	'default' => 'all',
241
242	]
243	);
244
245	$this->add_control(
246	'blog_bycategories',
247	[
248	'label' => esc_html__( 'By Categories', 'spider-elements' ),
249	'type' => \Elementor\Controls_Manager::HEADING,
250	'condition' => [
251	'blog_queryby' => [ 'categories' ]
252	],
253	]
254	);
255
256	$this->add_control(
257	'blog_categories',
258	[
259	'label' => esc_html__( 'Select Categories', 'spider-elements' ),
260	'type' => \Elementor\Controls_Manager::SELECT2,
261	'multiple' => true,
262	'options' => self::get_category(),
263	'default' => [],
264	'condition' => [
265	'blog_queryby' => [ 'categories' ]
266	],
267	]
268	);
269
270	$this->add_control(
271	'blog_byposts',
272	[
273	'label' => esc_html__( 'By Posts', 'spider-elements' ),
274	'type' => \Elementor\Controls_Manager::HEADING,
275	'condition' => [
276	'blog_queryby' => [ 'posts' ]
277	],
278	]
279	);
280
281	$this->add_control(
282	'blog_post',
283	[
284	'label' => esc_html__( 'Select Posts', 'spider-elements' ),
285	'type' => \Elementor\Controls_Manager::SELECT2,
286	'multiple' => true,
287	'options' => self::get_posts(),
288	'default' => [],
289	'condition' => [
290	'blog_queryby' => [ 'posts' ]
291	],
292	]
293	);
294
295	$this->add_control(
296	'blog_byposttype',
297	[
298	'label' => esc_html__( 'By Posttype', 'spider-elements' ),
299	'type' => \Elementor\Controls_Manager::HEADING,
300	'condition' => [
301	'blog_queryby' => [ 'postype' ]
302	],
303	]
304	);
305
306	$this->add_control(
307	'blog_posttype',
308	[
309	'label' => esc_html__( 'Select Postype', 'spider-elements' ),
310	'type' => \Elementor\Controls_Manager::SELECT2,
311	'multiple' => true,
312	'options' => self::get_posttype(),
313	'default' => [],
314	'condition' => [
315	'blog_queryby' => [ 'postype' ]
316	],
317	]
318	);
319
320	$this->add_control(
321	'blog_otherquery',
322	[
323	'label' => esc_html__( 'Others Filter', 'spider-elements' ),
324	'type' => \Elementor\Controls_Manager::HEADING,
325	'separator' => 'before',
326	]
327	);
328
329	$this->add_control(
330	'blog_order_by',
331	[
332	'label' => esc_html__( 'Order by', 'spider-elements' ),
333	'type' => \Elementor\Controls_Manager::SELECT,
334	'options' => [
335	'date' => esc_html__( 'Date', 'spider-elements' ),
336	'title' => esc_html__( 'Title', 'spider-elements' ),
337	'author' => esc_html__( 'Author', 'spider-elements' ),
338	'comment_count' => esc_html__( 'Comments', 'spider-elements' ),
339	],
340	'default' => 'date',
341	]
342	);
343
344	$this->add_control(
345	'blog_order',
346	[
347	'label' => esc_html__( 'Order', 'spider-elements' ),
348	'type' => \Elementor\Controls_Manager::SELECT,
349	'options' => [
350	'ASC' => esc_html__( 'ASC', 'spider-elements' ),
351	'DESC' => esc_html__( 'DESC', 'spider-elements' ),
352	],
353	'default' => 'DESC',
354	]
355	);
356
357	$this->add_control(
358	'blog_offset',
359	[
360	'label' => esc_html__( 'Offset', 'spider-elements' ),
361	'type' => \Elementor\Controls_Manager::NUMBER,
362	'min' => 0,
363	'max' => 15,
364	'default' => 0,
365	]
366	);
367
368	$this->add_control(
369	'blog_limit',
370	[
371	'label' => esc_html__( 'Limit Display', 'spider-elements' ),
372	'type' => \Elementor\Controls_Manager::NUMBER,
373	'min' => 1,
374	'max' => 100,
375	'default' => 5,
376	]
377	);
378	$this->add_control(
379	'content_limit',
380	[
381	'label' => esc_html__( 'Content Limit Display', 'spider-elements' ),
382	'type' => \Elementor\Controls_Manager::NUMBER,
383	'min' => 1,
384	'max' => 100,
385	'default' => 11,
386	'condition' => [
387	'style' => [ '2' ]
388	]
389	]
390	);
391
392	$this->add_control(
393	'title_length', [
394	'label' => esc_html__( 'Title Length', 'spider-elements' ),
395	'type' => Controls_Manager::NUMBER,
396	'default' => 8
397	]
398	);
399
400	$this->end_controls_section();
401	}
402
403	public static function get_category( $cate = 'post' ) {
404	$post_cat = self::_get_terms( $cate );
405
406	$taxonomy = isset( $post_cat[0] ) && ! empty( $post_cat[0] ) ? $post_cat[0] : [ 'category' ];
407	$query_args = [
408	'taxonomy' => $taxonomy,
409	'orderby' => 'name',
410	'order' => 'DESC',
411	'hide_empty' => false,
412	'number' => 1500
413	];
414	$terms = get_terms( $query_args );
415
416	$options = [];
417	$count = count( (array) $terms );
418	if ( $count > 0 ):
419	foreach ( $terms as $term ) {
420	if ( $term->parent == 0 ) {
421	$options[ $term->term_id ] = $term->name;
422	foreach ( $terms as $subcategory ) {
423	if ( $subcategory->parent == $term->term_id ) {
424	$options[ $subcategory->term_id ] = $subcategory->name;
425	}
426	}
427	}
428	}
429	endif;
430
431	return $options;
432	}
433
434	public static function _get_terms( $post = 'post' ) {
435	$taxonomy_objects = get_object_taxonomies( $post );
436
437	return $taxonomy_objects;
438	}
439
440	public static function get_posts() {
441	$post_args = get_posts(
442	array(
443	'posts_per_page' => - 1,
444	'post_status' => 'publish',
445	)
446	);
447
448	$posts = get_posts( $post_args );
449	$posts_list = [];
450	if ( is_array( $posts ) ) {
451	foreach ( $posts as $_key => $object ) {
452	$posts_list[ $object->ID ] = $object->post_title;
453	}
454	}
455
456	return $posts_list;
457	}
458
459	public static function get_posttype() {
460	$post_types = get_post_types(
461	array(
462	'public' => true,
463	),
464	'objects'
465	);
466
467	$options = array();
468
469	if ( is_array( $post_types ) ) {
470	foreach ( $post_types as $post_type ) {
471	$options[ $post_type->name ] = $post_type->label;
472	}
473	}
474
475	return $options;
476	}
477
478	/**
479	* Name: elementor_blog_style_section()
480	* Desc: Register the Content Tab output on the Elementor editor.
481	* Params: no params
482	* Return: @void
483	* Since: @1.0.0
484	* Package: @spider-elements
485	* Author: spider-themes
486	*/
487	public function elementor_blog_style_section() {
488	$this->blog_general_style();
489	$this->blog_image_style();
490	$this->blog_content_style();
491	$this->button_style();
492	$this->meta_style();
493	$this->icon_style();
494	}
495
496	public function blog_general_style() {
497	$this->start_controls_section(
498	'blog_general_styles',
499	[
500	'label' => esc_html__( 'Blog Item', 'spider-elements' ),
501	'tab' => \Elementor\Controls_Manager::TAB_STYLE,
502	]
503	);
504
505
506	$this->start_controls_tabs(
507	'blog_style_tabs',
508	[
509	'condition' => [
510	'style' => [ '1', '2', '3', '4', ],
511	'style!' => [ '5' ]
512	]
513	]
514	);
515
516	$this->start_controls_tab(
517	'blog_style_normal_tab',
518	[
519	'label' => esc_html__( 'Normal', 'spider-elements' ),
520	]
521	);
522
523	$this->add_group_control(
524	\Elementor\Group_Control_Background::get_type(),
525	[
526	'name' => 'background',
527	'types' => [ 'classic', 'gradient' ],
528	'exclude' => [ 'image' ],
529	'selector' => '{{WRAPPER}} .blog-meta-two,
530	{{WRAPPER}} .blog-meta-one',
531	]
532	);
533
534	$this->end_controls_tab();
535
536	$this->start_controls_tab(
537	'blog_style_hover_tab',
538	[
539	'label' => esc_html__( 'Hover', 'spider-elements' ),
540	]
541	);
542
543	$this->add_group_control(
544	\Elementor\Group_Control_Background::get_type(),
545	[
546	'name' => 'hover_background',
547	'types' => [ 'classic', 'gradient' ],
548	'exclude' => [ 'image' ],
549	'selector' => '{{WRAPPER}} .blog-meta-two:hover,
550	{{WRAPPER}} .blog-meta-one:hover',
551	]
552	);
553
554	$this->end_controls_tab();
555
556	$this->end_controls_tabs();
557
558	$this->add_responsive_control(
559	'blog_margin',
560	[
561	'label' => esc_html__( 'Margin', 'spider-elements' ),
562	'type' => Controls_Manager::DIMENSIONS,
563	'size_units' => [ 'px' ],
564	'separator' => 'before',
565	'range' => [
566	'px' => [
567	'min' => - 100,
568	'max' => 100,
569	'step' => 5,
570	],
571	],
572	'default' => [
573	'unit' => 'px',
574	'size' => 10,
575	],
576	'selectors' => [
577	'{{WRAPPER}} .blog-grid' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
578	],
579	'condition' => [
580	'style' => [ '1', '2', '3', '4', ],
581	'style!' => [ '5' ]
582	]
583	]
584	);
585
586	$this->add_responsive_control(
587	'blog_item_padding',
588	[
589	'label' => esc_html__( 'Padding', 'spider-elements' ),
590	'type' => Controls_Manager::DIMENSIONS,
591	'size_units' => [ 'px' ],
592	'range' => [
593	'px' => [
594	'min' => - 100,
595	'max' => 100,
596	'step' => 5,
597	],
598	],
599	'default' => [
600	'unit' => 'px',
601	'size' => 10,
602	],
603	'selectors' => [
604	'{{WRAPPER}} .blog-meta-two' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
605	'{{WRAPPER}} .blog-meta-one' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
606	'{{WRAPPER}} .card-style-six .blog-item-six' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
607	],
608	]
609	);
610
611	$this->add_responsive_control(
612	'blog_item_radius',
613	[
614	'label' => esc_html__( 'Border Radius', 'spider-elements' ),
615	'type' => Controls_Manager::DIMENSIONS,
616	'size_units' => [ 'px' ],
617	'selectors' => [
618	'{{WRAPPER}} .blog-meta-two' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
619	'{{WRAPPER}} .blog-meta-one' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
620	],
621	'condition' => [
622	'style' => [ '1', '2', '3', '4', ],
623	'style!' => [ '5' ]
624	]
625	]
626	);
627
628	$this->end_controls_section();
629	}
630
631	//============ Start Image Style Control Section ================//
632	public function blog_image_style() {
633	$this->start_controls_section(
634	'blog_image_tab',
635	[
636	'label' => esc_html__( 'Image', 'spider-elements' ),
637	'tab' => \Elementor\Controls_Manager::TAB_STYLE,
638	'condition' => [
639	'style' => [ '1', '2', '3', '4' ]
640	]
641	]
642	);
643
644	$this->add_responsive_control(
645	'blog_img_radius',
646	[
647	'label' => esc_html__( 'Border Radius', 'spider-elements' ),
648	'type' => Controls_Manager::DIMENSIONS,
649	'size_units' => [ 'px' ],
650	'selectors' => [
651	'{{WRAPPER}} .blog-meta-two .post-img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
652	'{{WRAPPER}} .blog-meta-one .post-img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
653	],
654	]
655	);
656
657	$this->add_responsive_control(
658	'blog_img_margin',
659	[
660	'label' => esc_html__( 'Margin Bottom', 'spider-elements' ),
661	'description' => esc_html__( 'Spacing between the image', 'spider-elements' ),
662	'type' => Controls_Manager::SLIDER,
663	'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
664	'range' => [
665	'px' => [
666	'max' => 250,
667	],
668	'em' => [
669	'max' => 0,
670	],
671	],
672	'selectors' => [
673	'{{WRAPPER}} .blog-meta-two .post-img' => 'margin-bottom: {{SIZE}}{{UNIT}} !important;',
674	'{{WRAPPER}} .blog-meta-one .post-img' => 'margin-bottom: {{SIZE}}{{UNIT}};',
675	],
676	'condition' => [
677	'style' => [ '1', '2', '3', '4' ],
678	'style!' => [ '5' ]
679	],
680	]
681	);
682
683	$this->end_controls_section();
684	}
685
686
687	//============ Start Content Section Control============
688	public function blog_content_style() {
689
690	$this->start_controls_section(
691	'blog_content_tab',
692	[
693	'label' => esc_html__( 'Contents', 'spider-elements' ),
694	'tab' => \Elementor\Controls_Manager::TAB_STYLE,
695	]
696	);
697
698	$this->start_controls_tabs(
699	'style_blog_title_tabs'
700	);
701
702	//=== blog Normal icon
703	$this->start_controls_tab(
704	'style_blog_title_normal',
705	[
706	'label' => esc_html__( 'Normal', 'spider-elements' ),
707	]
708	);
709
710	$this->add_control(
711	'blog_title_options', [
712	'label' => esc_html__( 'Title', 'spider-elements' ),
713	'type' => Controls_Manager::HEADING,
714	]
715	);
716
717	$this->add_group_control(
718	Group_Control_Typography::get_type(),
719	[
720	'name' => 'blog_content_title',
721	'selector' => '{{WRAPPER}} .blog-meta-two .blog-title,
722	{{WRAPPER}} .blog-meta-one .blog-title,
723	{{WRAPPER}} .blog-six-title',
724	]
725	);
726
727	$this->add_control(
728	'blog_title_color',
729	[
730	'label' => esc_html__( 'Color', 'spider-elements' ),
731	'type' => Controls_Manager::COLOR,
732	'default' => '',
733	'selectors' => [
734	'{{WRAPPER}} .blog-meta-two .blog-title' => 'color: {{VALUE}};',
735	'{{WRAPPER}} .blog-meta-one .blog-title' => 'color: {{VALUE}};',
736	'{{WRAPPER}} .blog-six-title' => 'color: {{VALUE}};',
737	],
738	]
739	);
740
741	$this->add_responsive_control(
742	'blog_title_margin',
743	[
744	'label' => esc_html__( 'Margin', 'spider-elements' ),
745	'type' => Controls_Manager::DIMENSIONS,
746	'size_units' => [ 'px' ],
747	'range' => [
748	'px' => [
749	'min' => - 100,
750	'max' => 100,
751	'step' => 5,
752	],
753	],
754	'default' => [
755	'unit' => 'px',
756	'size' => 10,
757	],
758	'selectors' => [
759	'{{WRAPPER}} .blog-meta-two .blog-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
760	'{{WRAPPER}} .blog-meta-one .blog-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
761	],
762	'condition' => [
763	'style' => [ '1', '2', '3', '4', ],
764	'style!' => [ '5' ]
765	]
766	]
767	);
768
769	$this->end_controls_tab(); //End Normal title
770
771	//=== Hover icon====
772	$this->start_controls_tab(
773	'blog_hover_title', [
774	'label' => esc_html__( 'Hover', 'spider-elements' ),
775	]
776	);
777
778	$this->add_control(
779	'blog_title_hover_heading',
780	[
781	'label' => esc_html__( 'Title', 'spider-elements' ),
782	'type' => Controls_Manager::HEADING,
783	]
784	);
785
786	$this->add_control(
787	'blog_title_hover_color',
788	[
789	'label' => esc_html__( 'Color', 'spider-elements' ),
790	'type' => Controls_Manager::COLOR,
791	'default' => '',
792	'selectors' => [
793	'{{WRAPPER}} .blog-meta-two .blog-title:hover' => 'color: {{VALUE}};',
794	'{{WRAPPER}} .blog-meta-one .blog-title:hover' => 'color: {{VALUE}};',
795	'{{WRAPPER}} .blog-six-title:hover' => 'color: {{VALUE}};',
796	],
797	]
798	);
799
800	$this->end_controls_tab(); // End title hover
801	$this->end_controls_tabs(); // end normal and hover title tabs
802
803
804	//===============Blog Style 2, Description Style......................
805	$this->add_control(
806	'blog_description_options', [
807	'label' => esc_html__( 'Description', 'spider-elements' ),
808	'type' => Controls_Manager::HEADING,
809	'separator' => 'before',
810	'condition' => [
811	'style' => [ '2' ],
812	'style!' => [ '1', '3', '4', '5' ]
813	],
814	]
815	);
816
817	$this->add_group_control(
818	\Elementor\Group_Control_Typography::get_type(),
819	[
820	'name' => 'description_typography',
821	'selector' => '{{WRAPPER}} .blog-meta-one p',
822	'condition' => [
823	'style' => [ '2' ],
824	'style!' => [ '1', '3', '4', '5' ]
825	],
826	]
827
828	);
829
830	$this->add_control(
831	'blog_description_color',
832	[
833	'label' => esc_html__( 'Text Color', 'spider-elements' ),
834	'type' => Controls_Manager::COLOR,
835	'default' => '',
836	'selectors' => [
837	'{{WRAPPER}} .blog-meta-one p' => 'color: {{VALUE}};',
838	],
839	'condition' => [
840	'style' => [ '2' ],
841	'style!' => [ '1', '3', '4', '5' ]
842	],
843	]
844	);
845
846	// End //
847
848	$this->end_controls_section();
849	}
850
851
852	//===================Start Blog Grid Button Style Controls===============//
853	public function button_style() {
854	$this->start_controls_section(
855	'blog_button_tab',
856	[
857	'label' => esc_html__( 'Button', 'spider-elements' ),
858	'tab' => \Elementor\Controls_Manager::TAB_STYLE,
859	'condition' => [
860	'style' => [ '1', '2', '4', ]
861	]
862	]
863	);
864
865	// ===== Button Style Tabs=====//
866	$this->start_controls_tabs(
867	'style_btn_tabs'
868	);
869
870	//==== Normal ====//
871	$this->start_controls_tab(
872	'blog_normal_btn', [
873	'label' => esc_html__( 'Normal', 'spider-elements' ),
874	]
875	);
876
877	$this->add_group_control(
878	\Elementor\Group_Control_Typography::get_type(),
879	[
880	'name' => 'content_typography',
881	'selector' =>
882	'{{WRAPPER}} .blog-meta-two .continue-btn,
883	{{WRAPPER}} .blog-meta-two .read-more-btn a,
884	{{WRAPPER}} .blog-meta-one .continue-btn',
885	]
886	);
887
888	$this->add_group_control(
889	\Elementor\Group_Control_Background::get_type(),
890	[
891	'name' => 'btn_background',
892	'types' => [ 'classic', 'gradient' ],
893	'exclude' => [ 'image' ],
894	'selector' => '{{WRAPPER}} .blog-meta-two .continue-btn.btn-seven',
895	'condition' => [
896	'style' => '4'
897	],
898	]
899	);
900
901	$this->add_control(
902	'blog_button_color',
903	[
904	'label' => esc_html__( 'Text Color', 'spider-elements' ),
905	'type' => Controls_Manager::COLOR,
906	'default' => '',
907	'selectors' => [
908	'{{WRAPPER}} .blog-meta-two .continue-btn' => 'color: {{VALUE}};',
909	'{{WRAPPER}} .blog-meta-two .read-more-btn a' => 'color: {{VALUE}};',
910	'{{WRAPPER}} .blog-meta-one .continue-btn' => 'color: {{VALUE}};',
911	],
912	]
913	);
914
915	$this->add_responsive_control(
916	'blog_btn_padding',
917	[
918	'label' => esc_html__( 'Padding', 'spider-elements' ),
919	'type' => Controls_Manager::DIMENSIONS,
920	'size_units' => [ 'px' ],
921	'range' => [
922	'px' => [
923	'min' => - 100,
924	'max' => 100,
925	'step' => 5,
926	],
927	],
928	'default' => [
929	'unit' => 'px',
930	'size' => 10,
931	],
932	'selectors' => [
933	'{{WRAPPER}} .blog-meta-two .continue-btn.btn-seven' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
934	],
935	'condition' => [
936	'style' => '4'
937	],
938	]
939	);
940
941	$this->add_group_control(
942	\Elementor\Group_Control_Border::get_type(),
943	[
944	'name' => 'button_border_color',
945	'label' => esc_html__( 'Border', 'spider-elements' ),
946	'selector' => '{{WRAPPER}} .blog-meta-two .continue-btn.btn-seven',
947	'condition' => [
948	'style' => '4'
949	],
950	]
951	);
952
953	$this->add_responsive_control(
954	'button_border_radius',
955	[
956	'label' => esc_html__( 'Border Radius', 'spider-elements' ),
957	'type' => Controls_Manager::DIMENSIONS,
958	'size_units' => [ 'px' ],
959	'selectors' => [
960	'{{WRAPPER}} .blog-meta-two .continue-btn.btn-seven' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
961	],
962	'condition' => [
963	'style' => '4'
964	],
965	]
966	);
967
968	$this->end_controls_tab();
969
970	//=== Button Hover ====//
971	$this->start_controls_tab(
972	'blog_hover_btn', [
973	'label' => esc_html__( 'Hover', 'spider-elements' ),
974	]
975	);
976
977	$this->add_group_control(
978	\Elementor\Group_Control_Background::get_type(),
979	[
980	'name' => 'btn_hover_background',
981	'types' => [ 'classic', 'gradient' ],
982	'exclude' => [ 'image' ],
983	'selector' => '{{WRAPPER}} .blog-meta-two .continue-btn.btn-seven:hover',
984	'condition' => [
985	'style' => '4'
986	],
987	]
988	);
989
990	$this->add_control(
991	'blog_button_hover_color',
992	[
993	'label' => esc_html__( 'Text Color', 'spider-elements' ),
994	'type' => Controls_Manager::COLOR,
995	'default' => '',
996	'selectors' => [
997	'{{WRAPPER}} .blog-meta-two .continue-btn:hover' => 'color: {{VALUE}};',
998	'{{WRAPPER}} .blog-meta-two .read-more-btn a:hover' => 'color: {{VALUE}};',
999	'{{WRAPPER}} .blog-meta-one .continue-btn:hover' => 'color: {{VALUE}};',
1000	],
1001	]
1002	);
1003
1004	$this->add_control(
1005	'button_hover_border_color',
1006	[
1007	'label' => esc_html__( 'Border Color', 'spider-elements' ),
1008	'type' => \Elementor\Controls_Manager::COLOR,
1009	'selectors' => [
1010	'{{WRAPPER}} .blog-meta-two .continue-btn.btn-seven:hover' => 'border-color: {{VALUE}}',
1011	],
1012	'condition' => [
1013	'style' => '4'
1014	],
1015	]
1016	);
1017
1018	$this->end_controls_tab();
1019	$this->end_controls_tabs();
1020	$this->end_controls_section();
1021	}
1022
1023	//==================== Start Meta Style Section ==================//
1024	public function meta_style() {
1025	$this->start_controls_section(
1026	'blog_meta_tab',
1027	[
1028	'label' => esc_html__( 'Meta', 'spider-elements' ),
1029	'tab' => \Elementor\Controls_Manager::TAB_STYLE,
1030	'condition' => [
1031	'style' => [ '1', '2', '3', '4', ]
1032	]
1033	]
1034	);
1035
1036	$this->add_control(
1037	'date-heading',
1038	[
1039	'label' => esc_html__( 'Date', 'spider-elements' ),
1040	'type' => Controls_Manager::HEADING,
1041	'condition' => [
1042	'style' => [ '1', '2', '4', '5' ],
1043	'style!' => [ '3' ]
1044	],
1045	]
1046	);
1047
1048	$this->add_group_control(
1049	Group_Control_Typography::get_type(),
1050	[
1051	'name' => 'blog_meta_typography',
1052	'selector' => '{{WRAPPER}} .blog-meta-two .date a,
1053	{{WRAPPER}} .blog-meta-one .date a',
1054	'condition' => [
1055	'style' => [ '1', '2', '4' ],
1056	'style!' => [ '3', '5' ]
1057	],
1058	]
1059	);
1060
1061	$this->add_control(
1062	'blog_meta_color',
1063	[
1064	'label' => esc_html__( 'Text Color', 'spider-elements' ),
1065	'type' => Controls_Manager::COLOR,
1066	'default' => '',
1067	'selectors' => [
1068	'{{WRAPPER}} .blog-meta-two .date a' => 'color: {{VALUE}};',
1069	'{{WRAPPER}} .blog-meta-one .date a' => 'color: {{VALUE}};',
1070	'{{WRAPPER}} .blog-item .blog-meta .author-info h5, .blog-item .blog-meta .author-info span,
1071	.blog-item .blog-meta :is(.blog-category, .blog-category a, .blog-read)' => 'color: {{VALUE}} !important;',
1072	],
1073	'condition' => [
1074	'style' => [ '1', '2', '4', '5' ],
1075	'style!' => [ '3' ]
1076	],
1077	]
1078	);
1079
1080
1081	//============ Start meta category Style Controls =================//
1082	$this->add_control(
1083	'blog_category_options', [
1084	'label' => esc_html__( 'Category', 'spider-elements' ),
1085	'type' => Controls_Manager::HEADING,
1086	'separator' => 'before',
1087	'condition' => [
1088	'style' => [ '1', '3', '5' ],
1089	'style!' => [ '2', '4' ]
1090	],
1091	]
1092	);
1093
1094	$this->add_group_control(
1095	Group_Control_Typography::get_type(),
1096	[
1097	'name' => 'blog_category_typography',
1098	'selector' => '{{WRAPPER}} .blog-meta-one .tags,
1099	{{WRAPPER}} .blog-meta-two .post-img .tags,
1100	{{WRAPPER}} .blog-item .blog-meta .tags',
1101	]
1102	);
1103
1104	$this->start_controls_tabs(
1105	'cat_tabs', [
1106	'condition' => [
1107	'style' => [ '1', '3', '5' ],
1108	'style!' => [ '2', '4' ]
1109	],
1110	]
1111	);
1112
1113	$this->start_controls_tab(
1114	'cat_normal_tab',
1115	[
1116	'label' => esc_html__( 'Normal', 'spider-elements' ),
1117	]
1118	);
1119
1120	$this->add_control(
1121	'blog_category_color',
1122	[
1123	'label' => esc_html__( 'Text Color', 'spider-elements' ),
1124	'type' => Controls_Manager::COLOR,
1125	'default' => '',
1126	'selectors' => [
1127	'{{WRAPPER}} .blog-meta-two .post-img .tags' => 'color: {{VALUE}};',
1128	'{{WRAPPER}} .blog-meta-one .tags' => 'color: {{VALUE}};',
1129	'{{WRAPPER}} .blog-item .blog-meta .tags, .blog-read::before' => 'color: {{VALUE}};',
1130	],
1131	]
1132	);
1133
1134	$this->add_control(
1135	'first_category_bg',
1136	[
1137	'label' => esc_html__( 'Background', 'spider-elements' ),
1138	'type' => Controls_Manager::COLOR,
1139	'selectors' => [
1140	'{{WRAPPER}} .blog-meta-two .post-img .tags' => 'background: {{VALUE}};',
1141	],
1142	'condition' => [
1143	'style' => [ '1' ],
1144	'style!' => [ '2', '3', '4', '5' ]
1145	],
1146	]
1147	);
1148
1149	$this->end_controls_tab();
1150
1151	$this->start_controls_tab(
1152	'cat_hover_tab',
1153	[
1154	'label' => esc_html__( 'Hover', 'spider-elements' ),
1155	]
1156	);
1157
1158	$this->add_control(
1159	'category_hover_color',
1160	[
1161	'label' => esc_html__( 'Text Color', 'spider-elements' ),
1162	'type' => Controls_Manager::COLOR,
1163	'default' => '',
1164	'selectors' => [
1165	'{{WRAPPER}} .blog-meta-one .tags:hover' => 'color: {{VALUE}} !important;',
1166	'{{WRAPPER}} .blog-item .blog-meta .tags:hover' => 'color: {{VALUE}};',
1167	'{{WRAPPER}} .blog-meta-two .post-img .tags:hover' => 'color: {{VALUE}};',
1168	],
1169	]
1170	);
1171
1172	$this->add_control(
1173	'bg_hover_category',
1174	[
1175	'label' => esc_html__( 'Background', 'spider-elements' ),
1176	'type' => Controls_Manager::COLOR,
1177	'selectors' => [
1178	'{{WRAPPER}} .blog-meta-two .post-img .tags:hover' => 'background: {{VALUE}};',
1179	],
1180	'condition' => [
1181	'style' => [ '1' ],
1182	'style!' => [ '2', '3', '4', '5' ]
1183	],
1184	]
1185	);
1186
1187	$this->end_controls_tab();
1188
1189	$this->end_controls_tabs();
1190
1191	//============ End meta category Style Controls =================//
1192
1193	//============ Start meta Author Style Controls =================//
1194	$this->add_control(
1195	'blog_author_options', [
1196	'label' => esc_html__( 'Author Name', 'spider-elements' ),
1197	'type' => Controls_Manager::HEADING,
1198	'separator' => 'before',
1199	'condition' => [
1200	'style' => [ '3', '5' ],
1201	'style!' => [ '1', '2', '4' ]
1202	],
1203	]
1204	);
1205
1206	$this->add_group_control(
1207	\Elementor\Group_Control_Typography::get_type(),
1208	[
1209	'name' => 'author_typography',
1210	'selector' => '{{WRAPPER}} .blog-meta-one .author a,
1211	{{WRAPPER}} .blog-item .blog-meta .author-info h5 a',
1212	'condition' => [
1213	'style' => [ '3', '5' ],
1214	'style!' => [ '1', '2', '4' ]
1215	],
1216	]
1217	);
1218
1219
1220	$this->start_controls_tabs(
1221	'meta_style_tabs', [
1222	'condition' => [
1223	'style' => [ '3', '5' ],
1224	'style!' => [ '1', '2', '4' ]
1225	],
1226	]
1227	);
1228
1229	$this->start_controls_tab(
1230	'meta_style_normal_tab',
1231	[
1232	'label' => esc_html__( 'Normal', 'spider-elements' ),
1233	]
1234	);
1235
1236	$this->add_control(
1237	'author_color',
1238	[
1239	'label' => esc_html__( 'Text Color', 'spider-elements' ),
1240	'type' => \Elementor\Controls_Manager::COLOR,
1241	'selectors' => [
1242	'{{WRAPPER}} .blog-meta-one .post-data, .blog-meta-one .author a' => 'color: {{VALUE}}',
1243	'{{WRAPPER}} .blog-item .blog-meta .author-info h5 a' => 'color: {{VALUE}}',
1244	],
1245	]
1246	);
1247
1248	$this->end_controls_tab();
1249
1250	$this->start_controls_tab(
1251	'meta_style_hover_tab',
1252	[
1253	'label' => esc_html__( 'Hover', 'spider-elements' ),
1254	]
1255	);
1256
1257	$this->add_control(
1258	'blog_author_hover_color',
1259	[
1260	'label' => esc_html__( 'Text Color', 'spider-elements' ),
1261	'type' => Controls_Manager::COLOR,
1262	'default' => '',
1263	'selectors' => [
1264	'{{WRAPPER}} .blog-meta-one .author a:hover' => 'color: {{VALUE}};',
1265	'{{WRAPPER}} .blog-item .blog-meta .author-info h5 a:hover' => 'color: {{VALUE}};',
1266	],
1267	]
1268	);
1269
1270	$this->end_controls_tab();
1271
1272	$this->end_controls_tabs();
1273
1274	//============ End meta Author Style Controls =================//
1275
1276	$this->end_controls_section();
1277	}
1278
1279	//==================== End Meta Style Section ==================//
1280
1281	public function icon_style() {
1282	$this->start_controls_section(
1283	'blog_icon_tab',
1284	[
1285	'label' => esc_html__( 'Icon', 'spider-elements' ),
1286	'tab' => \Elementor\Controls_Manager::TAB_STYLE,
1287	'condition' => [
1288	'style' => [ '5' ],
1289	'style!' => [ '1', '2', '3', '4', ]
1290	]
1291	]
1292	);
1293
1294	// Blog icon Normal/hover/ State
1295	$this->start_controls_tabs(
1296	'style_blog_icon_tabs'
1297	);
1298
1299	//=== blog Normal icon
1300	$this->start_controls_tab(
1301	'style_blog_icon_normal',
1302	[
1303	'label' => esc_html__( 'Normal', 'spider-elements' ),
1304	]
1305	);
1306
1307	$this->add_control(
1308	'blog_icon_color',
1309	[
1310	'label' => esc_html__( 'Color', 'spider-elements' ),
1311	'type' => Controls_Manager::COLOR,
1312	'selectors' => [
1313	'{{WRAPPER}} .slick-arrow' => 'color: {{VALUE}}',
1314	],
1315	]
1316	);
1317
1318	$this->add_control(
1319	'blog_icon_bg_color',
1320	[
1321	'label' => esc_html__( 'Background', 'spider-elements' ),
1322	'type' => Controls_Manager::COLOR,
1323	'selectors' => [
1324	'{{WRAPPER}} .slick-arrow' => 'background: {{VALUE}};',
1325
1326	],
1327	]
1328	);
1329
1330	$this->end_controls_tab(); //End Normal icon
1331
1332	//=== Hover icon====
1333	$this->start_controls_tab(
1334	'blog_hover_icon', [
1335	'label' => esc_html__( 'Hover', 'spider-elements' ),
1336	]
1337	);
1338
1339	$this->add_control(
1340	'icon_hover_color', [
1341	'label' => esc_html__( 'Color', 'spider-elements' ),
1342	'type' => Controls_Manager::COLOR,
1343	'selectors' => [
1344	'{{WRAPPER}} .slick-arrow:hover' => 'color: {{VALUE}};',
1345	],
1346	]
1347	);
1348
1349	$this->add_control(
1350	'icon_hover_bg_color', [
1351	'label' => esc_html__( 'Background', 'spider-elements' ),
1352	'type' => Controls_Manager::COLOR,
1353	'selectors' => [
1354	'{{WRAPPER}} .slick-arrow:hover' => 'background: {{VALUE}};',
1355	],
1356	]
1357	);
1358
1359	$this->add_control(
1360	'icon_border_color',
1361	[
1362	'label' => esc_html__( 'Border Color', 'spider-elements' ),
1363	'type' => Controls_Manager::COLOR,
1364	'selectors' => [
1365	'{{WRAPPER}} .slick-arrow:hover' => 'border-color: {{VALUE}}',
1366	],
1367	]
1368	);
1369
1370	$this->end_controls_tab(); // End Active Tab Title
1371	$this->end_controls_tabs(); // End Accordion icon Normal/Active/ State
1372
1373	$this->add_responsive_control(
1374	'blog_icon_size',
1375	[
1376	'label' => esc_html__( 'Icon Size', 'spider-elements' ),
1377	'type' => Controls_Manager::SLIDER,
1378	'size_units' => [ 'px', '%' ],
1379	'range' => [
1380	'px' => [
1381	'min' => 0,
1382	'max' => 100,
1383	'step' => 1,
1384	],
1385	'%' => [
1386	'min' => 0,
1387	'max' => 100,
1388	],
1389	],
1390	'default' => [
1391	'unit' => 'px',
1392	],
1393	'selectors' => [
1394	'{{WRAPPER}} .slick-arrow ' => 'font-size: {{SIZE}}{{UNIT}};',
1395	],
1396	'separator' => 'before',
1397	]
1398	);
1399
1400	$this->add_responsive_control(
1401	'icon-gap',
1402	[
1403	'label' => esc_html__( 'Gap', 'spider-elements' ),
1404	'type' => \Elementor\Controls_Manager::SLIDER,
1405	'description' => esc_html__( 'Set the gap between icon.', 'spider-elements' ),
1406	'range' => [
1407	'px' => [
1408	'min' => 0,
1409	'max' => 100,
1410	'step' => 1,
1411	],
1412	],
1413	'selectors' => [
1414	'{{WRAPPER}} .blog-slider-arrows' => 'column-gap: {{SIZE}}{{UNIT}};',
1415	],
1416	]
1417	);
1418
1419	$this->add_group_control(
1420	\Elementor\Group_Control_Border::get_type(),
1421	[
1422	'name' => 'blog_icon_border',
1423	'selector' => '{{WRAPPER}} .slick-arrow',
1424	]
1425	);
1426
1427	$this->add_responsive_control(
1428	'blog_icon_border_radius',
1429	[
1430	'label' => esc_html__( 'Border Radius', 'spider-elements' ),
1431	'type' => Controls_Manager::SLIDER,
1432	'size_units' => [ 'px', '%', 'em' ],
1433	'selectors' => [
1434	'{{WRAPPER}} .slick-arrow' => 'border-radius: {{SIZE}}px;',
1435	],
1436	]
1437	);
1438
1439	$this->add_responsive_control(
1440	'blog_icon_padding',
1441	[
1442	'label' => esc_html__( 'Padding', 'spider-elements' ),
1443	'type' => Controls_Manager::DIMENSIONS,
1444	'size_units' => [ 'px', 'em', '%' ],
1445	'selectors' => [
1446	'{{WRAPPER}} .slick-arrow' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1447	],
1448	]
1449	);
1450
1451	$this->end_controls_section();
1452	}
1453
1454
1455	protected function render(): void
1456	{
1457	$settings = $this->get_settings_for_display();
1458	extract( $settings ); // Array to variable conversation
1459
1460	$paged = ( get_query_var('paged') ) ? get_query_var('paged') : ( get_query_var('page') ? get_query_var('page') : 1 );
1461
1462	// query part
1463	$query['post_status'] = 'publish';
1464	$query['ignore_sticky_posts'] = true;
1465	$query['suppress_filters'] = false;
1466	$query['paged'] = $paged;
1467	if ( $blog_queryby == 'postype' ) {
1468	$query['post_type'] = $blog_posttype ?? ['post'];
1469	} else {
1470	$query['post_type'] = [ 'post' ];
1471	}
1472
1473	$query['orderby'] = $blog_order_by;
1474	if ( ! empty( $blog_order ) ) {
1475	$query['order'] = $blog_order;
1476	}
1477	if ( ! empty( $blog_limit ) ) {
1478	$query['posts_per_page'] = (int) $blog_limit;
1479	}
1480	if ( ! empty( $blog_offset ) ) {
1481	$query['offset'] = (int) $blog_offset;
1482	}
1483
1484	if ( $blog_queryby == 'categories' ) {
1485	if ( is_array( $blog_categories ) && sizeof( $blog_categories ) > 0 ) {
1486	$cate_query = [
1487	[
1488	'taxonomy' => 'category',
1489	'field' => 'term_id',
1490	'terms' => $blog_categories,
1491	],
1492	'relation' => 'AND',
1493	];
1494	$query['tax_query'] = $cate_query;
1495	}
1496	}
1497
1498	if ( $blog_queryby == 'posts' ) {
1499	if ( is_array( $blog_post ) && sizeof( $blog_post ) > 0 ) {
1500	$query['post__in'] = $blog_post;
1501	}
1502	}
1503
1504	$post_query = new \WP_Query( $query );
1505
1506	include "templates/blog-grid/blog-{$settings['style']}.php";
1507	}
1508
1509	}