PluginProbe ʕ •ᴥ•ʔ
ElementsKit Elementor Addons – Advanced Widgets & Templates Addons for Elementor / 4.0.0
ElementsKit Elementor Addons – Advanced Widgets & Templates Addons for Elementor v4.0.0
4.0.2 4.0.1 4.0.0 3.10.02 3.10.01 3.9.10 3.9.9 3.9.8 3.9.7 3.9.5 3.9.6 3.9.3 2.1.0 2.1.1 2.1.2 2.1.3 2.1.4 2.1.5 2.1.6 2.1.7 2.2.0 2.2.1 2.2.2 2.2.3 2.2.4 2.3.0 2.3.1 2.3.1.1 2.3.2 2.3.3 2.3.4 2.3.5 2.3.6 2.3.7 2.4.0 2.5.0 2.5.1 2.5.10 2.5.2 2.5.3 2.5.4 2.5.5 2.5.6 2.5.7 2.5.8 2.5.9 2.6.0 2.6.1 2.6.2 2.6.3 2.7.0 2.7.2 2.7.3 2.7.4 2.7.5 2.8.0 2.8.1 2.8.5 2.8.6 2.8.7 2.8.8 2.9.0 2.9.1 2.9.2 3.0.0 3.0.1 3.0.2 3.0.3 3.0.4 3.0.5 3.0.6 3.0.7 3.1.0 3.1.1 3.1.2 3.1.3 3.1.4 3.2.0 3.2.1 3.2.2 3.2.3 3.2.4 3.2.5 3.2.6 3.2.7 3.2.8 3.2.9 3.3.0 3.3.1 3.3.2 3.3.3 3.3.4 3.3.5 3.3.6 3.3.7 3.3.8 3.3.9 3.4.0 3.4.1 3.4.2 3.4.3 3.4.4 3.4.5 3.4.6 3.4.7 3.4.8 3.4.9 3.5.0 3.5.1 3.5.2 3.5.3 3.5.4 3.5.5 3.5.6 3.6.0 3.6.1 3.7.0 3.7.1 3.7.2 3.7.3 3.7.4 3.7.5 3.7.6 3.7.7 3.7.8 3.7.9 3.8.0 3.8.1 3.8.2 3.9.0 3.9.1 3.9.2 trunk 1.2.6 1.2.7 1.2.9 1.3.1 1.3.2 1.3.3 1.3.4 1.3.5 1.3.8 1.3.9 1.4.0 1.4.1 1.4.2 1.4.3 1.4.4 1.4.5 1.4.7 1.4.8 1.4.9 1.5.0 1.5.1 1.5.10 1.5.11 1.5.12 1.5.2 1.5.4 1.5.5 1.5.6 1.5.7 1.5.8 1.5.9 2.0.0 2.0.1 2.0.10 2.0.11 2.0.12 2.0.13 2.0.2 2.0.3 2.0.4 2.0.5 2.0.6 2.0.7 2.0.8 2.0.9 2.0.9.1 2.0.9.2 2.0.9.3
elementskit-lite / widgets / accordion / accordion.php
elementskit-lite / widgets / accordion Last commit date
accordion-handler.php 3 years ago accordion.php 3 weeks ago
accordion.php
1079 lines
1 <?php
2 namespace Elementor;
3
4 use \Elementor\ElementsKit_Widget_Accordion_Handler as Handler;
5 use \ElementsKit_Lite\Modules\Controls\Controls_Manager as ElementsKit_Controls_Manager;
6
7 if (! defined( 'ABSPATH' ) ) exit;
8
9 class ElementsKit_Widget_Accordion extends Widget_Base {
10 use \ElementsKit_Lite\Widgets\Widget_Notice;
11
12 public $base;
13
14 public function get_script_depends() {
15 return ['ui-slim', 'ekit-accordion'];
16 }
17
18 public function get_style_depends() {
19 return ['ekit-accordion'];
20 }
21
22 public function get_name() {
23 return Handler::get_name();
24 }
25
26 public function get_title() {
27 return Handler::get_title();
28 }
29
30 public function get_icon() {
31 return Handler::get_icon();
32 }
33
34 public function get_categories() {
35 return Handler::get_categories();
36 }
37
38 public function get_keywords() {
39 return Handler::get_keywords();
40 }
41
42 public function get_help_url() {
43 return 'https://wpmet.com/doc/accordion/';
44 }
45
46 protected function is_dynamic_content(): bool {
47 return false;
48 }
49
50 public function has_widget_inner_wrapper(): bool {
51 return ! Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
52 }
53
54 protected function register_controls() {
55
56
57 $this->start_controls_section(
58 'section_tab', [
59 'label' =>esc_html__( 'Accordion', 'elementskit-lite' ),
60 ]
61 );
62 $repeater = new Repeater();
63
64
65 $repeater->add_control(
66 'acc_title', [
67 'label' => esc_html__('Title', 'elementskit-lite'),
68 'type' => Controls_Manager::TEXT,
69 'dynamic' => [
70 'active' => true,
71 ],
72 'label_block' => true,
73 'default' => 'Accordion Item',
74 ]
75 );
76
77 $repeater->add_control(
78 'ekit_acc_is_active',
79 [
80 'label' => esc_html__('Keep this slide open? ', 'elementskit-lite'),
81 'type' => Controls_Manager::SWITCHER,
82 'default' => 'no',
83 'label_on' =>esc_html__( 'Yes', 'elementskit-lite' ),
84 'label_off' =>esc_html__( 'No', 'elementskit-lite' ),
85 ]
86 );
87
88 $repeater->add_control(
89 'acc_content', [
90 'label' => esc_html__('Description', 'elementskit-lite'),
91 'type' => Controls_Manager::WYSIWYG,
92 'dynamic' => [
93 'active' => true,
94 ],
95 'label_block' => true,
96 'default' => 'Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast',
97 ]
98 );
99
100 $this->add_control(
101 'ekit_accordion_items',
102 [
103 'label' => esc_html__('Content', 'elementskit-lite'),
104 'type' => Controls_Manager::REPEATER,
105 'separator' => 'before',
106 'title_field' => '{{ acc_title }}',
107 'default' => [
108 [
109 'acc_title' => 'How to Change my Photo from Admin Dashboard?',
110 'acc_content' => 'Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast',
111 'ekit_acc_is_active' => 'yes'
112 ],
113 [
114 'acc_title' => 'How to Change my Password easily?',
115 'acc_content' => 'Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast',
116 ],
117 [
118 'acc_title' => 'How to Change my Subscription Plan using PayPal',
119 'acc_content' => 'Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast',
120 ],
121 ],
122 'fields' => $repeater->get_controls(),
123 ]
124 );
125 $this->add_control(
126 'ekit_accordion_open_first_slide',
127 [
128 'label' => esc_html__( 'Keep first slide auto open?', 'elementskit-lite' ),
129 'type' => Controls_Manager::SWITCHER,
130 'label_on' => esc_html__( 'Yes', 'elementskit-lite' ),
131 'label_off' => esc_html__( 'No', 'elementskit-lite' ),
132 'return_value' => 'yes',
133 'default' => 'yes',
134 ]
135 );
136
137 $this->add_control(
138 'ekit_accordion_style',
139 [
140 'label' =>esc_html__( 'Style', 'elementskit-lite' ),
141 'type' => Controls_Manager::SELECT,
142 'default' => 'accoedion-primary',
143 'options' => [
144 'accoedion-primary' =>esc_html__( 'Primary', 'elementskit-lite' ),
145 'curve-shape' =>esc_html__( 'Curve Shape', 'elementskit-lite' ),
146 'accoedion-primary side-curve' =>esc_html__( 'Side Curve', 'elementskit-lite' ),
147 'accordion-4' =>esc_html__( 'Box Icon', 'elementskit-lite' ),
148 'floating-style' =>esc_html__( 'Floating Style', 'elementskit-lite' ),
149 ],
150 ]
151 );
152 $this->add_control(
153 'ekit_accordian_faq_schema',
154 [
155 'label' => esc_html__( 'Accordian FAQ Schema', 'elementskit-lite' ),
156 'type' => Controls_Manager::SWITCHER,
157 'separator' => 'before',
158 ]
159 );
160 $this->end_controls_section();
161 // Icon setting
162 $this->start_controls_section(
163 'ekit_accordion_section_setting', [
164 'label' =>esc_html__( 'Icon', 'elementskit-lite' ),
165 ]
166 );
167 $this->add_control(
168 'ekit_accordion_icon_pos_style',
169 [
170 'label' => esc_html__( 'Icon Position', 'elementskit-lite' ),
171 'type' => Controls_Manager::SELECT,
172 'default' => 'right',
173 'options' => [
174 'right' => esc_html__( 'Right', 'elementskit-lite' ),
175 'left' => esc_html__( 'Left', 'elementskit-lite' ),
176 'bothside' => esc_html__( 'Both side', 'elementskit-lite' ),
177 ],
178 ]
179 );
180
181 $this->add_control(
182 'ekit_accordion_display_loop_count',
183 [
184 'label' => esc_html__( 'Show Loop Count', 'elementskit-lite' ),
185 'type' => Controls_Manager::SWITCHER,
186 'label_on' => esc_html__( 'Show', 'elementskit-lite' ),
187 'label_off' => esc_html__( 'Hide', 'elementskit-lite' ),
188 'return_value' => 'yes',
189 'default' => 'no',
190 'condition' => [
191 'ekit_accordion_icon_pos_style' => 'right',
192 ]
193 ]
194 );
195 $this->add_control(
196 'ekit_accordion_left_icons',
197 [
198 'label' => esc_html__( 'Left Icon', 'elementskit-lite' ),
199 'type' => Controls_Manager::ICONS,
200 'fa4compatibility' => 'ekit_accordion_left_icon',
201 'default' => [
202 'value' => 'icon icon-down-arrow1',
203 'library' => 'ekiticons',
204 ],
205 'condition' => [
206 'ekit_accordion_icon_pos_style' => ['left', 'bothside']
207 ]
208 ]
209 );
210 $this->add_control(
211 'ekit_accordion_left_icon_actives',
212 [
213 'label' => esc_html__( 'Left Icon Active', 'elementskit-lite' ),
214 'type' => Controls_Manager::ICONS,
215 'fa4compatibility' => 'ekit_accordion_left_icon_active',
216 'default' => [
217 'value' => 'icon icon-up-arrow1',
218 'library' => 'ekiticons',
219 ],
220 'condition' => [
221 'ekit_accordion_icon_pos_style' => ['left', 'bothside']
222 ]
223 ]
224 );
225 $this->add_control(
226 'ekit_accordion_right_icons',
227 [
228 'label' => esc_html__( 'Right Icon', 'elementskit-lite' ),
229 'type' => Controls_Manager::ICONS,
230 'fa4compatibility' => 'ekit_accordion_right_icon',
231 'default' => [
232 'value' => 'icon icon-down-arrow1',
233 'library' => 'ekiticons',
234 ],
235 'condition' => [
236 'ekit_accordion_icon_pos_style' => ['right', 'bothside']
237 ]
238 ]
239 );
240 $this->add_control(
241 'ekit_accordion_right_icon_actives',
242 [
243 'label' => esc_html__( 'Right Icon Active', 'elementskit-lite' ),
244 'type' => Controls_Manager::ICONS,
245 'fa4compatibility' => 'ekit_accordion_right_icon_active',
246 'default' => [
247 'value' => 'icon icon-up-arrow',
248 'library' => 'ekiticons',
249 ],
250 'condition' => [
251 'ekit_accordion_icon_pos_style' => ['right', 'bothside']
252 ]
253 ]
254 );
255 $this->end_controls_section();
256
257 //Title Style Section
258
259 $this->start_controls_section(
260 'ekit_accordion_section_title_style', [
261 'label' =>esc_html__( 'Title', 'elementskit-lite' ),
262 'tab' => Controls_Manager::TAB_STYLE,
263 ]
264 );
265 $this->add_group_control(
266 Group_Control_Typography::get_type(), [
267 'name' => 'ekit_accordion_title_typography',
268 'selector' => '{{WRAPPER}} .elementskit-accordion .elementskit-card-header>.elementskit-btn-link',
269 ]
270 );
271 $this->start_controls_tabs(
272 'ekit_accordion_style_tabs'
273 );
274 $this->start_controls_tab(
275 'ekit_accordion_style_open_tab',
276 [
277 'label' => esc_html__( 'Open', 'elementskit-lite' ),
278 ]
279 );
280 $this->add_control(
281 'ekit_accordion_title_color', [
282 'label' =>esc_html__( 'Color', 'elementskit-lite' ),
283 'type' => Controls_Manager::COLOR,
284 'selectors' => [
285 '{{WRAPPER}} .elementskit-accordion .elementskit-card .elementskit-card-header>.elementskit-btn-link[aria-expanded="true"]' => 'color: {{VALUE}};',
286 '{{WRAPPER}} .elementskit-accordion.curve-shape .elementskit-card-header>.elementskit-btn-link[aria-expanded=true]' => 'color: {{VALUE}};'
287 ],
288 ]
289 );
290
291 $this->add_control(
292 'ekit_accordion_title__hover_color', [
293 'label' =>esc_html__( 'Hover Color', 'elementskit-lite' ),
294 'type' => Controls_Manager::COLOR,
295 'selectors' => [
296 '{{WRAPPER}} .elementskit-accordion .elementskit-card .elementskit-card-header > .elementskit-btn-link[aria-expanded="true"]:hover' => 'color: {{VALUE}};',
297 '{{WRAPPER}} .elementskit-accordion.curve-shape .elementskit-card-header > .elementskit-btn-link[aria-expanded=true]:hover' => 'color: {{VALUE}};'
298 ],
299 ]
300 );
301
302 $this->add_group_control(
303 Group_Control_Background::get_type(),
304 [
305 'name' => 'ekit_accordion_background',
306 'label' => esc_html__( 'Background', 'elementskit-lite' ),
307 'types' => [ 'classic', 'gradient' ],
308 'condition' => [
309 'ekit_accordion_style!' => ['curve-shape']
310 ],
311 'selector' => '{{WRAPPER}} .elementskit-accordion.accoedion-primary .elementskit-card .elementskit-card-header>.elementskit-btn-link[aria-expanded="true"], {{WRAPPER}} .elementskit-accordion .elementskit-card-header>.elementskit-btn-link[aria-expanded=true], {{WRAPPER}} .elementskit-accordion.floating-style .elementskit-card .elementskit-btn-link[aria-expanded="true"]',
312 ]
313 );
314 $this->add_control(
315 'ekit_accordion_curve_fill_color', [
316 'label' =>esc_html__( 'Background Color', 'elementskit-lite' ),
317 'type' => Controls_Manager::COLOR,
318 'condition' => [
319 'ekit_accordion_style' => ['curve-shape']
320 ],
321 'selectors' => [
322 '{{WRAPPER}} .elementskit-accordion.curve-shape .elementskit-card-header>.elementskit-btn-link[aria-expanded=true] .path' => 'fill: {{VALUE}}',
323 ],
324 ]
325 );
326 $this->add_control(
327 'ekit_accordion_curve_stroke_color', [
328 'label' =>esc_html__( 'Border Color', 'elementskit-lite' ),
329 'type' => Controls_Manager::COLOR,
330 'condition' => [
331 'ekit_accordion_style' => ['curve-shape']
332 ],
333 'selectors' => [
334 '{{WRAPPER}} .elementskit-accordion.curve-shape .elementskit-card-header>.elementskit-btn-link[aria-expanded=true]' => 'fill: {{VALUE}};',
335 ],
336 ]
337 );
338
339
340 $this->add_group_control(
341 Group_Control_Border::get_type(),
342 [
343 'name' => 'ekit_accordion_title_border_open',
344 'label' => esc_html__( 'Border', 'elementskit-lite' ),
345 'condition' => [
346 'ekit_accordion_style!' => ['curve-shape']
347 ],
348 'selector' => '{{WRAPPER}} .elementskit-accordion .elementskit-card .elementskit-card-header>.elementskit-btn-link[aria-expanded="true"]',
349 ]
350 );
351
352 $this->add_control(
353 'ekit_accordion_border_radious_curve_shape_open',
354 [
355 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
356 'type' => Controls_Manager::DIMENSIONS,
357 'size_units' => [ 'px', '%', 'em' ],
358 'condition' => [
359 'ekit_accordion_style!' => ['curve-shape']
360 ],
361 'selectors' => [
362 '{{WRAPPER}} .elementskit-accordion .elementskit-card .elementskit-card-header>.elementskit-btn-link[aria-expanded="true"]' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
363 ],
364 ]
365 );
366 $this->add_group_control(
367 Group_Control_Box_Shadow::get_type(),
368 [
369 'name' => 'ekit_accordion_box_shadow_open',
370 'label' => esc_html__( 'Box Shadow', 'elementskit-lite' ),
371 'selector' => '{{WRAPPER}} .elementskit-accordion .elementskit-card .elementskit-card-header>.elementskit-btn-link[aria-expanded="true"]',
372 ]
373 );
374
375 $this->end_controls_tab();
376
377 $this->start_controls_tab(
378 'ekit_accordion_style_close_tab',
379 [
380 'label' => esc_html__( 'Closed', 'elementskit-lite' ),
381 ]
382 );
383 $this->add_control(
384 'ekit_accordion_title_color_close', [
385 'label' =>esc_html__( 'Color', 'elementskit-lite' ),
386 'type' => Controls_Manager::COLOR,
387 'selectors' => [
388 '{{WRAPPER}} .elementskit-accordion .elementskit-card-header>.elementskit-btn-link' => 'color: {{VALUE}};'
389 ],
390 ]
391 );
392 $this->add_control(
393 'ekit_accordion_title_hover_color_close', [
394 'label' =>esc_html__( 'Hover Color', 'elementskit-lite' ),
395 'type' => Controls_Manager::COLOR,
396 'selectors' => [
397 '{{WRAPPER}} .elementskit-accordion .elementskit-card-header>.elementskit-btn-link:hover' => 'color: {{VALUE}};'
398 ],
399 ]
400 );
401 $this->add_group_control(
402 Group_Control_Background::get_type(),
403 [
404 'name' => 'ekit_accordion_background_close',
405 'label' => esc_html__( 'Background', 'elementskit-lite' ),
406 'types' => [ 'classic', 'gradient' ],
407 'condition' => [
408 'ekit_accordion_style!' => ['curve-shape']
409 ],
410 'selector' => '{{WRAPPER}} .elementskit-accordion .elementskit-card-header>.elementskit-btn-link',
411 ]
412 );
413 $this->add_control(
414 'ekit_accordion_curve_fill_close', [
415 'label' =>esc_html__( 'Background', 'elementskit-lite' ),
416 'type' => Controls_Manager::COLOR,
417 'condition' => [
418 'ekit_accordion_style' => ['curve-shape']
419 ],
420 'selectors' => [
421 '{{WRAPPER}} .elementskit-accordion .elementskit-card-header>.elementskit-btn-link .path' => 'fill: {{VALUE}};',
422 ],
423 ]
424 );
425 $this->add_control(
426 'ekit_accordion_curve_stroke_close', [
427 'label' =>esc_html__( 'Border Color', 'elementskit-lite' ),
428 'type' => Controls_Manager::COLOR,
429 'condition' => [
430 'ekit_accordion_style' => ['curve-shape']
431 ],
432 'selectors' => [
433 '{{WRAPPER}} .elementskit-accordion .elementskit-card-header>.elementskit-btn-link' => 'fill: {{VALUE}};',
434 ],
435 ]
436 );
437
438
439 $this->add_group_control(
440 Group_Control_Border::get_type(),
441 [
442 'name' => 'ekit_accordion_title_border_close',
443 'label' => esc_html__( 'Border', 'elementskit-lite' ),
444 'condition' => [
445 'ekit_accordion_style!' => ['curve-shape']
446 ],
447 'selector' => '{{WRAPPER}} .elementskit-accordion .elementskit-card-header>.elementskit-btn-link',
448 ]
449 );
450 $this->add_control(
451 'ekit_accordion_border_radious_close',
452 [
453 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
454 'type' => Controls_Manager::DIMENSIONS,
455 'size_units' => [ 'px', '%', 'em' ],
456 'condition' => [
457 'ekit_accordion_style!' => ['curve-shape']
458 ],
459 'selectors' => [
460 '{{WRAPPER}} .elementskit-accordion .elementskit-card-header>.elementskit-btn-link' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
461 ],
462 ]
463 );
464
465 $this->add_group_control(
466 Group_Control_Box_Shadow::get_type(),
467 [
468 'name' => 'ekit_accordion_box_shadow_close',
469 'label' => esc_html__( 'Box Shadow', 'elementskit-lite' ),
470 'selector' => '{{WRAPPER}} .elementskit-accordion .elementskit-card-header>.elementskit-btn-link',
471 ]
472 );
473 $this->end_controls_tab();
474
475 $this->end_controls_tabs();
476
477 $this->add_control(
478 'ekit_accordion_title_divide',
479 [
480 'type' => Controls_Manager::DIVIDER,
481 'style' => 'thick',
482 ]
483 );
484
485 $this->add_responsive_control(
486 'ekit_accordion_title_padding',
487 [
488 'label' => esc_html__( 'Padding', 'elementskit-lite' ),
489 'type' => Controls_Manager::DIMENSIONS,
490 'size_units' => [ 'px' ],
491 'selectors' => [
492 '{{WRAPPER}} .elementskit-accordion .elementskit-card-header>.elementskit-btn-link' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
493 ],
494 ]
495 );
496
497 $this->add_responsive_control(
498 'ekit_accordion_title_margin_bottom', [
499 'label' =>esc_html__( 'Margin Bottom', 'elementskit-lite' ),
500 'type' => Controls_Manager::SLIDER,
501 'default' => [
502 'size' => '',
503 ],
504 'range' => [
505 'px' => [
506 'min' => -30,
507 'max' => 100,
508 'step' => 1,
509 ],
510 ],
511 'size_units' => ['px'],
512 'selectors' => [
513 '{{WRAPPER}} .elementskit-accordion .elementskit-card:not(:last-child)' => 'margin-bottom: {{SIZE}}{{UNIT}};',
514 ],
515 ]
516 );
517
518 $this->end_controls_section();
519
520 //Subtitle Style Section
521 $this->start_controls_section(
522 'ekit_accordion_section_content_style', [
523 'label' =>esc_html__( 'Description', 'elementskit-lite' ),
524 'tab' => Controls_Manager::TAB_STYLE,
525 ]
526 );
527
528 $this->add_control(
529 'ekit_accordion_content_color', [
530 'label' =>esc_html__( 'Color', 'elementskit-lite' ),
531 'type' => Controls_Manager::COLOR,
532 'selectors' => [
533 '{{WRAPPER}} .elementskit-accordion .elementskit-card-body p' => 'color: {{VALUE}};',
534 '{{WRAPPER}} .elementskit-accordion .elementskit-card-body' => 'color: {{VALUE}};',
535 ],
536 ]
537 );
538
539 $this->add_group_control(
540 Group_Control_Typography::get_type(), [
541 'name' => 'ekit_accordion_content_typography',
542 'selector' => '{{WRAPPER}} .elementskit-accordion .elementskit-card-body p, {{WRAPPER}} .elementskit-accordion .elementskit-card-body',
543 ]
544 );
545
546 $this->add_group_control(
547 Group_Control_Background::get_type(),
548 [
549 'name' => 'ekit_accordion_content_background',
550 'label' => esc_html__( 'Background', 'elementskit-lite' ),
551 'types' => [ 'classic', 'gradient' ],
552 'selector' => '{{WRAPPER}} .elementskit-accordion .elementskit-card-body, {{WRAPPER}} .accordion.floating-style .elementskit-card-body',
553 ]
554 );
555
556 $this->add_control(
557 'ekit_accordion_content_border_radious',
558 [
559 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
560 'type' => Controls_Manager::DIMENSIONS,
561 'size_units' => [ 'px', '%', 'em' ],
562 'selectors' => [
563 '{{WRAPPER}} .elementskit-accordion .elementskit-card-body' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
564 ],
565 ]
566 );
567
568 $this->add_responsive_control(
569 'ekit_accordion_content_padding',
570 [
571 'label' => esc_html__( 'Padding', 'elementskit-lite' ),
572 'type' => Controls_Manager::DIMENSIONS,
573 'size_units' => [ 'px', '%', 'em' ],
574 'selectors' => [
575 '{{WRAPPER}} .elementskit-accordion .elementskit-card-body' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
576 ],
577 ]
578 );
579
580 $this->add_responsive_control(
581 'ekit_accordion_content_width',
582 [
583 'label' => esc_html__( 'Width', 'elementskit-lite' ),
584 'type' => Controls_Manager::SLIDER,
585 'size_units' => [ 'px', '%', 'em' ],
586 'range' => [
587 '%' => [
588 'min' => 0,
589 'max' => 100,
590 ],
591 'px' => [
592 'min' => 0,
593 'max' => 1200,
594 ],
595 'em' => [
596 'min' => 0,
597 'max' => 100,
598 ],
599 ],
600 'default' => [
601 'unit' => '%',
602 'size' => 90,
603 ],
604 'selectors' => [
605 '{{WRAPPER}} .elementskit-accordion.floating-style .elementskit-card-body' => 'max-width: {{SIZE}}{{UNIT}};',
606 ],
607 'condition' => [
608 'ekit_accordion_style' => 'floating-style'
609 ]
610 ]
611 );
612
613 $this->end_controls_section();
614
615 //Slide border
616 $this->start_controls_section(
617 'ekit_accordion_section_border_style', [
618 'label' =>esc_html__( 'Border', 'elementskit-lite' ),
619 'tab' => Controls_Manager::TAB_STYLE,
620 ]
621 );
622
623 $this->start_controls_tabs(
624 'border_style_tabs'
625 );
626
627 $this->start_controls_tab(
628 'style_open_tab',
629 [
630 'label' => esc_html__( 'OPEN', 'elementskit-lite' ),
631 ]
632 );
633
634 $this->add_group_control(
635 Group_Control_Border::get_type(),
636 [
637 'name' => 'ekit_accordion_border_closed',
638 'label' => esc_html__( 'Border', 'elementskit-lite' ),
639 'selector' => '{{WRAPPER}} .elementskit-accordion > .elementskit-card.active',
640 ]
641 );
642
643 $this->add_control(
644 'ekit_accordion_border_radious_closed',
645 [
646 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
647 'type' => Controls_Manager::DIMENSIONS,
648 'size_units' => [ 'px', '%', 'em' ],
649 'selectors' => [
650 '{{WRAPPER}} .elementskit-accordion > .elementskit-card.active' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
651 '{{WRAPPER}} .elementskit-accordion .elementskit-card-header > .elementskit-btn-link' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} 0{{UNIT}} 0{{UNIT}};',
652 ],
653 ]
654 );
655
656 $this->add_group_control(
657 Group_Control_Box_Shadow::get_type(),
658 [
659 'name' => 'ekit_accordion_element_box_shadow_group_closed',
660 'label' => esc_html__( 'Box Shadow', 'elementskit-lite' ),
661 'selector' => '{{WRAPPER}} .elementskit-accordion > .elementskit-card.active',
662 ]
663 );
664
665 $this->end_controls_tab();
666
667 $this->start_controls_tab(
668 'style_close_tab',
669 [
670 'label' => esc_html__( 'CLOSED', 'elementskit-lite' ),
671 ]
672 );
673
674 $this->add_group_control(
675 Group_Control_Border::get_type(),
676 [
677 'name' => 'ekit_accordion_border_open',
678 'label' => esc_html__( 'Border', 'elementskit-lite' ),
679 'selector' => '{{WRAPPER}} .elementskit-accordion > .elementskit-card',
680 ]
681 );
682
683 $this->add_control(
684 'ekit_accordion_border_radious_open',
685 [
686 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
687 'type' => Controls_Manager::DIMENSIONS,
688 'size_units' => [ 'px', '%', 'em' ],
689 'selectors' => [
690 '{{WRAPPER}} .elementskit-accordion > .elementskit-card' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
691 '{{WRAPPER}} .elementskit-accordion .elementskit-card-header > .elementskit-btn-link.collapsed' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
692 ],
693 ]
694 );
695
696 $this->add_group_control(
697 Group_Control_Box_Shadow::get_type(),
698 [
699 'name' => 'ekit_accordion_element_box_shadow_group',
700 'label' => esc_html__( 'Box Shadow', 'elementskit-lite' ),
701 'selector' => '{{WRAPPER}} .elementskit-accordion > .elementskit-card',
702 ]
703 );
704
705 $this->end_controls_tab();
706
707 $this->end_controls_tabs();
708
709 $this->add_control(
710 'ekit_accordion_last_child_border_bottom',
711 [
712 'label' => esc_html__( 'Disable Border for last Element?', 'elementskit-lite' ),
713 'type' => Controls_Manager::SWITCHER,
714 'label_on' => esc_html__( 'Yes', 'elementskit-lite' ),
715 'label_off' => esc_html__( 'No', 'elementskit-lite' ),
716 'default' => '',
717 'return_value' => 'yes',
718 'separator' => 'before',
719 'selectors' => [
720 '{{WRAPPER}} .ekit-wid-con > .elementskit-accordion > .elementskit-card:last-child' => 'border: 0px;',
721 ]
722 ]
723 );
724
725 $this->end_controls_section();
726
727 //Icon Style Section
728 $this->start_controls_section(
729 'ekit_accordion_section_icon_style', [
730 'label' =>esc_html__( 'Icon', 'elementskit-lite' ),
731 'tab' => Controls_Manager::TAB_STYLE,
732 ]
733 );
734
735 $this->start_controls_tabs(
736 'ekit_accordion_style_tabs_icon'
737 );
738 $this->start_controls_tab(
739 'ekit_accordion_icon_open_tab',
740 [
741 'label' => esc_html__( 'Slide Closed Icon', 'elementskit-lite' ),
742 ]
743 );
744
745 $this->add_responsive_control(
746 'ekit_accordion_icon_typography_close',
747 [
748 'label' => esc_html__( 'Size', 'elementskit-lite' ),
749 'type' => Controls_Manager::SLIDER,
750 'range' => [
751 'px' => [
752 'min' => 6,
753 'max' => 300,
754 ],
755 ],
756 'selectors' => [
757 '{{WRAPPER}} .elementskit-accordion .elementskit-card-header .elementskit-btn-link .ekit_accordion_normal_icon' => 'font-size: {{SIZE}}{{UNIT}};'
758 ],
759 ]
760 );
761
762 $this->add_control(
763 'ekit_accordion_icon_color_close', [
764 'label' =>esc_html__( 'Color', 'elementskit-lite' ),
765 'type' => Controls_Manager::COLOR,
766 'selectors' => [
767 '{{WRAPPER}} .elementskit-accordion .elementskit-card-header .elementskit-btn-link .ekit_accordion_normal_icon' => 'color: {{VALUE}}; fill: {{VALUE}};',
768 ],
769 ]
770 );
771
772 $this->add_control(
773 'ekit_accordion_icon_hover_color_close', [
774 'label' =>esc_html__( 'Hover Color', 'elementskit-lite' ),
775 'type' => Controls_Manager::COLOR,
776 'selectors' => [
777 '{{WRAPPER}} .elementskit-accordion .elementskit-card-header .elementskit-btn-link:hover .ekit_accordion_normal_icon' => 'color: {{VALUE}}; fill: {{VALUE}};',
778 ],
779 ]
780 );
781
782 $this->add_control(
783 'ekit_accordion_icon_box_open_bg_hr',
784 [
785 'type' => Controls_Manager::DIVIDER,
786 'style' => 'thick',
787 'condition' => [
788 'ekit_accordion_style' => 'accordion-4'
789 ]
790 ]
791 );
792
793 $this->add_group_control(
794 Group_Control_Background::get_type(),
795 [
796 'name' => 'ekit_accordion_icon_box_open_bg',
797 'label' => esc_html__( 'Background', 'elementskit-lite' ),
798 'types' => [ 'classic', 'gradient' ],
799 'selector' => '{{WRAPPER}} .elementskit-accordion.accordion-4 .elementskit-card-header .elementskit-btn-link::before',
800 'condition' => [
801 'ekit_accordion_style' => 'accordion-4'
802 ]
803 ]
804 );
805
806 $this->add_group_control(
807 Group_Control_Background::get_type(),
808 [
809 'name' => 'ekit_accordion_icon_box_bg',
810 'label' => esc_html__( 'Background', 'elementskit-lite' ),
811 'types' => [ 'classic', 'gradient' ],
812 'selector' => '{{WRAPPER}} .elementskit-accordion .elementskit-card-header .elementskit-btn-link[aria-expanded="false"] > .ekit_accordion_icon_group',
813 ]
814 );
815
816 $this->add_group_control(
817 Group_Control_Border::get_type(),
818 [
819 'name' => 'ekit_accordion_icon_border',
820 'label' => esc_html__( 'Border', 'elementskit-lite' ),
821 'selector' => '{{WRAPPER}} .elementskit-accordion .elementskit-card-header .elementskit-btn-link[aria-expanded="false"] > .ekit_accordion_icon_group',
822 ]
823 );
824
825 $this->end_controls_tab();
826 $this->start_controls_tab(
827 'ekit_accordion_icon_close_tab',
828 [
829 'label' => esc_html__( ' Slide Open icon', 'elementskit-lite' ),
830 ]
831 );
832
833 $this->add_responsive_control(
834 'ekit_accordion_icon_typography', //icon id different because replaced the previous control
835 [
836 'label' => esc_html__( 'Size', 'elementskit-lite' ),
837 'type' => Controls_Manager::SLIDER,
838 'range' => [
839 'px' => [
840 'min' => 6,
841 'max' => 300,
842 ],
843 ],
844 'selectors' => [
845 '{{WRAPPER}} .elementskit-accordion .elementskit-card .elementskit-card-header .elementskit-btn-link .ekit_accordion_active_icon' => 'font-size: {{SIZE}}{{UNIT}};',
846 ]
847 ]
848 );
849
850 $this->add_control(
851 'ekit_accordion_icon_color', [
852 'label' =>esc_html__( 'Color', 'elementskit-lite' ),
853 'type' => Controls_Manager::COLOR,
854 'selectors' => [
855 '{{WRAPPER}} .elementskit-accordion .elementskit-card .elementskit-card-header .elementskit-btn-link .ekit_accordion_active_icon' => 'color: {{VALUE}}; fill: {{VALUE}};',
856 ],
857 ]
858 );
859
860 $this->add_control(
861 'ekit_accordion_icon_hover_color', [
862 'label' =>esc_html__( 'Hover Color', 'elementskit-lite' ),
863 'type' => Controls_Manager::COLOR,
864 'selectors' => [
865 '{{WRAPPER}} .elementskit-accordion .elementskit-card .elementskit-card-header .elementskit-btn-link:hover .ekit_accordion_active_icon' => 'color: {{VALUE}}; fill: {{VALUE}};',
866 ],
867 ]
868 );
869
870 $this->add_control(
871 'ekit_accordion_icon_box_close_bg_hr',
872 [
873 'type' => Controls_Manager::DIVIDER,
874 'style' => 'thick',
875 'condition' => [
876 'ekit_accordion_style' => 'accordion-4'
877 ]
878 ]
879 );
880
881 $this->add_group_control(
882 Group_Control_Background::get_type(),
883 [
884 'name' => 'ekit_accordion_icon_box_close_bg',
885 'label' => esc_html__( 'Background', 'elementskit-lite' ),
886 'types' => [ 'classic', 'gradient' ],
887 'selector' => '{{WRAPPER}} .elementskit-accordion.accordion-4 .elementskit-card-header .elementskit-btn-link[aria-expanded="true"]::before',
888 'condition' => [
889 'ekit_accordion_style' => ['accordion-4']
890 ]
891 ]
892 );
893
894 $this->add_group_control(
895 Group_Control_Background::get_type(),
896 [
897 'name' => 'ekit_accordion_closed_icon_bg',
898 'label' => esc_html__( 'Background', 'elementskit-lite' ),
899 'types' => [ 'classic', 'gradient' ],
900 'selector' => '{{WRAPPER}} .elementskit-accordion .elementskit-card-header .elementskit-btn-link .ekit_accordion_icon_group',
901 ]
902 );
903
904 $this->add_group_control(
905 Group_Control_Border::get_type(),
906 [
907 'name' => 'ekit_accordion_closed_icon_border',
908 'label' => esc_html__( 'Border', 'elementskit-lite' ),
909 'selector' => '{{WRAPPER}} .elementskit-accordion .elementskit-card-header .elementskit-btn-link .ekit_accordion_icon_group',
910 ]
911 );
912
913 $this->end_controls_tab();
914
915 $this->end_controls_tabs();
916
917 $this->add_control(
918 'ekit_accordion_icon_border_radious',
919 [
920 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
921 'type' => Controls_Manager::DIMENSIONS,
922 'size_units' => [ 'px', '%', 'em' ],
923 'separator' => 'before',
924 'selectors' => [
925 '{{WRAPPER}} .elementskit-accordion .elementskit-card-header .elementskit-btn-link .ekit_accordion_icon_group' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
926 ],
927 ]
928 );
929
930 $this->add_responsive_control(
931 'ekit_accordion_icon_padding',
932 [
933 'label' => esc_html__( 'Padding', 'elementskit-lite' ),
934 'type' => Controls_Manager::DIMENSIONS,
935 'size_units' => [ 'px', '%', 'em' ],
936 'selectors' => [
937 '{{WRAPPER}} .elementskit-accordion .elementskit-card .elementskit-card-header .elementskit-btn-link .ekit_accordion_icon_group' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
938 ],
939 ]
940 );
941
942 $this->add_responsive_control(
943 'ekit_accordion_section_icon_margin',
944 [
945 'label' => esc_html__( 'Margin', 'elementskit-lite' ),
946 'type' => Controls_Manager::DIMENSIONS,
947 'size_units' => [ 'px', '%', 'em' ],
948 'selectors' => [
949 '{{WRAPPER}} .ekit_accordion_icon_group, {{WRAPPER}} .ekit_accordion_icon_left_group' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
950 ],
951 ]
952 );
953
954 $this->end_controls_section();
955
956 $this->insert_pro_message();
957 }
958
959 protected function render( ) {
960 echo '<div class="ekit-wid-con" >';
961 $this->render_raw();
962 echo '</div>';
963 }
964
965 protected function render_raw( ) {
966
967 $settings = $this->get_settings_for_display();
968
969 extract($settings);
970
971 $has_user_defined_active_tab = false;
972 foreach($ekit_accordion_items as $tab){
973 if($tab['ekit_acc_is_active'] == 'yes'){
974 $has_user_defined_active_tab = true;
975 }
976 }
977 $acc_id = uniqid();
978
979 ?>
980
981 <div class="elementskit-accordion <?php echo esc_attr( $ekit_accordion_style ); ?>" id="accordion-<?php echo esc_attr($acc_id); ?>">
982
983 <?php
984
985 foreach ($ekit_accordion_items as $i=>$accorion_content) :
986 $is_active = ($accorion_content['ekit_acc_is_active'] == 'yes') ? ' show collapse' : ' collapse';
987 $is_active = ($ekit_accordion_open_first_slide == 'yes' && $has_user_defined_active_tab == false && $i == 0) ? ' show collapse' : $is_active;
988 ?>
989
990 <div class="elementskit-card <?php echo esc_attr($is_active == ' collapse' ? '' : 'active'); ?>">
991 <div class="elementskit-card-header" id="primaryHeading-<?php echo esc_attr($i); ?>-<?php echo esc_attr($this->get_id()); ?>" role="heading" aria-level="3">
992 <a href="#collapse-<?php echo esc_attr($accorion_content['_id'].$acc_id)?>" class="ekit-accordion--toggler elementskit-btn-link collapsed" role="button" data-ekit-toggle="collapse" data-target="#Collapse-<?php echo esc_attr($accorion_content['_id'].$acc_id)?>" aria-expanded="<?php echo esc_attr($is_active == ' collapse' ? 'false' : 'true'); ?>" aria-controls="Collapse-<?php echo esc_attr($accorion_content['_id'].$acc_id)?>">
993 <?php if(($ekit_accordion_icon_pos_style == 'left') || ($ekit_accordion_icon_pos_style == 'bothside')) : ?>
994 <div class="ekit_accordion_icon_left_group">
995 <div class="ekit_accordion_normal_icon">
996 <!-- Normal Icon -->
997 <?php Icons_Manager::render_icon($settings['ekit_accordion_left_icons']); ?>
998 </div>
999
1000 <div class="ekit_accordion_active_icon">
1001 <!-- Active Icon -->
1002 <?php Icons_Manager::render_icon($settings['ekit_accordion_left_icon_actives']); ?>
1003 </div>
1004 </div>
1005
1006 <?php endif;
1007
1008 if($ekit_accordion_display_loop_count == 'yes') : ?>
1009
1010 <span class="number"></span>
1011
1012 <?php endif; ?>
1013
1014 <span class="ekit-accordion-title"><?php echo esc_html($accorion_content['acc_title']); ?></span>
1015
1016 <?php if(($ekit_accordion_icon_pos_style == 'right') || ($ekit_accordion_icon_pos_style == 'bothside')) : ?>
1017
1018 <div class="ekit_accordion_icon_group">
1019 <div class="ekit_accordion_normal_icon">
1020 <!-- Normal Icon -->
1021 <?php Icons_Manager::render_icon($settings['ekit_accordion_right_icons']); ?>
1022 </div>
1023
1024 <div class="ekit_accordion_active_icon">
1025 <!-- Active Icon -->
1026 <?php Icons_Manager::render_icon($settings['ekit_accordion_right_icon_actives']); ?>
1027 </div>
1028 </div>
1029
1030 <?php endif; ?>
1031
1032 <?php if ( $ekit_accordion_style == 'curve-shape' ): ?>
1033 <svg version="1.1" class="svg-shape" x="0px" y="0px" viewBox="0 0 541 64" height="64" preserveAspectRatio="none">
1034 <polygon class="path" points="85,55 81,55 51,55 42.5,64 34,55 0,55 0,0 34.4,0 42.5,9.5 50.6,0 81,0 85,0 541,0 541,55 "/>
1035 </svg>
1036 <?php endif; ?>
1037 </a>
1038 </div>
1039
1040 <div id="Collapse-<?php echo esc_attr($accorion_content['_id'].$acc_id)?>" class="<?php echo esc_attr($is_active); ?>" role="region" aria-labelledby="primaryHeading-<?php echo esc_attr($i); ?>-<?php echo esc_attr($this->get_id()); ?>" data-parent="#accordion-<?php echo esc_attr($acc_id); ?>">
1041
1042 <div class="elementskit-card-body ekit-accordion--content">
1043 <?php echo do_shortcode( \ElementsKit_Lite\Utils::kses( $accorion_content['acc_content'] ) ); ?>
1044 </div>
1045
1046 </div>
1047
1048 </div><!-- .elementskit-card END -->
1049
1050 <?php endforeach; ?>
1051 <?php
1052 if ( isset( $settings['ekit_accordian_faq_schema'] ) && 'yes' === $settings['ekit_accordian_faq_schema'] ) {
1053 $json = [
1054 '@context' => 'https://schema.org',
1055 '@type' => 'FAQPage',
1056 'mainEntity' => [],
1057 ];
1058
1059 foreach ( $settings['ekit_accordion_items'] as $index => $item ) {
1060 $faq_schema_text = !empty( $item['acc_content'] ) ? $item['acc_content'] : '';
1061 $json['mainEntity'][] = [
1062 '@type' => 'Question',
1063 'name' => esc_html($item['acc_title']),
1064 'acceptedAnswer' => [
1065 '@type' => 'Answer',
1066 'text' => \ElementsKit_Lite\Utils::kses($faq_schema_text ) ,
1067 ],
1068 ];
1069 }
1070 ?>
1071 <script type="application/ld+json"><?php echo wp_json_encode( $json, JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE ); ?></script>
1072 <?php
1073 }
1074 ?>
1075 </div>
1076 <?php
1077 }
1078 }
1079