← All changes | widgets/faq/faq.php +131 -303 1.2.9 → 1.0.7 View file →

		@@ -1,6 +1,5 @@
1	1	<?php
2		-namespace Easyel\EasyElements\Widgets;
3	2	use Elementor\Controls_Manager;
4	3	use Elementor\Repeater;
5	4	use Elementor\Icons_Manager;
6	5	use Elementor\Group_Control_Background;
		@@ -10,8 +9,28 @@
10	9	}
11	10
12	11	class Easyel_FAQ_Accordion_Widget extends \Elementor\Widget_Base {
13	12
	13	+ public function get_style_depends() {
	14	+ $handle = 'eel-faq-accordion-style';
	15	+ $css_path = plugin_dir_path( __FILE__ ) . 'css/faq.css';
	16	+
	17	+ if ( ! wp_style_is( $handle, 'registered' ) && file_exists( $css_path ) ) {
	18	+ wp_register_style( $handle, plugins_url( 'css/faq.css', __FILE__ ), [], defined( 'WP_DEBUG' ) && WP_DEBUG ? filemtime( $css_path ) : '1.0.0' );
	19	+ }
	20	+ return [ $handle ];
	21	+ }
	22	+
	23	+ public function get_script_depends() {
	24	+ $handle = 'eel-faq-accordion-script';
	25	+ $js_path = plugin_dir_path( __FILE__ ) . 'js/faq.js';
	26	+
	27	+ if ( ! wp_script_is( $handle, 'registered' ) && file_exists( $js_path ) ) {
	28	+ wp_register_script( $handle, plugins_url( 'js/faq.js', __FILE__ ), [ 'jquery' ], defined( 'WP_DEBUG' ) && WP_DEBUG ? filemtime( $js_path ) : '1.0.0', true );
	29	+ }
	30	+ return [ $handle ];
	31	+ }
	32	+
14	33	public function get_name() {
15	34	return 'eel-faq-accordion';
16	35	}
17	36
		@@ -30,25 +49,12 @@
30	49	public function get_keywords() {
31	50	return [ 'faq', 'accordion', 'question', 'answer', 'text' ];
32	51	}
33	52
34		- public function get_style_depends() {
35		- return [
36		- 'eel-faq-accordion',
37		- ];
38		- }
39		-
40		- public function get_script_depends() {
41		- return [
42		- 'eel-faq-accordion',
43		- ];
44		- }
45		-
46		-
47	53	protected function register_controls() {
48	54	$this->start_controls_section(
49	55	'section_faq_content',
50		- [ 'label' => esc_html__( 'FAQ Items', 'easy-elements' ) ]
	56	+ [ 'label' => esc_html__( 'Easy FAQ Items', 'easy-elements' ) ]
51	57	);
52	58
53	59	$repeater = new Repeater();
54	60
		@@ -73,8 +79,20 @@
73	79	'return_value' => 'yes',
74	80	'default' => 'no',
75	81	] );
76	82
	83	+ $repeater->add_control( 'icon_open', [
	84	+ 'label' => esc_html__( 'Open Icon', 'easy-elements' ),
	85	+ 'type' => Controls_Manager::ICONS,
	86	+ 'default' => [ '' ],
	87	+ ] );
	88	+
	89	+ $repeater->add_control( 'icon_close', [
	90	+ 'label' => esc_html__( 'Close Icon', 'easy-elements' ),
	91	+ 'type' => Controls_Manager::ICONS,
	92	+ 'default' => [ '' ],
	93	+ ] );
	94	+
