PluginProbe
Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets / 4.5.3
Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets v4.5.3
4.5.4 4.2.1 4.2.2 4.2.3 4.5.0 4.5.2 4.5.3 4.2.0 4.1.18 4.1.17 4.1.16 4.1.15 4.1.14 4.1.13 4.1.12 4.1.11 4.1.10 4.1.9 4.1.8 4.0.9 4.1.0 4.1.1 4.1.2 4.1.3 4.1.4 All 146 releases
ultimate-post-kit / modules / crystal-slider / widgets / crystal-slider.php

crystal-slider.php in Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets 4.5.3, at modules/crystal-slider/widgets/crystal-slider.php

1,775 lines 45.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2
3 namespace UltimatePostKit\Modules\CrystalSlider\Widgets;
4
5 use Elementor\Controls_Manager;
6 use Elementor\Group_Control_Border;
7 use Elementor\Group_Control_Box_Shadow;
8 use Elementor\Group_Control_Typography;
9 use Elementor\Group_Control_Text_Shadow;
10 use Elementor\Group_Control_Text_Stroke;
11 use Elementor\Group_Control_Image_Size;
12 use Elementor\Group_Control_Background;
13 use Elementor\Plugin;
14
15 use UltimatePostKit\Utils;
16 use UltimatePostKit\Traits\Global_Widget_Controls;
17 use UltimatePostKit\Includes\Controls\GroupQuery\Group_Control_Query;
18 use WP_Query;
19
20 if (!defined('ABSPATH')) exit; // Exit if accessed directly
21
22 class Crystal_Slider extends Group_Control_Query {
23
24 use Global_Widget_Controls;
25
26 private $_query = null;
27
28 public function get_name() {
29 return 'upk-crystal-slider';
30 }
31
32 public function get_title() {
33 return BDTUPK . esc_html__('Crystal Slider', 'ultimate-post-kit');
34 }
35
36 public function get_icon() {
37 return 'upk-widget-icon upk-icon-crystal-slider';
38 }
39
40 public function get_categories() {
41 return ['ultimate-post-kit'];
42 }
43
44 public function get_keywords() {
45 return ['post', 'carousel', 'blog', 'recent', 'news', 'slider', 'crystal'];
46 }
47
48 public function get_style_depends() {
49 if ($this->upk_is_edit_mode()) {
50 return ['swiper', 'upk-all-styles'];
51 } else {
52 return ['swiper', 'upk-font', 'upk-crystal-slider'];
53 }
54 }
55
56 public function get_script_depends() {
57 if ($this->upk_is_edit_mode()) {
58 return ['swiper', 'upk-all-scripts'];
59 } else {
60 return ['swiper', 'upk-crystal-slider'];
61 }
62 }
63
64 public function get_custom_help_url() {
65 return 'https://youtu.be/wZNw_prt-uI';
66 }
67
68
69 public function get_query() {
70 return $this->_query;
71 }
72
73 public function has_widget_inner_wrapper(): bool {
74 return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
75 }
76
77
78 protected function register_controls() {
79 $this->start_controls_section(
80 'section_content_layout',
81 [
82 'label' => esc_html__('Layout', 'ultimate-post-kit'),
83 ]
84 );
85
86 $this->add_responsive_control(
87 'item_height',
88 [
89 'label' => esc_html__('Height', 'ultimate-post-kit'),
90 'type' => Controls_Manager::SLIDER,
91 'size_units' => ['px', 'vh'],
92 'range' => [
93 'px' => [
94 'min' => 200,
95 'max' => 1080,
96 ],
97 'vh' => [
98 'min' => 10,
99 'max' => 100,
100 ],
101 ],
102 'selectors' => [
103 '{{WRAPPER}} .upk-crystal-slider .swiper-carousel' => 'height: {{SIZE}}{{UNIT}};',
104 ],
105 ]
106 );
107
108 $this->add_responsive_control(
109 'slide_spacing',
110 [
111 'label' => esc_html__('Slide Bottom Spacing', 'ultimate-post-kit'),
112 'type' => Controls_Manager::SLIDER,
113 'range' => [
114 'px' => [
115 'min' => 0,
116 'max' => 200,
117 ],
118 ],
119 'selectors' => [
120 '{{WRAPPER}} .upk-crystal-slider .swiper-carousel' => 'padding-bottom: {{SIZE}}{{UNIT}};',
121 ],
122 ]
123 );
124
125 $this->add_responsive_control(
126 'content_alignment',
127 [
128 'label' => esc_html__('Content Alignment', 'ultimate-post-kit'),
129 'type' => Controls_Manager::CHOOSE,
130 'default' => 'center',
131 'options' => [
132 'left' => [
133 'title' => esc_html__('Left', 'ultimate-post-kit'),
134 'icon' => 'eicon-text-align-left',
135 ],
136 'center' => [
137 'title' => esc_html__('Center', 'ultimate-post-kit'),
138 'icon' => 'eicon-text-align-center',
139 ],
140 'right' => [
141 'title' => esc_html__('Right', 'ultimate-post-kit'),
142 'icon' => 'eicon-text-align-right',
143 ],
144 ],
145 'selectors' => [
146 '{{WRAPPER}} .upk-crystal-slider .upk-content' => 'text-align: {{VALUE}};',
147 ],
148 ]
149 );
150
151 $this->add_group_control(
152 Group_Control_Image_Size::get_type(),
153 [
154 'name' => 'primary_thumbnail',
155 // phpcs:ignore WordPressVIPMinimum.Performance.WPQueryParams.PostNotIn_exclude -- Elementor widget query built from user-configured controls; expected behaviour.
156 'exclude' => ['custom'],
157 'default' => 'full',
158 ]
159 );
160
161 $this->add_control(
162 'hr_1',
163 [
164 'type' => Controls_Manager::DIVIDER,
165 ]
166 );
167
168 //Global Title Controls
169 $this->register_title_controls();
170
171 $this->add_control(
172 'show_category',
173 [
174 'label' => esc_html__('Show Category', 'ultimate-post-kit'),
175 'type' => Controls_Manager::SWITCHER,
176 'default' => 'yes',
177 ]
178 );
179
180 $this->add_control(
181 'strip_shortcode',
182 [
183 'label' => esc_html__('Strip Shortcode', 'ultimate-post-kit'),
184 'type' => Controls_Manager::SWITCHER,
185 'default' => 'yes',
186 'condition' => [
187 'show_excerpt' => 'yes',
188 ],
189 ]
190 );
191
192 $this->add_control(
193 'show_author',
194 [
195 'label' => esc_html__('Show Author', 'ultimate-post-kit'),
196 'type' => Controls_Manager::SWITCHER,
197 'default' => 'yes',
198 'separator' => 'before'
199 ]
200 );
201
202 $this->add_control(
203 'meta_separator',
204 [
205 'label' => __('Separator', 'ultimate-post-kit'),
206 'type' => Controls_Manager::TEXT,
207 'default' => '//',
208 'label_block' => false,
209 ]
210 );
211
212 //Global Date Controls
213 $this->register_date_controls();
214
215 //Global Reading Time Controls
216 $this->register_reading_time_controls();
217
218 $this->add_control(
219 'show_readmore',
220 [
221 'label' => esc_html__('Read more', 'ultimate-post-kit'),
222 'type' => Controls_Manager::SWITCHER,
223 'default' => 'no',
224 'separator' => 'before'
225 ]
226 );
227
228 $this->end_controls_section();
229
230 // Query Settings
231 $this->start_controls_section(
232 'section_post_query_builder',
233 [
234 'label' => __('Query', 'ultimate-post-kit'),
235 'tab' => Controls_Manager::TAB_CONTENT,
236 ]
237 );
238
239 $this->add_control(
240 'item_limit',
241 [
242 'label' => esc_html__('Item Limit', 'ultimate-post-kit'),
243 'type' => Controls_Manager::SLIDER,
244 'range' => [
245 'px' => [
246 'min' => 1,
247 'max' => 20,
248 ],
249 ],
250 'default' => [
251 'size' => 3,
252 ],
253 'condition' => [
254 'posts_source!' => 'current_query',
255 ]
256 ]
257 );
258
259 $this->register_query_builder_controls();
260
261 $this->end_controls_section();
262
263 $this->start_controls_section(
264 'section_carousel_settings',
265 [
266 'label' => __('Slider Settings', 'ultimate-post-kit'),
267 ]
268 );
269
270 $this->add_control(
271 'autoplay',
272 [
273 'label' => __('Autoplay', 'ultimate-post-kit'),
274 'type' => Controls_Manager::SWITCHER,
275 'default' => 'yes',
276
277 ]
278 );
279
280 $this->add_control(
281 'autoplay_speed',
282 [
283 'label' => esc_html__('Autoplay Speed', 'ultimate-post-kit'),
284 'type' => Controls_Manager::NUMBER,
285 'default' => 5000,
286 'condition' => [
287 'autoplay' => 'yes',
288 ],
289 ]
290 );
291
292 $this->add_control(
293 'pauseonhover',
294 [
295 'label' => esc_html__('Pause on Hover', 'ultimate-post-kit'),
296 'type' => Controls_Manager::SWITCHER,
297 'condition' => [
298 'autoplay' => 'yes',
299 ],
300 ]
301 );
302
303 $this->add_control(
304 'grab_cursor',
305 [
306 'label' => __('Grab Cursor', 'ultimate-post-kit'),
307 'type' => Controls_Manager::SWITCHER,
308 ]
309 );
310
311 $this->add_control(
312 'loop',
313 [
314 'label' => __('Loop', 'ultimate-post-kit'),
315 'type' => Controls_Manager::SWITCHER,
316 'default' => 'yes',
317
318 ]
319 );
320
321
322 $this->add_control(
323 'speed',
324 [
325 'label' => __('Animation Speed (ms)', 'ultimate-post-kit'),
326 'type' => Controls_Manager::SLIDER,
327 'default' => [
328 'size' => 500,
329 ],
330 'range' => [
331 'px' => [
332 'min' => 100,
333 'max' => 5000,
334 'step' => 50,
335 ],
336 ],
337 ]
338 );
339
340 $this->add_control(
341 'observer',
342 [
343 'label' => __('Observer', 'ultimate-post-kit'),
344 'description' => __('When you use carousel in any hidden place (in tabs, accordion etc) keep it yes.', 'ultimate-post-kit'),
345 'type' => Controls_Manager::SWITCHER,
346 ]
347 );
348
349 $this->add_control(
350 'show_navigation',
351 [
352 'label' => esc_html__('Show Navigation', 'ultimate-post-kit'),
353 'type' => Controls_Manager::SWITCHER,
354 'default' => 'yes',
355 'separator' => 'before'
356 ]
357 );
358
359 $this->add_control(
360 'nav_arrows_icon',
361 [
362 'label' => esc_html__('Arrows Icon', 'ultimate-post-kit'),
363 'type' => Controls_Manager::SELECT,
364 'default' => '0',
365 'options' => [
366 '0' => esc_html__('Default', 'ultimate-post-kit'),
367 '1' => esc_html__('Style 1', 'ultimate-post-kit'),
368 '2' => esc_html__('Style 2', 'ultimate-post-kit'),
369 '3' => esc_html__('Style 3', 'ultimate-post-kit'),
370 '4' => esc_html__('Style 4', 'ultimate-post-kit'),
371 '5' => esc_html__('Style 5', 'ultimate-post-kit'),
372 '6' => esc_html__('Style 6', 'ultimate-post-kit'),
373 '7' => esc_html__('Style 7', 'ultimate-post-kit'),
374 '8' => esc_html__('Style 8', 'ultimate-post-kit'),
375 '9' => esc_html__('Style 9', 'ultimate-post-kit'),
376 '10' => esc_html__('Style 10', 'ultimate-post-kit'),
377 '11' => esc_html__('Style 11', 'ultimate-post-kit'),
378 '12' => esc_html__('Style 12', 'ultimate-post-kit'),
379 '13' => esc_html__('Style 13', 'ultimate-post-kit'),
380 '14' => esc_html__('Style 14', 'ultimate-post-kit'),
381 '15' => esc_html__('Style 15', 'ultimate-post-kit'),
382 '16' => esc_html__('Style 16', 'ultimate-post-kit'),
383 '17' => esc_html__('Style 17', 'ultimate-post-kit'),
384 '18' => esc_html__('Style 18', 'ultimate-post-kit'),
385 'circle-1' => esc_html__('Style 19', 'ultimate-post-kit'),
386 'circle-2' => esc_html__('Style 20', 'ultimate-post-kit'),
387 'circle-3' => esc_html__('Style 21', 'ultimate-post-kit'),
388 'circle-4' => esc_html__('Style 22', 'ultimate-post-kit'),
389 'square-1' => esc_html__('Style 23', 'ultimate-post-kit'),
390 ],
391 'condition' => [
392 'show_navigation' => 'yes',
393 ],
394 ]
395 );
396
397 $this->add_control(
398 'show_pagination',
399 [
400 'label' => esc_html__('Show Pagination', 'ultimate-post-kit'),
401 'type' => Controls_Manager::SWITCHER,
402 'default' => 'yes',
403 'separator' => 'before'
404 ]
405 );
406
407 $this->end_controls_section();
408
409 //Style
410 $this->start_controls_section(
411 'section_style_content',
412 [
413 'label' => esc_html__('Content', 'ultimate-post-kit'),
414 'tab' => Controls_Manager::TAB_STYLE,
415 ]
416 );
417
418 $this->add_group_control(
419 Group_Control_Background::get_type(),
420 [
421 'name' => 'Content_background',
422 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-content',
423 ]
424 );
425
426 $this->add_group_control(
427 Group_Control_Border::get_type(),
428 [
429 'name' => 'content_border',
430 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-content',
431 ]
432 );
433
434 $this->add_responsive_control(
435 'content_border_radius',
436 [
437 'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
438 'type' => Controls_Manager::DIMENSIONS,
439 'size_units' => ['px', '%'],
440 'selectors' => [
441 '{{WRAPPER}} .upk-crystal-slider .upk-content' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
442 ],
443 ]
444 );
445
446 $this->add_responsive_control(
447 'content_padding',
448 [
449 'label' => __('Padding', 'ultimate-post-kit'),
450 'type' => Controls_Manager::DIMENSIONS,
451 'size_units' => ['px', 'em', '%'],
452 'selectors' => [
453 '{{WRAPPER}} .upk-crystal-slider .upk-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
454 ],
455 ]
456 );
457
458 $this->add_responsive_control(
459 'content_max_width',
460 [
461 'label' => esc_html__('Max Width', 'ultimate-post-kit'),
462 'type' => Controls_Manager::SLIDER,
463 'size_units' => ['px', '%'],
464 'range' => [
465 'px' => [
466 'min' => 0,
467 'max' => 1200,
468 'step' => 5,
469 ],
470 '%' => [
471 'min' => 0,
472 'max' => 200,
473 ],
474 ],
475 'default' => [
476 'unit' => '%',
477 ],
478 'selectors' => [
479 '{{WRAPPER}} .upk-crystal-slider .upk-content' => 'max-width: {{SIZE}}{{UNIT}};',
480 ],
481 ]
482 );
483
484 $this->add_responsive_control(
485 'content_vertical_offset',
486 [
487 'label' => esc_html__('Vertical Offset', 'ultimate-post-kit'),
488 'type' => Controls_Manager::SLIDER,
489 'size_units' => ['px', '%'],
490 'range' => [
491 'px' => [
492 'min' => -500,
493 'max' => 500,
494 ],
495 '%' => [
496 'min' => -200,
497 'max' => 200,
498 ],
499 ],
500 '%' => [
501 'min' => -0,
502 'max' => 100,
503 ],
504 'default' => [
505 'unit' => '%',
506 ],
507 'selectors' => [
508 '{{WRAPPER}} .upk-crystal-slider .upk-content' => 'bottom: {{SIZE}}{{UNIT}};',
509 ],
510 ]
511 );
512
513 $this->add_group_control(
514 Group_Control_Box_Shadow::get_type(),
515 [
516 'name' => 'content_shadow',
517 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-content',
518 ]
519 );
520
521 $this->end_controls_section();
522
523 $this->start_controls_section(
524 'section_style_title',
525 [
526 'label' => esc_html__('Title', 'ultimate-post-kit'),
527 'tab' => Controls_Manager::TAB_STYLE,
528 'condition' => [
529 'show_title' => 'yes',
530 ],
531 ]
532 );
533
534 $this->add_control(
535 'title_color',
536 [
537 'label' => esc_html__('Color', 'ultimate-post-kit'),
538 'type' => Controls_Manager::COLOR,
539 'selectors' => [
540 '{{WRAPPER}} .upk-crystal-slider .upk-title a' => 'color: {{VALUE}};',
541 ],
542 ]
543 );
544
545 $this->add_control(
546 'title_hover_color',
547 [
548 'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
549 'type' => Controls_Manager::COLOR,
550 'selectors' => [
551 '{{WRAPPER}} .upk-crystal-slider .upk-title a:hover' => 'color: {{VALUE}};',
552 ],
553 ]
554 );
555
556 $this->add_responsive_control(
557 'title_spacing',
558 [
559 'label' => esc_html__('Spacing', 'ultimate-post-kit'),
560 'type' => Controls_Manager::SLIDER,
561 'range' => [
562 'px' => [
563 'min' => 0,
564 'max' => 100,
565 ],
566 ],
567 'selectors' => [
568 '{{WRAPPER}} .upk-crystal-slider .upk-title' => 'margin-bottom: {{SIZE}}{{UNIT}};',
569 ],
570 ]
571 );
572
573 $this->add_group_control(
574 Group_Control_Typography::get_type(),
575 [
576 'name' => 'title_typography',
577 'label' => esc_html__('Typography', 'ultimate-post-kit'),
578 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-title',
579 ]
580 );
581
582 $this->add_group_control(
583 Group_Control_Text_Shadow::get_type(),
584 [
585 'name' => 'title_text_shadow',
586 'label' => __('Text Shadow', 'ultimate-post-kit'),
587 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-title a',
588 ]
589 );
590
591 $this->add_group_control(
592 Group_Control_Text_Stroke::get_type(),
593 [
594 'name' => 'title_text_stroke',
595 'label' => __('Text Stroke', 'ultimate-post-kit') . BDTUPK_NC,
596 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-title a',
597 ]
598 );
599
600 $this->end_controls_section();
601
602 $this->start_controls_section(
603 'section_style_meta',
604 [
605 'label' => esc_html__('Meta', 'ultimate-post-kit'),
606 'tab' => Controls_Manager::TAB_STYLE,
607 'conditions' => [
608 'relation' => 'or',
609 'terms' => [
610 [
611 'name' => 'show_author',
612 'value' => 'yes'
613 ],
614 [
615 'name' => 'show_date',
616 'value' => 'yes'
617 ],
618 [
619 'name' => 'show_comments',
620 'value' => 'yes'
621 ]
622 ]
623 ],
624 ]
625 );
626
627 $this->add_control(
628 'meta_color',
629 [
630 'label' => esc_html__('Color', 'ultimate-post-kit'),
631 'type' => Controls_Manager::COLOR,
632 'selectors' => [
633 '{{WRAPPER}} .upk-crystal-slider .upk-meta,
634 {{WRAPPER}} .upk-crystal-slider .upk-meta .upk-author a' => 'color: {{VALUE}};',
635 ],
636 ]
637 );
638
639 $this->add_control(
640 'meta_hover_color',
641 [
642 'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
643 'type' => Controls_Manager::COLOR,
644 'selectors' => [
645 '{{WRAPPER}} .upk-crystal-slider .upk-meta .upk-author a:hover' => 'color: {{VALUE}};',
646 ],
647 ]
648 );
649
650 $this->add_responsive_control(
651 'meta_space_between',
652 [
653 'label' => esc_html__('Space Between', 'ultimate-post-kit'),
654 'type' => Controls_Manager::SLIDER,
655 'range' => [
656 'px' => [
657 'min' => 0,
658 'max' => 50,
659 ],
660 ],
661 'selectors' => [
662 '{{WRAPPER}} .upk-crystal-slider .upk-meta > div:before' => 'margin: 0 {{SIZE}}{{UNIT}};',
663 ],
664 ]
665 );
666
667 $this->add_group_control(
668 Group_Control_Typography::get_type(),
669 [
670 'name' => 'meta_typography',
671 'label' => esc_html__('Typography', 'ultimate-post-kit'),
672 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-meta',
673 ]
674 );
675
676 $this->end_controls_section();
677
678 $this->start_controls_section(
679 'section_style_category',
680 [
681 'label' => esc_html__('Category', 'ultimate-post-kit'),
682 'tab' => Controls_Manager::TAB_STYLE,
683 'condition' => [
684 'show_category' => 'yes'
685 ],
686 ]
687 );
688
689 $this->add_responsive_control(
690 'category_bottom_spacing',
691 [
692 'label' => esc_html__('Spacing', 'ultimate-post-kit'),
693 'type' => Controls_Manager::SLIDER,
694 'range' => [
695 'px' => [
696 'min' => 0,
697 'max' => 50,
698 ],
699 ],
700 'selectors' => [
701 '{{WRAPPER}} .upk-crystal-slider .upk-category' => 'margin-bottom: {{SIZE}}{{UNIT}};',
702 ],
703 ]
704 );
705
706 $this->start_controls_tabs('tabs_category_style');
707
708 $this->start_controls_tab(
709 'tab_category_normal',
710 [
711 'label' => esc_html__('Normal', 'ultimate-post-kit'),
712 ]
713 );
714
715 $this->add_control(
716 'category_color',
717 [
718 'label' => esc_html__('Color', 'ultimate-post-kit'),
719 'type' => Controls_Manager::COLOR,
720 'selectors' => [
721 '{{WRAPPER}} .upk-crystal-slider .upk-category a' => 'color: {{VALUE}};',
722 ],
723 ]
724 );
725
726 $this->add_group_control(
727 Group_Control_Background::get_type(),
728 [
729 'name' => 'category_background',
730 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-category a',
731 ]
732 );
733
734 $this->add_group_control(
735 Group_Control_Border::get_type(),
736 [
737 'name' => 'category_border',
738 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-category a',
739 ]
740 );
741
742 $this->add_responsive_control(
743 'category_border_radius',
744 [
745 'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
746 'type' => Controls_Manager::DIMENSIONS,
747 'size_units' => ['px', '%'],
748 'selectors' => [
749 '{{WRAPPER}} .upk-crystal-slider .upk-category a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
750 ],
751 ]
752 );
753
754 $this->add_responsive_control(
755 'category_padding',
756 [
757 'label' => esc_html__('Padding', 'ultimate-post-kit'),
758 'type' => Controls_Manager::DIMENSIONS,
759 'size_units' => ['px', 'em', '%'],
760 'selectors' => [
761 '{{WRAPPER}} .upk-crystal-slider .upk-category a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
762 ],
763 ]
764 );
765
766 $this->add_responsive_control(
767 'category_spacing',
768 [
769 'label' => esc_html__('Space Between', 'ultimate-post-kit'),
770 'type' => Controls_Manager::SLIDER,
771 'range' => [
772 'px' => [
773 'min' => 0,
774 'max' => 50,
775 ],
776 ],
777 'selectors' => [
778 '{{WRAPPER}} .upk-crystal-slider .upk-category a+a' => 'margin-left: {{SIZE}}{{UNIT}};',
779 ],
780 ]
781 );
782
783 $this->add_group_control(
784 Group_Control_Box_Shadow::get_type(),
785 [
786 'name' => 'category_shadow',
787 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-category a',
788 ]
789 );
790
791 $this->add_group_control(
792 Group_Control_Typography::get_type(),
793 [
794 'name' => 'category_typography',
795 'label' => esc_html__('Typography', 'ultimate-post-kit'),
796 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-category a',
797 ]
798 );
799
800 $this->end_controls_tab();
801
802 $this->start_controls_tab(
803 'tab_category_hover',
804 [
805 'label' => esc_html__('Hover', 'ultimate-post-kit'),
806 'condition' => [
807 'show_category' => 'yes'
808 ]
809 ]
810 );
811
812 $this->add_control(
813 'category_hover_color',
814 [
815 'label' => esc_html__('Color', 'ultimate-post-kit'),
816 'type' => Controls_Manager::COLOR,
817 'selectors' => [
818 '{{WRAPPER}} .upk-crystal-slider .upk-category a:hover' => 'color: {{VALUE}};',
819 ],
820 ]
821 );
822
823 $this->add_group_control(
824 Group_Control_Background::get_type(),
825 [
826 'name' => 'category_hover_background',
827 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-category a:hover',
828 ]
829 );
830
831 $this->add_control(
832 'category_hover_border_color',
833 [
834 'label' => esc_html__('Border Color', 'ultimate-post-kit'),
835 'type' => Controls_Manager::COLOR,
836 'condition' => [
837 'category_border_border!' => '',
838 ],
839 'selectors' => [
840 '{{WRAPPER}} .upk-crystal-slider .upk-category a:hover' => 'border-color: {{VALUE}};',
841 ],
842 ]
843 );
844
845 $this->end_controls_tab();
846
847 $this->end_controls_tabs();
848
849 $this->end_controls_section();
850
851 //Read More Css
852 $this->start_controls_section(
853 'section_style_btn',
854 [
855 'label' => __('Read More', 'ultimate-post-kit'),
856 'tab' => Controls_Manager::TAB_STYLE,
857 'condition' => [
858 'show_readmore' => 'yes'
859 ]
860 ]
861 );
862
863 $this->start_controls_tabs('tabs_read_more_style');
864
865 $this->start_controls_tab(
866 'tabs_read_more_normal',
867 [
868 'label' => __('Normal', 'ultimate-post-kit'),
869 ]
870 );
871
872 $this->add_control(
873 'button_icon_color',
874 [
875 'label' => __('Icon Color', 'ultimate-post-kit'),
876 'type' => Controls_Manager::COLOR,
877 'selectors' => [
878 '{{WRAPPER}} .upk-crystal-slider .upk-link-btn a' => 'color: {{VALUE}}',
879 ],
880 ]
881 );
882
883 $this->add_group_control(
884 Group_Control_Background::get_type(),
885 [
886 'name' => 'button_background',
887 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-link-btn a',
888 ]
889 );
890
891 $this->add_group_control(
892 Group_Control_Border::get_type(),
893 [
894 'name' => 'button_border',
895 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-link-btn a',
896 ]
897 );
898
899 $this->add_responsive_control(
900 'button_border_radius',
901 [
902 'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
903 'type' => Controls_Manager::DIMENSIONS,
904 'size_units' => ['px', '%'],
905 'selectors' => [
906 '{{WRAPPER}} .upk-crystal-slider .upk-link-btn a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
907 ],
908 ]
909 );
910
911 $this->add_responsive_control(
912 'read_more_padding',
913 [
914 'label' => __('Padding', 'ultimate-post-kit'),
915 'type' => Controls_Manager::DIMENSIONS,
916 'size_units' => ['px', 'em', '%'],
917 'selectors' => [
918 '{{WRAPPER}} .upk-crystal-slider .upk-link-btn a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
919 ],
920 ]
921 );
922
923 $this->add_responsive_control(
924 'button_icon_size',
925 [
926 'label' => esc_html__('Icon Size', 'ultimate-post-kit'),
927 'type' => Controls_Manager::SLIDER,
928 'selectors' => [
929 '{{WRAPPER}} .upk-crystal-slider .upk-link-btn a' => 'font-size: {{SIZE}}{{UNIT}};',
930 ],
931 ]
932 );
933
934
935 $this->add_responsive_control(
936 'button_vertical_offset',
937 [
938 'label' => esc_html__('Vertical Offset', 'ultimate-post-kit'),
939 'type' => Controls_Manager::SLIDER,
940 'size_units' => ['px', '%'],
941 'range' => [
942 'px' => [
943 'min' => -1000,
944 'max' => 1000,
945 ],
946 '%' => [
947 'min' => -100,
948 'max' => 100,
949 ],
950 ],
951 '%' => [
952 'min' => -0,
953 'max' => 100,
954 ],
955 'default' => [
956 'unit' => '%',
957 ],
958 'selectors' => [
959 '{{WRAPPER}} .upk-crystal-slider .upk-link-btn' => 'top: {{SIZE}}{{UNIT}};',
960 ],
961 ]
962 );
963
964 $this->add_responsive_control(
965 'button_horizontal_offset',
966 [
967 'label' => esc_html__('Horizontal Offset', 'ultimate-post-kit'),
968 'type' => Controls_Manager::SLIDER,
969 'size_units' => ['px', '%'],
970 'range' => [
971 'px' => [
972 'min' => -1000,
973 'max' => 1000,
974 ],
975 '%' => [
976 'min' => -100,
977 'max' => 100,
978 ],
979 ],
980 '%' => [
981 'min' => -0,
982 'max' => 100,
983 ],
984 'default' => [
985 'unit' => '%',
986 ],
987 'selectors' => [
988 '{{WRAPPER}} .upk-crystal-slider .upk-link-btn' => 'left: {{SIZE}}{{UNIT}};',
989 ],
990 ]
991 );
992
993 $this->add_group_control(
994 Group_Control_Box_Shadow::get_type(),
995 [
996 'name' => 'button_shadow',
997 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-link-btn a',
998 ]
999 );
1000
1001 $this->end_controls_tab();
1002
1003 $this->start_controls_tab(
1004 'tabs_button_hover',
1005 [
1006 'label' => __('Hover', 'ultimate-post-kit'),
1007 ]
1008 );
1009
1010 $this->add_control(
1011 'button_hover_color',
1012 [
1013 'label' => __('Color', 'ultimate-post-kit'),
1014 'type' => Controls_Manager::COLOR,
1015 'selectors' => [
1016 '{{WRAPPER}} .upk-crystal-slider .upk-content:hover .upk-link-btn a' => 'color: {{VALUE}}',
1017 ],
1018 ]
1019 );
1020
1021 $this->add_group_control(
1022 Group_Control_Background::get_type(),
1023 [
1024 'name' => 'button_hover_background',
1025 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-content:hover .upk-link-btn a',
1026 ]
1027 );
1028
1029 $this->add_control(
1030 'button_hover_border_color',
1031 [
1032 'label' => esc_html__('Border Color', 'ultimate-post-kit'),
1033 'type' => Controls_Manager::COLOR,
1034 'condition' => [
1035 'arrows_border_border!' => '',
1036 ],
1037 'selectors' => [
1038 '{{WRAPPER}} .upk-crystal-slider .upk-content:hover .upk-link-btn a' => 'border-color: {{VALUE}};',
1039 ],
1040 ]
1041 );
1042
1043 $this->add_group_control(
1044 Group_Control_Box_Shadow::get_type(),
1045 [
1046 'name' => 'button_hover_shadow',
1047 'selector' => '{{WRAPPER}}.upk-crystal-slider .upk-content:hover .upk-link-btn a',
1048 ]
1049 );
1050
1051 $this->end_controls_tab();
1052
1053 $this->end_controls_tabs();
1054
1055 $this->end_controls_section();
1056
1057 //Navigation Css
1058 $this->start_controls_section(
1059 'section_style_navigation',
1060 [
1061 'label' => __('Navigation', 'ultimate-post-kit'),
1062 'tab' => Controls_Manager::TAB_STYLE,
1063 ]
1064 );
1065
1066 $this->start_controls_tabs('tabs_navigation_arrows_style');
1067
1068 $this->start_controls_tab(
1069 'tabs_nav_arrows_normal',
1070 [
1071 'label' => __('Normal', 'ultimate-post-kit'),
1072 ]
1073 );
1074
1075 $this->add_control(
1076 'arrows_color',
1077 [
1078 'label' => __('Color', 'ultimate-post-kit'),
1079 'type' => Controls_Manager::COLOR,
1080 'selectors' => [
1081 '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev' => 'color: {{VALUE}}',
1082 ],
1083 ]
1084 );
1085
1086 $this->add_group_control(
1087 Group_Control_Background::get_type(),
1088 [
1089 'name' => 'arrows_background',
1090 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev',
1091 ]
1092 );
1093
1094 $this->add_group_control(
1095 Group_Control_Border::get_type(),
1096 [
1097 'name' => 'arrows_border',
1098 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev',
1099 ]
1100 );
1101
1102 $this->add_responsive_control(
1103 'arrows_border_radius',
1104 [
1105 'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
1106 'type' => Controls_Manager::DIMENSIONS,
1107 'size_units' => ['px', '%'],
1108 'selectors' => [
1109 '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1110 ],
1111 ]
1112 );
1113
1114 $this->add_responsive_control(
1115 'arrows_size',
1116 [
1117 'label' => esc_html__('Size', 'ultimate-post-kit'),
1118 'type' => Controls_Manager::SLIDER,
1119 'selectors' => [
1120 '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev' => 'font-size: {{SIZE}}{{UNIT}};',
1121 ],
1122 ]
1123 );
1124
1125 $this->add_responsive_control(
1126 'navigation_padding',
1127 [
1128 'label' => __('Padding', 'ultimate-post-kit'),
1129 'type' => Controls_Manager::DIMENSIONS,
1130 'size_units' => ['px', 'em', '%'],
1131 'selectors' => [
1132 '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider
1133 .upk-navigation-wrap .upk-navigation-prev' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1134 ],
1135 ]
1136 );
1137
1138 $this->add_group_control(
1139 Group_Control_Box_Shadow::get_type(),
1140 [
1141 'name' => 'arrows_shadow',
1142 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev',
1143 ]
1144 );
1145
1146 $this->add_responsive_control(
1147 'vertical_offset',
1148 [
1149 'label' => esc_html__('Vertical Offset', 'ultimate-post-kit'),
1150 'type' => Controls_Manager::SLIDER,
1151 'selectors' => [
1152 '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev' => 'top: {{SIZE}}%;',
1153 ],
1154 ]
1155 );
1156
1157 $this->add_responsive_control(
1158 'horizontal_offset_next',
1159 [
1160 'label' => esc_html__('Horizontal Offset', 'ultimate-post-kit'),
1161 'type' => Controls_Manager::SLIDER,
1162 'size_units' => ['px', '%'],
1163 'default' => [
1164 'unit' => '%',
1165 ],
1166 'selectors' => [
1167 '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next' => 'right: {{SIZE}}{{UNIT}}; left: auto;',
1168 '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev' => 'left: {{SIZE}}{{UNIT}}; right: auto;',
1169 ],
1170 ]
1171 );
1172
1173 $this->end_controls_tab();
1174
1175 $this->start_controls_tab(
1176 'tabs_nav_arrows_hover',
1177 [
1178 'label' => __('Hover', 'ultimate-post-kit'),
1179 ]
1180 );
1181
1182 $this->add_control(
1183 'arrows_hover_color',
1184 [
1185 'label' => __('Color', 'ultimate-post-kit'),
1186 'type' => Controls_Manager::COLOR,
1187 'selectors' => [
1188 '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next:hover, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev:hover' => 'color: {{VALUE}}',
1189 ],
1190 ]
1191 );
1192
1193 $this->add_group_control(
1194 Group_Control_Background::get_type(),
1195 [
1196 'name' => 'arrows_hover_background',
1197 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next:hover, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev:hover',
1198 ]
1199 );
1200
1201 $this->add_control(
1202 'arrows_hover_border_color',
1203 [
1204 'label' => esc_html__('Border Color', 'ultimate-post-kit'),
1205 'type' => Controls_Manager::COLOR,
1206 'condition' => [
1207 'arrows_border_border!' => '',
1208 ],
1209 'selectors' => [
1210 '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next:hover, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev:hover' => 'border-color: {{VALUE}};',
1211 ],
1212 ]
1213 );
1214
1215 $this->add_group_control(
1216 Group_Control_Box_Shadow::get_type(),
1217 [
1218 'name' => 'arrows_hover_shadow',
1219 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next:hover, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev:hover',
1220 ]
1221 );
1222
1223 $this->end_controls_tab();
1224
1225 $this->end_controls_tabs();
1226
1227 $this->end_controls_section();
1228
1229 //Pagination Css
1230 $this->start_controls_section(
1231 'section_style_pagination',
1232 [
1233 'label' => __('Pagination', 'ultimate-post-kit'),
1234 'tab' => Controls_Manager::TAB_STYLE,
1235 'condition' => [
1236 'show_pagination' => 'yes'
1237 ]
1238 ]
1239 );
1240
1241 $this->add_responsive_control(
1242 'dots_nny_position',
1243 [
1244 'label' => __('Dots Vertical Offset', 'ultimate-post-kit'),
1245 'type' => Controls_Manager::SLIDER,
1246 'range' => [
1247 'px' => [
1248 'min' => -200,
1249 'max' => 200,
1250 ],
1251 ],
1252 'selectors' => [
1253 '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap' => 'bottom: {{SIZE}}px;'
1254 ],
1255 ]
1256 );
1257
1258 $this->start_controls_tabs('tabs_navigation_dots_style');
1259
1260 $this->start_controls_tab(
1261 'tabs_nav_dots_normal',
1262 [
1263 'label' => __('Normal', 'ultimate-post-kit'),
1264 ]
1265 );
1266
1267 $this->add_control(
1268 'dots_color',
1269 [
1270 'label' => __('Color', 'ultimate-post-kit'),
1271 'type' => Controls_Manager::COLOR,
1272 'selectors' => [
1273 '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet' => 'background-color: {{VALUE}}',
1274 ],
1275 ]
1276 );
1277
1278 $this->add_responsive_control(
1279 'dots_space_between',
1280 [
1281 'label' => __('Space Between', 'ultimate-post-kit'),
1282 'type' => Controls_Manager::SLIDER,
1283 'selectors' => [
1284 '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .upk-pagination ' => 'grid-column-gap: {{SIZE}}{{UNIT}};',
1285 ],
1286 ]
1287 );
1288
1289 $this->add_responsive_control(
1290 'dots_size',
1291 [
1292 'label' => __('Size', 'ultimate-post-kit'),
1293 'type' => Controls_Manager::SLIDER,
1294 'range' => [
1295 'px' => [
1296 'min' => 5,
1297 'max' => 20,
1298 ],
1299 ],
1300 'selectors' => [
1301 '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet' => 'height: {{SIZE}}{{UNIT}}; width: {{SIZE}}{{UNIT}};',
1302 ],
1303 'condition' => [
1304 'advanced_dots_size' => ''
1305 ],
1306 ]
1307 );
1308
1309 $this->add_control(
1310 'advanced_dots_size',
1311 [
1312 'label' => __('Advanced Size', 'ultimate-post-kit'),
1313 'type' => Controls_Manager::SWITCHER,
1314 ]
1315 );
1316
1317 $this->add_responsive_control(
1318 'advanced_dots_width',
1319 [
1320 'label' => __('Width(px)', 'ultimate-post-kit'),
1321 'type' => Controls_Manager::SLIDER,
1322 'range' => [
1323 'px' => [
1324 'min' => 1,
1325 'max' => 50,
1326 ],
1327 ],
1328 'selectors' => [
1329 '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet' => 'width: {{SIZE}}{{UNIT}};',
1330 ],
1331 'condition' => [
1332 'advanced_dots_size' => 'yes'
1333 ],
1334 ]
1335 );
1336
1337 $this->add_responsive_control(
1338 'advanced_dots_height',
1339 [
1340 'label' => __('Height(px)', 'ultimate-post-kit'),
1341 'type' => Controls_Manager::SLIDER,
1342 'range' => [
1343 'px' => [
1344 'min' => 1,
1345 'max' => 50,
1346 ],
1347 ],
1348 'selectors' => [
1349 '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet' => 'height: {{SIZE}}{{UNIT}};',
1350 ],
1351 'condition' => [
1352 'advanced_dots_size' => 'yes'
1353 ],
1354 ]
1355 );
1356
1357 $this->add_responsive_control(
1358 'advanced_dots_radius',
1359 [
1360 'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
1361 'type' => Controls_Manager::DIMENSIONS,
1362 'size_units' => ['px', '%'],
1363 'selectors' => [
1364 '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1365 ],
1366 'condition' => [
1367 'advanced_dots_size' => 'yes'
1368 ],
1369 ]
1370 );
1371
1372 $this->add_group_control(
1373 Group_Control_Box_Shadow::get_type(),
1374 [
1375 'name' => 'dots_box_shadow',
1376 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet',
1377 ]
1378 );
1379
1380 $this->end_controls_tab();
1381
1382 $this->start_controls_tab(
1383 'tabs_nav_dots_active',
1384 [
1385 'label' => __('Active', 'ultimate-post-kit'),
1386 ]
1387 );
1388
1389 $this->add_control(
1390 'active_dot_color',
1391 [
1392 'label' => __('Color', 'ultimate-post-kit'),
1393 'type' => Controls_Manager::COLOR,
1394 'selectors' => [
1395 '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet' => 'background-color: {{VALUE}}',
1396 ],
1397 ]
1398 );
1399
1400 $this->add_responsive_control(
1401 'active_dots_size',
1402 [
1403 'label' => __('Size', 'ultimate-post-kit'),
1404 'type' => Controls_Manager::SLIDER,
1405 'range' => [
1406 'px' => [
1407 'min' => 5,
1408 'max' => 20,
1409 ],
1410 ],
1411 'selectors' => [
1412 '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet-active' => 'height: {{SIZE}}{{UNIT}};width: {{SIZE}}{{UNIT}};',
1413 '{{WRAPPER}}' => '--ps-swiper-dots-active-height: {{SIZE}}{{UNIT}};',
1414 ],
1415 'condition' => [
1416 'advanced_dots_size' => ''
1417 ],
1418 ]
1419 );
1420
1421 $this->add_responsive_control(
1422 'active_advanced_dots_width',
1423 [
1424 'label' => __('Width(px)', 'ultimate-post-kit'),
1425 'type' => Controls_Manager::SLIDER,
1426 'range' => [
1427 'px' => [
1428 'min' => 1,
1429 'max' => 50,
1430 ],
1431 ],
1432 'selectors' => [
1433 '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet-active' => 'width: {{SIZE}}{{UNIT}};',
1434 ],
1435 'condition' => [
1436 'advanced_dots_size' => 'yes'
1437 ],
1438 ]
1439 );
1440
1441 $this->add_responsive_control(
1442 'active_advanced_dots_height',
1443 [
1444 'label' => __('Height(px)', 'ultimate-post-kit'),
1445 'type' => Controls_Manager::SLIDER,
1446 'range' => [
1447 'px' => [
1448 'min' => 1,
1449 'max' => 50,
1450 ],
1451 ],
1452 'selectors' => [
1453 '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet-active' => 'height: {{SIZE}}{{UNIT}};',
1454 '{{WRAPPER}}' => '--ps-swiper-dots-active-height: {{SIZE}}{{UNIT}};',
1455 ],
1456 'condition' => [
1457 'advanced_dots_size' => 'yes'
1458 ],
1459 ]
1460 );
1461
1462 $this->add_responsive_control(
1463 'active_advanced_dots_radius',
1464 [
1465 'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
1466 'type' => Controls_Manager::DIMENSIONS,
1467 'size_units' => ['px', '%'],
1468 'selectors' => [
1469 '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet-active' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1470 ],
1471 'condition' => [
1472 'advanced_dots_size' => 'yes'
1473 ],
1474 ]
1475 );
1476
1477 $this->add_responsive_control(
1478 'active_advanced_dots_align',
1479 [
1480 'label' => __('Alignment', 'ultimate-post-kit'),
1481 'type' => Controls_Manager::CHOOSE,
1482 'options' => [
1483 'flex-start' => [
1484 'title' => __('Top', 'ultimate-post-kit'),
1485 'icon' => 'eicon-v-align-top',
1486 ],
1487 'center' => [
1488 'title' => __('Center', 'ultimate-post-kit'),
1489 'icon' => 'eicon-v-align-middle',
1490 ],
1491 'flex-end' => [
1492 'title' => __('Bottom', 'ultimate-post-kit'),
1493 'icon' => 'eicon-v-align-bottom',
1494 ],
1495 ],
1496 'selectors' => [
1497 '{{WRAPPER}}' => '--ps-swiper-dots-align: {{VALUE}};',
1498 ],
1499 'condition' => [
1500 'advanced_dots_size' => 'yes'
1501 ],
1502 ]
1503 );
1504
1505 $this->add_group_control(
1506 Group_Control_Box_Shadow::get_type(),
1507 [
1508 'name' => 'dots_active_box_shadow',
1509 'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet-active',
1510 ]
1511 );
1512
1513 $this->end_controls_tab();
1514
1515 $this->end_controls_tabs();
1516
1517 $this->end_controls_section();
1518 }
1519
1520 /**
1521 * Main query render for this widget
1522 * @param $posts_per_page number item query limit
1523 */
1524 public function query_posts($posts_per_page) {
1525
1526 $default = $this->getGroupControlQueryArgs();
1527 $args = [];
1528 if ($posts_per_page) {
1529 $args['posts_per_page'] = $posts_per_page;
1530 }
1531 $args = array_merge($default, $args);
1532 $this->_query = new WP_Query($args);
1533 }
1534
1535 public function render_image($image_id, $size) {
1536 $placeholder_image_src = Utils::get_placeholder_image_src();
1537
1538 $image_src = wp_get_attachment_image_src($image_id, $size);
1539
1540 if (!$image_src) {
1541 $image_src = $placeholder_image_src;
1542 } else {
1543 $image_src = $image_src[0];
1544 }
1545
1546 ?>
1547
1548 <img class="upk-img swiper-lazy" src="<?php echo esc_url($image_src); ?>" alt="<?php echo esc_attr(get_the_title()); ?>">
1549
1550 <?php
1551 }
1552
1553 public function render_title() {
1554 $settings = $this->get_settings_for_display();
1555
1556 if (!$this->get_settings('show_title')) {
1557 return;
1558 }
1559
1560 $title = get_the_title();
1561 printf('<%1$s class="upk-title"><a href="%2$s" title="%4$s">%3$s</a></%1$s>', esc_attr(Utils::get_valid_html_tag($settings['title_tags'])), esc_url( get_permalink() ), esc_html( $title ), esc_attr( $title ));
1562 }
1563
1564 public function render_category() {
1565
1566 if (!$this->get_settings('show_category')) {
1567 return;
1568 }
1569 ?>
1570 <div class="upk-category" data-swiper-parallax-x="-150" data-swiper-parallax-duration="1000">
1571 <?php echo wp_kses_post( upk_get_category($this->get_settings('posts_source')) ); ?>
1572 </div>
1573 <?php
1574 }
1575
1576 public function render_date() {
1577 $settings = $this->get_settings_for_display();
1578
1579
1580 if (!$this->get_settings('show_date')) {
1581 return;
1582 }
1583
1584 ?>
1585 <div class="upk-date-and-time upk-flex upk-flex-middle">
1586 <div class="upk-date">
1587 <i class="upk-icon-calendar" aria-hidden="true"></i>
1588 <span>
1589 <?php if ($settings['human_diff_time'] == 'yes') {
1590 echo esc_html( ultimate_post_kit_post_time_diff( ( $settings['human_diff_time_short'] == 'yes' ) ? 'short' : '' ) );
1591 } else {
1592 echo get_the_date();
1593 } ?>
1594 </span>
1595
1596 </div>
1597 <?php if ($settings['show_time']) : ?>
1598 <div class="upk-post-time">
1599 <i class="upk-icon-clock" aria-hidden="true"></i>
1600 <?php echo esc_html( get_the_time() ); ?>
1601 </div>
1602 <?php endif; ?>
1603 </div>
1604
1605 <?php
1606 }
1607
1608 public function render_author() {
1609
1610 if (!$this->get_settings('show_author')) {
1611 return;
1612 }
1613 ?>
1614 <div class="upk-author">
1615 <i class="upk-icon-user" aria-hidden="true"></i>
1616 <a href="<?php echo esc_url( get_author_posts_url(get_the_author_meta('ID')) ); ?>">
1617 <?php echo esc_html( get_the_author() ) ?>
1618 </a>
1619 </div>
1620 <?php
1621 }
1622
1623 public function render_header() {
1624 $id = 'upk-crystal-slider-' . $this->get_id();
1625 $settings = $this->get_settings_for_display();
1626
1627 $this->add_render_attribute('crystal-slider', 'id', $id);
1628 $this->add_render_attribute('crystal-slider', 'class', ['upk-crystal-slider']);
1629
1630 $this->add_render_attribute(
1631 [
1632 'crystal-slider' => [
1633 'data-settings' => [
1634 wp_json_encode(array_filter([
1635 "autoplay" => ("yes" == $settings["autoplay"]) ? ["delay" => $settings["autoplay_speed"]] : false,
1636 "loop" => ($settings["loop"] == "yes") ? true : false,
1637 "speed" => $settings["speed"]["size"],
1638 "effect" => 'slide',
1639 "lazy" => true,
1640 "parallax" => true,
1641 "grabCursor" => ($settings["grab_cursor"] === "yes") ? true : false,
1642 "pauseOnHover" => ("yes" == $settings["pauseonhover"]) ? true : false,
1643 "slidesPerView" => 1,
1644 "observer" => ($settings["observer"]) ? true : false,
1645 "observeParents" => ($settings["observer"]) ? true : false,
1646 "navigation" => [
1647 "nextEl" => "#" . $id . " .upk-navigation-next",
1648 "prevEl" => "#" . $id . " .upk-navigation-prev",
1649 ],
1650 "pagination" => [
1651 "el" => "#" . $id . " .upk-pagination",
1652 "clickable" => "true",
1653 ],
1654 "lazy" => [
1655 "loadPrevNext" => "true",
1656 ],
1657 ]))
1658 ]
1659 ]
1660 ]
1661 );
1662
1663 $this->add_render_attribute('swiper', 'class', 'swiper-carousel swiper');
1664
1665 ?>
1666 <div <?php $this->print_render_attribute_string('crystal-slider'); ?>>
1667 <div <?php $this->print_render_attribute_string('swiper'); ?>>
1668 <div class="swiper-wrapper">
1669 <?php
1670 }
1671
1672 public function render_footer() {
1673 $settings = $this->get_settings_for_display();
1674
1675 ?>
1676 </div>
1677 <?php if ($settings['show_navigation']) : ?>
1678 <div class="upk-navigation-wrap">
1679 <div class="upk-navigation-prev">
1680 <i class="upk-icon-arrow-left-<?php echo esc_attr($settings['nav_arrows_icon']); ?>" aria-hidden="true"></i>
1681 </div>
1682 <div class="upk-navigation-next">
1683 <i class="upk-icon-arrow-right-<?php echo esc_attr($settings['nav_arrows_icon']); ?>" aria-hidden="true"></i>
1684 </div>
1685 </div>
1686 <?php endif; ?>
1687
1688 <?php if ($settings['show_pagination']) : ?>
1689 <div class="upk-pagination-wrap">
1690 <div class="upk-pagination"></div>
1691 </div>
1692 <?php endif; ?>
1693 </div>
1694 </div>
1695
1696 <?php
1697 }
1698
1699 public function render_post_grid_item($post_id, $image_size) {
1700 $settings = $this->get_settings_for_display();
1701
1702 $this->add_render_attribute('slider-item', 'class', 'upk-item swiper-slide', true);
1703
1704 ?>
1705
1706 <div <?php $this->print_render_attribute_string('slider-item'); ?>>
1707 <div class="upk-img-wrap">
1708 <?php $this->render_image(get_post_thumbnail_id($post_id), $image_size); ?>
1709 </div>
1710 <div class="upk-content">
1711 <div class="bdt-inner-content" data-swiper-parallax-x="-250" data-swiper-parallax-duration="1000">
1712 <?php $this->render_category(); ?>
1713
1714 <div data-swiper-parallax-x="-250" data-swiper-parallax-duration="1200">
1715 <?php $this->render_title(substr($this->get_name(), 4)); ?>
1716 </div>
1717
1718 <?php if ($settings['show_author'] or $settings['show_date'] or $settings['show_reading_time']) : ?>
1719 <div class="upk-meta upk-flex upk-flex-middle" data-swiper-parallax-x="-300" data-swiper-parallax-duration="1400">
1720 <?php if ($settings['show_author']) : ?>
1721 <?php $this->render_author(); ?>
1722 <?php endif; ?>
1723 <?php if ($settings['show_date']) : ?>
1724 <div data-separator="<?php echo esc_attr($settings['meta_separator']); ?>">
1725 <?php $this->render_date(); ?>
1726 </div>
1727 <?php endif; ?>
1728 <?php if (_is_upk_pro_activated()) :
1729 if ('yes' === $settings['show_reading_time']) : ?>
1730 <div class="upk-reading-time" data-separator="<?php echo esc_attr($settings['meta_separator']); ?>">
1731 <?php echo esc_html( ultimate_post_kit_reading_time( get_the_content(), $settings['avg_reading_speed'], $settings['hide_seconds'] ?? 'no', $settings['hide_minutes'] ?? 'no' ) ); ?>
1732 </div>
1733 <?php endif; ?>
1734 <?php endif; ?>
1735 </div>
1736 <?php endif; ?>
1737
1738 <?php if ($settings['show_readmore'] === 'yes') : ?>
1739 <div class="upk-link-btn">
1740 <a href="<?php echo esc_url(get_permalink()); ?>">
1741 <i class="upk-icon-plus"></i>
1742 </a>
1743 </div>
1744 <?php endif; ?>
1745 </div>
1746 </div>
1747 </div>
1748 <?php
1749 }
1750
1751 public function render() {
1752 $settings = $this->get_settings_for_display();
1753
1754 $this->query_posts($settings['item_limit']['size']);
1755 $wp_query = $this->get_query();
1756
1757 if (!$wp_query->found_posts) {
1758 return;
1759 }
1760
1761 $this->render_header();
1762
1763 while ($wp_query->have_posts()) {
1764 $wp_query->the_post();
1765 $thumbnail_size = $settings['primary_thumbnail_size'];
1766
1767 $this->render_post_grid_item(get_the_ID(), $thumbnail_size);
1768 }
1769
1770 $this->render_footer();
1771
1772 wp_reset_postdata();
1773 }
1774 }
1775