=> [
'eael_dynamic_template_Layout!' => 'default',
],
]
);
$this->add_control(
'eael_timeline_img_border_radius',
[
'label' => esc_html__('Border Radius', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => ['px', '%'],
'selectors' => [
'{{WRAPPER}} .eael-timeline-post-image' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
],
'condition' => [
'eael_dynamic_template_Layout!' => 'default',
],
]
);
$this->end_controls_section();
$this->start_controls_section(
'eael_section_typography',
[
'label' => __('Typography', 'essential-addons-for-elementor-lite'),
'tab' => Controls_Manager::TAB_STYLE,
]
);
$this->add_control(
'eael_timeline_title_style',
[
'label' => __('Title Style', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'eael_timeline_title_color',
[
'label' => __('Title Color', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::COLOR,
'default' => '#fff',
'selectors' => [
'{{WRAPPER}} .eael-timeline-post-title .eael-timeline-post-title-text' => 'color: {{VALUE}};',
'{{WRAPPER}} .timeline-layout-card .eael-timeline-post-title .eael-timeline-post-title-text-card' => 'color: {{VALUE}};',
],
]
);
$this->add_responsive_control(
'eael_timeline_title_alignment',
[
'label' => __('Title Alignment', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::CHOOSE,
'options' => [
'left' => [
'title' => __('Left', 'essential-addons-for-elementor-lite'),
'icon' => 'eicon-text-align-left',
],
'center' => [
'title' => __('Center', 'essential-addons-for-elementor-lite'),
'icon' => 'eicon-text-align-center',
],
'right' => [
'title' => __('Right', 'essential-addons-for-elementor-lite'),
'icon' => 'eicon-text-align-right',
],
],
'selectors' => [
'{{WRAPPER}} .eael-timeline-post-title .eael-timeline-post-title-text' => 'text-align: {{VALUE}};',
],
]
);
$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => 'eael_timeline_title_typography',
'label' => __('Title Typography', 'essential-addons-for-elementor-lite'),
'global' => [
'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
],
'selector' => '{{WRAPPER}} .eael-timeline-post-title .eael-timeline-post-title-text',
]
);
$this->add_control(
'eael_timeline_excerpt_style',
[
'label' => __('Excerpt Style', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'eael_timeline_excerpt_color',
[
'label' => __('Excerpt Color', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::COLOR,
'default' => '#ffffff',
'selectors' => [
'{{WRAPPER}} .eael-timeline-post-excerpt p' => 'color: {{VALUE}};',
],
]
);
$this->add_responsive_control(
'eael_timeline_excerpt_alignment',
[
'label' => __('Excerpt Alignment', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::CHOOSE,
'options' => [
'left' => [
'title' => __('Left', 'essential-addons-for-elementor-lite'),
'icon' => 'eicon-text-align-left',
],
'center' => [
'title' => __('Center', 'essential-addons-for-elementor-lite'),
'icon' => 'eicon-text-align-center',
],
'right' => [
'title' => __('Right', 'essential-addons-for-elementor-lite'),
'icon' => 'eicon-text-align-right',
],
'justify' => [
'title' => __('Justified', 'essential-addons-for-elementor-lite'),
'icon' => 'eicon-text-align-justify',
],
],
'selectors' => [
'{{WRAPPER}} .eael-timeline-post-excerpt p' => 'text-align: {{VALUE}};',
],
]
);
$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => 'eael_timeline_excerpt_typography',
'label' => __('Excerpt Typography', 'essential-addons-for-elementor-lite'),
'global' => [
'default' => Global_Typography::TYPOGRAPHY_TEXT,
],
'selector' => '{{WRAPPER}} .eael-timeline-post-excerpt p',
]
);
$this->end_controls_section();
// Start Arrow Styling
$this->start_controls_section(
'eael_section_arrow',
[
'label' => __('Arrow', 'essential-addons-for-elementor-lite'),
'tab' => Controls_Manager::TAB_STYLE,
]
);
$this->add_control(
'eael_timeline_border_color',
[
'label' => __('Border & Arrow Color', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::COLOR,
'default' => '#e5eaed',
'selectors' => [
'{{WRAPPER}} .eael-timeline-post-inner' => 'border-color: {{VALUE}};',
'{{WRAPPER}} .eael-timeline-post-inner::after' => 'border-left-color: {{VALUE}};',
'{{WRAPPER}} .eael-timeline-post:nth-child(2n) .eael-timeline-post-inner::after' => 'border-right-color: {{VALUE}};',
],
'condition' => [
'eael_dynamic_template_Layout' => 'default',
],
]
);
$this->add_control(
'eael_timeline_arrow_color',
[
'label' => __('Arrow Color', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::COLOR,
'default' => '#3DB1C0',
'selectors' => [
'{{WRAPPER}} .eael-timeline-post-inner' => 'border-color: {{VALUE}};',
'{{WRAPPER}} .eael-timeline-post-inner::after' => 'border-left-color: {{VALUE}}; border-right-color: {{VALUE}}',
// '{{WRAPPER}} .eael-timeline-post:nth-child(2n) .eael-timeline-post-inner::after' => 'border-right-color: {{VALUE}};',
],
'condition' => [
'eael_dynamic_template_Layout!' => 'default',
],
]
);
$this->add_responsive_control(
'eael_timeline_arrow_size',
[
'label' => esc_html__('Size', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::SLIDER,
'range' => [
'px' => [
'max' => 20,
],
],
'selectors' => [
'{{WRAPPER}} .eael-post-timeline.timeline-layout-card .eael-timeline-post-inner:after' => 'border-width: {{SIZE}}px; right: -{{SIZE}}px; left: -{{SIZE}}px',
'{{WRAPPER}} .eael-post-timeline.timeline-layout-card .eael-timeline-post:nth-child(2n) .eael-timeline-post-inner:after' => 'left: -{{SIZE}}px;',
],
'condition' => [
'eael_dynamic_template_Layout!' => 'default',
],
]
);
$this->add_control(
'eael_timeline_arrow_alignment',
[
'label' => __('Alignment', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::CHOOSE,
'options' => [
'top' => [
'title' => __( 'Top', 'essential-addons-for-elementor-lite' ),
'icon' => 'eicon-v-align-top',
],
'middle' => [
'title' => __( 'Middle', 'essential-addons-for-elementor-lite' ),
'icon' => 'eicon-v-align-middle',
],
'bottom' => [
'title' => __( 'Bottom', 'essential-addons-for-elementor-lite' ),
'icon' => 'eicon-v-align-bottom',
],
],
'default' => 'top',
'condition' => [
'eael_dynamic_template_Layout!' => 'default',
],
]
);
$this->end_controls_section();
// Start Time Styling
$this->start_controls_section(
'eael_section_time',
[
'label' => __('Time', 'essential-addons-for-elementor-lite'),
'tab' => Controls_Manager::TAB_STYLE,
]
);
$this->add_control(
'eael_timeline_date_background_color',
[
'label' => __('Date Background Color', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::COLOR,
'default' => 'rgba(0, 0, 0, 0.7)',
'selectors' => [
'{{WRAPPER}} .eael-timeline-post time' => 'background-color: {{VALUE}};',
'{{WRAPPER}} .eael-timeline-post time::before' => 'border-bottom-color: {{VALUE}};',
],
]
);
$this->add_control(
'eael_timeline_date_color',
[
'label' => __('Date Text Color', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::COLOR,
'default' => '#fff',
'selectors' => [
'{{WRAPPER}} .eael-timeline-post time' => 'color: {{VALUE}};',
],
]
);
$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => 'eael_timeline_time_typography',
'label' => __('Typography', 'essential-addons-for-elementor-lite'),
'selector' => '{{WRAPPER}} time',
]
);
$this->add_control(
'eael_timeline_time_padding',
[
'label' => esc_html__('Padding', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => ['px', '%'],
'selectors' => [
'{{WRAPPER}} time' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
],
]
);
$this->add_control(
'eael_timeline_time_border_radius',
[
'label' => esc_html__('Border Radius', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => ['px', '%'],
'selectors' => [
'{{WRAPPER}} time' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
],
]
);
$this->end_controls_section();
$this->start_controls_section(
'eael_section_line',
[
'label' => __('Line & Bullet', 'essential-addons-for-elementor-lite'),
'tab' => Controls_Manager::TAB_STYLE,
]
);
$this->add_control(
'eael_section_post_timeline_line_heading',
[
'label' => __('Line', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'eael_section_post_timeline_line_size',
[
'label' => __('Line Width', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::SLIDER,
'size_units' => ['px', '%'],
'range' => [
'px' => [
'min' => 0,
'max' => 20,
'step' => 1,
],
],
'selectors' => [
'{{WRAPPER}} .eael-timeline-post:after' => 'width: {{SIZE}}{{UNIT}};',
],
]
);
$this->add_control(
'eael_section_post_timeline_line_position_from_right',
[
'label' => __('Line Position From Right', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::SLIDER,
'size_units' => ['px'],
'range' => [
'px' => [
'min' => 0,
'max' => 20,
'step' => 1,
],
],
'selectors' => [
'{{WRAPPER}} .eael-timeline-post:after' => 'right: -{{SIZE}}{{UNIT}};',
],
'condition'=> [
'eael_dynamic_template_Layout!' => 'card',
]
]
);
$this->add_control(
'eael_section_post_timeline_bullet_size',
[
'label' => __('Bullet Size', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::SLIDER,
'size_units' => ['px', '%'],
'range' => [
'px' => [
'min' => 0,
'max' => 100,
'step' => 1,
],
],
'selectors' => [
'{{WRAPPER}} .eael-timeline-bullet' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
],
]
);
$this->add_control(
'eael_section_post_timeline_bullet_position_from_left',
[
'label' => __('Left-sided Bullet Positon', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::SLIDER,
'size_units' => ['px'],
'range' => [
'px' => [
'min' => 0,
'max' => 50,
'step' => 1,
],
],
'selectors' => [
'{{WRAPPER}} .eael-timeline-bullet' => 'right: -{{SIZE}}{{UNIT}};',
],
'condition'=> [
'eael_dynamic_template_Layout!' => 'card',
]
]
);
$this->add_control(
'eael_section_post_timeline_bullet_position_from_right',
[
'label' => __('Right-sided Bullet Position', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::SLIDER,
'size_units' => ['px'],
'range' => [
'px' => [
'min' => 0,
'max' => 50,
'step' => 1,
],
],
'selectors' => [
'{{WRAPPER}} .eael-timeline-post:nth-child(2n) .eael-timeline-bullet' => 'left: -{{SIZE}}{{UNIT}};',
],
'condition'=> [
'eael_dynamic_template_Layout!' => 'card',
]
]
);
$this->add_control(
'eael_timeline_bullet_color',
[
'label' => __('Timeline Bullet Color', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::COLOR,
'default' => '#9fa9af',
'selectors' => [
'{{WRAPPER}} .eael-timeline-bullet' => 'background-color: {{VALUE}};',
],
]
);
$this->add_control(
'eael_timeline_bullet_border_color',
[
'label' => __('Timeline Bullet Border Color', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::COLOR,
'default' => '#fff',
'selectors' => [
'{{WRAPPER}} .eael-timeline-bullet' => 'border-color: {{VALUE}};',
],
]
);
$this->add_control(
'eael_timeline_vertical_line_color',
[
'label' => __('Timeline Vertical Line Color', 'essential-addons-for-elementor-lite'),
'type' => Controls_Manager::COLOR,
'default' => 'rgba(83, 85, 86, .2)',
'selectors' => [
'{{WRAPPER}} .eael-timeline-post:after' => 'background-color: {{VALUE}};',
],
]
);
$this->end_controls_section();
do_action('eael/controls/load_more_button_style', $this);
}
protected function render()
{
$settings = $this->get_settings_for_display();
$settings = HelperClass::fix_old_query($settings);
$args = HelperClass::get_query_args($settings);
$args = HelperClass::get_dynamic_args($settings, $args);
$settings ['expanison_indicator'] = $settings['excerpt_expanison_indicator'];
$this->add_render_attribute(
'eael_post_timeline_wrapper',
[
'id' => "eael-post-timeline-{$this->get_id()}",
'class' => ["eael-post-timeline", "timeline-layout-{$settings['eael_dynamic_template_Layout']}", "eael-post-timeline-arrow-{$settings['eael_timeline_arrow_alignment']}"],
]
);
$this->add_render_attribute(
'eael_post_timeline',
[
'class' => ['eael-post-timeline', 'eael-post-appender', "eael-post-appender-{$this->get_id()}"],
]
);
echo '
get_render_attribute_string('eael_post_timeline_wrapper') . '>
get_render_attribute_string('eael_post_timeline') . '>';
$template = $this->get_template($this->get_settings('eael_dynamic_template_Layout'));
$settings['loadable_file_name'] = $this->get_filename_only($template);
$dir_name = $this->get_temp_dir_name($settings['loadable_file_name']);
$found_posts = 0;
if(file_exists($template)){
$query = new \WP_Query($args);
if ($query->have_posts()) {
$found_posts = $query->found_posts;
$ppp = empty( $args['posts_per_page'] ) ? get_option( 'posts_per_page' ) : $args['posts_per_page'];
$max_page = ceil( $found_posts / absint( $ppp ) );
$args['max_page'] = $max_page;
while ($query->have_posts()) {
$query->the_post();
include($template);
}
} else {
_e('
No posts found!
', 'essential-addons-for-elementor-lite');
}
wp_reset_postdata();
} else {
_e('
No layout found!
', 'essential-addons-for-elementor-lite');
}
echo '
';
if ( $found_posts > $args['posts_per_page'] ) {
$this->print_load_more_button( $settings, $args, $dir_name );
}
}
}