77	95	$this->add_control( 'faq_items', [
78	96	'label' => esc_html__( 'FAQ List', 'easy-elements' ),
79	97	'type' => Controls_Manager::REPEATER,
80	98	'fields' => $repeater->get_controls(),
		@@ -118,25 +136,13 @@
118	136	'span' => 'span',
119	137	'p' => 'p',
120	138	],
121	139	] );
122		-
123		- $this->add_control( 'icon_open', [
124		- 'label' => esc_html__( 'Open Icon', 'easy-elements' ),
125		- 'type' => Controls_Manager::ICONS,
126		- 'default' => [ '' ],
127		- ] );
128	140
129		- $this->add_control( 'icon_close', [
130		- 'label' => esc_html__( 'Close Icon', 'easy-elements' ),
131		- 'type' => Controls_Manager::ICONS,
132		- 'default' => [ '' ],
133		- ] );
134		-
135	141	$this->add_control(
136	142	'icon_position',
137	143	[
138		- 'label' => esc_html__( 'Position', 'easy-elements' ),
	144	+ 'label' => esc_html__( 'Icon Position', 'easy-elements' ),
139	145	'type' => \Elementor\Controls_Manager::CHOOSE,
140	146	'options' => [
141	147	'row-reverse' => [
142	148	'title' => esc_html__( 'Left', 'easy-elements' ),
		@@ -154,8 +160,9 @@
154	160	],
155	161	]
156	162	);
157	163
	164	+
158	165	$this->add_control( 'open_all_toggle', [
159	166	'label' => esc_html__( 'Open All FAQs by Default', 'easy-elements' ),
160	167	'type' => Controls_Manager::SWITCHER,
161	168	'label_on' => esc_html__( 'Yes', 'easy-elements' ),
		@@ -187,152 +194,8 @@
187	194
188	195	$this->end_controls_section();
189	196
190	197	$this->start_controls_section(
191		- 'item_box_style_section',
192		- [
193		- 'label' => esc_html__( 'Items', 'easy-elements' ),
194		- 'tab' => Controls_Manager::TAB_STYLE,
195		- ]
196		- );
197		-
198		- $this->start_controls_tabs( 'item_style_tabs' );
199		-
200		- $this->start_controls_tab(
201		- 'item_style_normal',
202		- [
203		- 'label' => esc_html__( 'Normal', 'easy-elements' ),
204		- ]
205		- );
206		-
207		- $this->add_group_control(
208		- Group_Control_Background::get_type(),
209		- [
210		- 'name' => 'faq_background',
211		- 'label' => esc_html__( 'Background Type', 'easy-elements' ),
212		- 'types' => [ 'classic', 'gradient' ],
213		- 'selector' => '{{WRAPPER}} .eel-faq-item',
214		- ]
215		- );
216		-
217		- // Border Radius
218		- $this->add_responsive_control( 'item_border_radius', [
219		- 'label' => esc_html__( 'Border Radius', 'easy-elements' ),
220		- 'type' => Controls_Manager::DIMENSIONS,
221		- 'size_units' => [ 'px', '%', 'em' ],
222		- 'selectors' => [
223		- '{{WRAPPER}} .eel-faq-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
224		- ],
225		- ] );
226		-
227		- // Border
228		- $this->add_group_control( \Elementor\Group_Control_Border::get_type(), [
229		- 'name' => 'item_border',
230		- 'label' => esc_html__( 'Border', 'easy-elements' ),
231		- 'selector' => '{{WRAPPER}} .eel-faq-item',
232		- ] );
233		-
234		- $this->add_responsive_control(
235		- 'item_padding',
236		- [
237		- 'label' => esc_html__('Padding', 'easy-elements'),
238		- 'type' => Controls_Manager::DIMENSIONS,
239		- 'size_units' => ['px'],
240		- 'selectors' => [
241		- '{{WRAPPER}} .eel-faq-item' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
242		- ],
243		- ]
244		- );
245		-
246		- // Shadow
247		- $this->add_group_control( \Elementor\Group_Control_Box_Shadow::get_type(), [
248		- 'name' => 'item_shadow',
249		- 'label' => esc_html__( 'Box Shadow', 'easy-elements' ),
250		- 'selector' => '{{WRAPPER}} .eel-faq-item',
251		- ] );
252		-
253		- $this->add_responsive_control(
254		- 'item_margin',
255		- [
256		- 'label' => esc_html__('Items Space', 'easy-elements'),
257		- 'type' => Controls_Manager::SLIDER,
258		- 'size_units' => ['px'],
259		- 'selectors' => [
260		- '{{WRAPPER}} .eel-faq-accordion' => 'gap: {{SIZE}}{{UNIT}};',
261		- ],
262		- ]
263		- );
264		- $this->end_controls_tab();
265		-
266		- $this->start_controls_tab(
267		- 'item_style_hover',
268		- [
269		- 'label' => esc_html__( 'Hover', 'easy-elements' ),
270		- ]
271		- );
272		- $this->add_group_control(
273		- \Elementor\Group_Control_Background::get_type(),
274		- [
275		- 'name' => 'item_bg_hover',
276		- 'types' => [ 'classic', 'gradient' ],
277		- 'selector' => '{{WRAPPER}} .eel-faq-item:hover',
278		- ]
279		- );
280		-
281		- $this->add_group_control(
282		- \Elementor\Group_Control_Border::get_type(),
283		- [
284		- 'name' => 'item_border_hover',
285		- 'selector' => '{{WRAPPER}} .eel-faq-item:hover',
286		- ]
287		- );
288		-
289		- $this->add_group_control(
290		- \Elementor\Group_Control_Box_Shadow::get_type(),
291		- [
292		- 'name' => 'item_shadow_hover',
293		- 'selector' => '{{WRAPPER}} .eel-faq-item:hover',
294		- ]
295		- );
296		- $this->end_controls_tab();
297		-
298		- $this->start_controls_tab(
299		- 'item_style_active',
300		- [
301		- 'label' => esc_html__( 'Active', 'easy-elements' ),
302		- ]
303		- );
304		- $this->add_group_control(
305		- \Elementor\Group_Control_Background::get_type(),
306		- [
307		- 'name' => 'item_bg_active',
308		- 'types' => [ 'classic', 'gradient' ],
309		- 'selector' => '{{WRAPPER}} .eel-faq-item.active',
310		- ]
311		- );
312		-
313		- $this->add_group_control(
314		- \Elementor\Group_Control_Border::get_type(),
315		- [
316		- 'name' => 'item_border_active',
317		- 'selector' => '{{WRAPPER}} .eel-faq-item.active',
318		- ]
319		- );
320		-
321		- $this->add_group_control(
322		- \Elementor\Group_Control_Box_Shadow::get_type(),
323		- [
324		- 'name' => 'item_shadow_active',
325		- 'selector' => '{{WRAPPER}} .eel-faq-item.active',
326		- ]
327		- );
328		-
329		- $this->end_controls_tab();
330		- $this->end_controls_tabs();
331		-
332		- $this->end_controls_section();
333		-
334		- $this->start_controls_section(
335	198	'title_style_section',
336	199	[
337	200	'label' => esc_html__( 'Title', 'easy-elements' ),
338	201	'tab' => Controls_Manager::TAB_STYLE,
		@@ -338,17 +201,8 @@
338	201	'tab' => Controls_Manager::TAB_STYLE,
339	202	]
340	203	);
341	204
342		- $this->start_controls_tabs( 'title_style_tabs' );
343		-
344		- $this->start_controls_tab(
345		- 'title_style_normal',
346		- [
347		- 'label' => esc_html__( 'Normal', 'easy-elements' ),
348		- ]
349		- );
350		-
351	205	// Title Color
352	206	$this->add_control( 'title_color', [
353	207	'label' => esc_html__( 'Color', 'easy-elements' ),
354	208	'type' => Controls_Manager::COLOR,
		@@ -362,41 +216,10 @@
362	216	'name' => 'title_typography',
363	217	'label' => esc_html__( 'Typography', 'easy-elements' ),
364	218	'selector' => '{{WRAPPER}} .eel-faq-title',
365	219	] );
366		- $this->end_controls_tab();
367	220
368		- $this->start_controls_tab(
369		- 'title_style_hover',
370		- [
371		- 'label' => esc_html__( 'Hover', 'easy-elements' ),
372		- ]
373		- );
374		- $this->add_control( 'title_color_hover', [
375		- 'label' => esc_html__( 'Color', 'easy-elements' ),
376		- 'type' => Controls_Manager::COLOR,
377		- 'selectors' => [
378		- '{{WRAPPER}} .eel-faq-item:hover .eel-faq-title' => 'color: {{VALUE}};',
379		- ],
380		- ] );
381		- $this->end_controls_tab();
382		- $this->start_controls_tab(
383		- 'title_style_active',
384		- [
385		- 'label' => esc_html__( 'Active', 'easy-elements' ),
386		- ]
387		- );
388		- $this->add_control( 'title_color_active', [
389		- 'label' => esc_html__( 'Color', 'easy-elements' ),
390		- 'type' => Controls_Manager::COLOR,
391		- 'selectors' => [
392		- '{{WRAPPER}} .eel-faq-item.active .eel-faq-title' => 'color: {{VALUE}};',
393		- ],
394		- ] );
395		- $this->end_controls_tab();
396		- $this->end_controls_tabs();
397	221	$this->end_controls_section();
398		-
399	222	$this->start_controls_section(
400	223	'description_style_section',
401	224	[
402	225	'label' => esc_html__( 'Description', 'easy-elements' ),
		@@ -403,17 +226,8 @@
403	226	'tab' => Controls_Manager::TAB_STYLE,
404	227	]
405	228	);
406	229
407		- $this->start_controls_tabs( 'description_style_tabs' );
408		-
409		- $this->start_controls_tab(
410		- 'description_style_normal',
411		- [
412		- 'label' => esc_html__( 'Normal', 'easy-elements' ),
413		- ]
414		- );
415		-
416	230	// Description Color
417	231	$this->add_control( 'description_color', [
418	232	'label' => esc_html__( 'Color', 'easy-elements' ),
419	233	'type' => Controls_Manager::COLOR,
		@@ -428,62 +242,18 @@
428	242	'label' => esc_html__( 'Typography', 'easy-elements' ),
429	243	'selector' => '{{WRAPPER}} .eel-faq-answer',
430	244	] );
431	245
432		- $this->end_controls_tab();
433		-
434		- $this->start_controls_tab(
435		- 'description_style_hover',
436		- [
437		- 'label' => esc_html__( 'Hover', 'easy-elements' ),
438		- ]
439		- );
440		-
441		- $this->add_control( 'description_color_hover', [
442		- 'label' => esc_html__( 'Color', 'easy-elements' ),
443		- 'type' => Controls_Manager::COLOR,
444		- 'selectors' => [
445		- '{{WRAPPER}} .eel-faq-item:hover .eel-faq-answer' => 'color: {{VALUE}};',
446		- ],
447		- ] );
448		- $this->end_controls_tab();
449		-
450		- $this->start_controls_tab(
451		- 'description_style_active',
452		- [
453		- 'label' => esc_html__( 'Active', 'easy-elements' ),
454		- ]
455		- );
456		-
457		- $this->add_control( 'description_color_active', [
458		- 'label' => esc_html__( 'Color', 'easy-elements' ),
459		- 'type' => Controls_Manager::COLOR,
460		- 'selectors' => [
461		- '{{WRAPPER}} .eel-faq-item.active .eel-faq-answer' => 'color: {{VALUE}};',
462		- ],
463		- ] );
464		-
465		- $this->end_controls_tab();
466		- $this->end_controls_tabs();
467		-
468	246	$this->end_controls_section();
469	247
470	248	$this->start_controls_section(
471	249	'icon_style_section',
472	250	[
473		- 'label' => esc_html__( 'Accordion Icon', 'easy-elements' ),
	251	+ 'label' => esc_html__( 'Icon', 'easy-elements' ),
474	252	'tab' => Controls_Manager::TAB_STYLE,
475	253	]
476	254	);
477	255
478		- $this->start_controls_tabs( 'icon_style_tabs' );
479		- $this->start_controls_tab(
480		- 'icon_style_normal',
481		- [
482		- 'label' => esc_html__( 'Normal', 'easy-elements' ),
483		- ]
484		- );
485		-
486	256	$this->add_control( 'icon_color', [
487	257	'label' => esc_html__( 'Color', 'easy-elements' ),
488	258	'type' => Controls_Manager::COLOR,
489	259	'selectors' => [
		@@ -516,44 +286,13 @@
516	286	'{{WRAPPER}} .eel-faq-icon' => 'transform: translateY({{SIZE}}{{UNIT}});',
517	287	],
518	288	]
519	289	);
520		- $this->end_controls_tab();
521	290
522		- $this->start_controls_tab(
523		- 'icon_style_hover',
524		- [
525		- 'label' => esc_html__( 'Hover', 'easy-elements' ),
526		- ]
527		- );
528		- $this->add_control( 'icon_color_hover', [
529		- 'label' => esc_html__( 'Color', 'easy-elements' ),
530		- 'type' => Controls_Manager::COLOR,
531		- 'selectors' => [
532		- '{{WRAPPER}} .eel-faq-item:hover .eel-faq-icon, {{WRAPPER}} .eel-faq-item:hover .eel-faq-icon svg path' => 'color: {{VALUE}}; fill: {{VALUE}};',
533		- ],
534		- ] );
535		- $this->end_controls_tab();
536		-
537		- $this->start_controls_tab(
538		- 'icon_style_active',
539		- [
540		- 'label' => esc_html__( 'Active', 'easy-elements' ),
541		- ]
542		- );
543		-
544		- $this->add_control( 'icon_color_active', [
545		- 'label' => esc_html__( 'Color', 'easy-elements' ),
546		- 'type' => Controls_Manager::COLOR,
547		- 'selectors' => [
548		- '{{WRAPPER}} .eel-faq-item.active .eel-faq-icon, {{WRAPPER}} .eel-faq-item.active .eel-faq-icon svg path' => 'color: {{VALUE}}; fill: {{VALUE}};',
549		- ],
550		- ] );
551		-
552	291	$this->add_responsive_control(
553	292	'icon_position_y_active',
554	293	[
555		- 'label' => esc_html__( 'Vertical Position', 'easy-elements' ),
	294	+ 'label' => esc_html__( 'Vertical Position Active', 'easy-elements' ),
556	295	'type' => \Elementor\Controls_Manager::SLIDER,
557	296	'size_units' => [ 'px', '%' ],
558	297	'range' => [
559	298	'px' => [
		@@ -575,11 +314,78 @@
575	314	],
576	315	]
577	316	);
578	317
579		- $this->end_controls_tab();
580		- $this->end_controls_tabs();
581	318	$this->end_controls_section();
	319	+
	320	+ $this->start_controls_section(
	321	+ 'item_box_style_section',
	322	+ [
	323	+ 'label' => esc_html__( 'Items', 'easy-elements' ),
	324	+ 'tab' => Controls_Manager::TAB_STYLE,
	325	+ ]
	326	+ );
	327	+
	328	+ $this->add_group_control(
	329	+ Group_Control_Background::get_type(),
	330	+ [
	331	+ 'name' => 'faq_background',
	332	+ 'label' => esc_html__( 'Background Type', 'easy-elements' ),
	333	+ 'types' => [ 'classic', 'gradient' ],
	334	+ 'selector' => '{{WRAPPER}} .eel-faq-item',
	335	+ ]
	336	+ );
	337	+
	338	+ // Border Radius
	339	+ $this->add_responsive_control( 'item_border_radius', [
	340	+ 'label' => esc_html__( 'Border Radius', 'easy-elements' ),
	341	+ 'type' => Controls_Manager::DIMENSIONS,
	342	+ 'size_units' => [ 'px', '%', 'em' ],
	343	+ 'selectors' => [
	344	+ '{{WRAPPER}} .eel-faq-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	345	+ ],
	346	+ ] );
	347	+
	348	+ // Border
	349	+ $this->add_group_control( \Elementor\Group_Control_Border::get_type(), [
	350	+ 'name' => 'item_border',
	351	+ 'label' => esc_html__( 'Border', 'easy-elements' ),
	352	+ 'selector' => '{{WRAPPER}} .eel-faq-item',
	353	+ ] );
	354	+
	355	+ // Shadow
	356	+ $this->add_group_control( \Elementor\Group_Control_Box_Shadow::get_type(), [
	357	+ 'name' => 'item_shadow',
	358	+ 'label' => esc_html__( 'Box Shadow', 'easy-elements' ),
	359	+ 'selector' => '{{WRAPPER}} .eel-faq-item',
	360	+ ] );
	361	+
	362	+ $this->add_responsive_control(
	363	+ 'item_padding',
	364	+ [
	365	+ 'label' => esc_html__('Padding', 'easy-elements'),
	366	+ 'type' => Controls_Manager::DIMENSIONS,
	367	+ 'size_units' => ['px'],
	368	+ 'selectors' => [
	369	+ '{{WRAPPER}} .eel-faq-item' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	370	+ ],
	371	+ ]
	372	+ );
	373	+
	374	+ $this->add_responsive_control(
	375	+ 'item_margin',
	376	+ [
	377	+ 'label' => esc_html__('Space Between Items', 'easy-elements'),
	378	+ 'type' => Controls_Manager::SLIDER,
	379	+ 'size_units' => ['px'],
	380	+ 'selectors' => [
	381	+ '{{WRAPPER}} .eel-faq-accordion' => 'gap: {{SIZE}}{{UNIT}};',
	382	+ ],
	383	+ ]
	384	+ );
	385	+
	386	+
	387	+ $this->end_controls_section();
582	388	}
583	389
584	390
585	391	protected function render() {
		@@ -590,8 +396,29 @@
590	396	$open_all_class = ( $settings['open_all_toggle'] === 'yes' ) ? 'eel-faq-open-all' : '';
591	397	$enable_sticky = ( $settings['enable_sticky'] === 'yes' ) ? 'eel-faq-sticky' : '';
592	398
593	399
	400	+ // FAQ Schema Output
	401	+ if ( isset( $settings['enable_faq_schema'] ) && $settings['enable_faq_schema'] === 'yes' && ! empty( $settings['faq_items'] ) ) {
	402	+
	403	+ $schema = [
	404	+ '@context' => 'https://schema.org',
	405	+ '@type' => 'FAQPage',
	406	+ 'mainEntity' => array_map( function ( $item ) {
	407	+ return [
	408	+ '@type' => 'Question',
	409	+ 'name' => isset( $item['title'] ) ? wp_strip_all_tags( $item['title'] ) : '',
	410	+ 'acceptedAnswer' => [
	411	+ '@type' => 'Answer',
	412	+ 'text' => isset( $item['description'] ) ? wp_kses_post( $item['description'] ) : '',
	413	+ ],
	414	+ ];
	415	+ }, $settings['faq_items'] ),
	416	+ ];
	417	+
	418	+ echo '<script type="application/ld+json">' . wp_json_encode( $schema, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES ) . '</script>';
	419	+ }
	420	+
594	421	?>
595	422
596	423	<div class="eel-faq-accordion <?php echo esc_attr( $open_all_class ); ?> <?php echo esc_attr( $enable_sticky ); ?>" id="<?php echo esc_attr( $this->get_id() ); ?>">
597	424	<?php foreach ( $settings['faq_items'] as $index => $item ) :
		@@ -597,10 +424,10 @@
597	424	<?php foreach ( $settings['faq_items'] as $index => $item ) :
598	425	$is_active = ( ! empty( $item['active_toggle'] ) && $item['active_toggle'] === 'yes' ) ? 'active' : '';
599	426	$title = isset( $item['title'] ) ? $item['title'] : '';
600	427	$description = isset( $item['description'] ) ? $item['description'] : '';
601		- $icon_open = isset( $settings['icon_open'] ) ? $settings['icon_open'] : array();
602		- $icon_close = isset( $settings['icon_close'] ) ? $settings['icon_close'] : array();
	428	+ $icon_open = isset( $item['icon_open'] ) ? $item['icon_open'] : array();
	429	+ $icon_close = isset( $item['icon_close'] ) ? $item['icon_close'] : array();
603	430	?>
604	431	<div class="eel-faq-item <?php echo esc_attr( $is_active ); ?>">
605	432	<div class="eel-faq-question">
606	433	<<?php echo esc_html( $title_tag ); ?> class="eel-faq-title" tabindex="0">
		@@ -632,5 +459,6 @@
632	459	<?php endforeach; ?>
633	460	</div>
634	461	<?php
635	462	}
636		-}
	463	+}
	464	+?>