PluginProbe
Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets / 4.1.15
Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets v4.1.15
4.5.6 4.5.5 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 All 148 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.1.15, at modules/crystal-slider/widgets/crystal-slider.php

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