ictionary' => [
'' => '--subtotal-divider-left-width: 0; --subtotal-divider-right-width: 0;',
'solid' => '--subtotal-divider-style: solid;',
'double' => '--subtotal-divider-style: double;',
'dotted' => '--subtotal-divider-style: dotted;',
'dashed' => '--subtotal-divider-style: dashed;',
'groove' => '--subtotal-divider-style: groove;',
],
]
);
$this->add_responsive_control(
'subtotal_divider_width',
[
'label' => esc_html__( 'Width', 'elementor-pro' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
'selectors' => [
'{{WRAPPER}} .widget_shopping_cart_content' => '--subtotal-divider-top-width: {{TOP}}{{UNIT}}; --subtotal-divider-right-width: {{RIGHT}}{{UNIT}}; --subtotal-divider-bottom-width: {{BOTTOM}}{{UNIT}}; --subtotal-divider-left-width: {{LEFT}}{{UNIT}};',
],
]
);
$this->add_control(
'subtotal_divider_color',
[
'label' => esc_html__( 'Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}} .widget_shopping_cart_content' => '--subtotal-divider-color: {{VALUE}}',
],
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_product_tabs_style',
[
'label' => esc_html__( 'Products', 'elementor-pro' ),
'tab' => Controls_Manager::TAB_STYLE,
]
);
$this->add_control(
'heading_product_title_style',
[
'type' => Controls_Manager::HEADING,
'label' => esc_html__( 'Product Title', 'elementor-pro' ),
'separator' => 'before',
]
);
$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => 'product_title_typography',
'global' => [
'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
],
'selector' => '{{WRAPPER}} .elementor-menu-cart__product-name a',
]
);
$this->start_controls_tabs( 'product_title_colors' );
$this->start_controls_tab( 'product_title_normal_colors', [ 'label' => esc_html__( 'Normal', 'elementor-pro' ) ] );
$this->add_control(
'product_title_color',
[
'label' => esc_html__( 'Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}} .elementor-menu-cart__product-name a' => 'color: {{VALUE}};',
],
]
);
$this->end_controls_tab();
$this->start_controls_tab( 'product_title_hover_colors', [ 'label' => esc_html__( 'Hover', 'elementor-pro' ) ] );
$this->add_control(
'product_title_hover_color',
[
'label' => esc_html__( 'Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}} .elementor-menu-cart__product-name a:hover' => 'color: {{VALUE}};',
],
]
);
$this->end_controls_tab();
$this->end_controls_tabs();
$this->add_control(
'heading_product_variations_style',
[
'type' => Controls_Manager::HEADING,
'label' => esc_html__( 'Variations', 'elementor-pro' ),
'separator' => 'before',
]
);
$this->add_control(
'product_variations_color',
[
'label' => esc_html__( 'Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}}' => '--product-variations-color: {{VALUE}};',
],
]
);
$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => 'product_variations_typography',
'selector' => '{{WRAPPER}} .elementor-menu-cart__product .variation',
]
);
$this->add_control(
'heading_product_price_style',
[
'type' => Controls_Manager::HEADING,
'label' => esc_html__( 'Product Price', 'elementor-pro' ),
'separator' => 'before',
]
);
$this->add_control(
'product_price_color',
[
'label' => esc_html__( 'Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}}' => '--product-price-color: {{VALUE}};',
],
]
);
$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => 'product_price_typography',
'global' => [
'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
],
'selector' => '{{WRAPPER}} .elementor-menu-cart__product-price',
]
);
$this->add_control(
'heading_quantity_title_style',
[
'type' => Controls_Manager::HEADING,
'label' => esc_html__( 'Quantity', 'elementor-pro' ),
'separator' => 'before',
]
);
$this->add_control(
'product_quantity_color',
[
'label' => esc_html__( 'Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}} .elementor-menu-cart__product-price .product-quantity' => 'color: {{VALUE}};',
],
]
);
$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => 'product_quantity_typography',
'selector' => '{{WRAPPER}} .elementor-menu-cart__product-price .product-quantity',
]
);
$this->add_control(
'heading_product_divider_style',
[
'type' => Controls_Manager::HEADING,
'label' => esc_html__( 'Divider', 'elementor-pro' ),
'separator' => 'before',
]
);
$this->add_control(
'divider_style',
[
'label' => esc_html__( 'Style', 'elementor-pro' ),
'type' => Controls_Manager::SELECT,
'options' => [
'' => esc_html__( 'None', 'elementor-pro' ),
'solid' => esc_html__( 'Solid', 'elementor-pro' ),
'double' => esc_html__( 'Double', 'elementor-pro' ),
'dotted' => esc_html__( 'Dotted', 'elementor-pro' ),
'dashed' => esc_html__( 'Dashed', 'elementor-pro' ),
'groove' => esc_html__( 'Groove', 'elementor-pro' ),
],
'selectors' => [
'{{WRAPPER}}' => '--divider-style: {{VALUE}}; --subtotal-divider-style: {{VALUE}};',
],
]
);
$this->add_control(
'divider_color',
[
'label' => esc_html__( 'Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}}' => '--divider-color: {{VALUE}}; --subtotal-divider-color: {{VALUE}};',
],
]
);
$this->add_responsive_control(
'divider_width',
[
'label' => esc_html__( 'Weight', 'elementor-pro' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px', 'em', 'rem', 'custom' ],
'range' => [
'px' => [
'min' => 0,
'max' => 10,
],
],
'selectors' => [
'{{WRAPPER}}' => '--divider-width: {{SIZE}}{{UNIT}}; --subtotal-divider-top-width: {{SIZE}}{{UNIT}}; --subtotal-divider-right-width: {{SIZE}}{{UNIT}}; --subtotal-divider-bottom-width: {{SIZE}}{{UNIT}}; --subtotal-divider-left-width: {{SIZE}}{{UNIT}};',
],
]
);
$this->add_responsive_control(
'divider_gap',
[
'label' => esc_html__( 'Spacing', 'elementor-pro' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px', 'em', 'rem', 'custom' ],
'range' => [
'px' => [
'min' => 0,
'max' => 50,
],
],
'selectors' => [
'{{WRAPPER}}' => '--product-divider-gap: {{SIZE}}{{UNIT}};',
],
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_style_buttons',
[
'label' => esc_html__( 'Buttons', 'elementor-pro' ),
'tab' => Controls_Manager::TAB_STYLE,
'conditions' => [
'relation' => 'or',
'terms' => [
[
'name' => 'view_cart_button_show',
'operator' => '!=',
'value' => '',
],
[
'name' => 'checkout_button_show',
'operator' => '!=',
'value' => '',
],
],
],
]
);
$this->add_responsive_control(
'buttons_layout',
[
'label' => esc_html__( 'Layout', 'elementor-pro' ),
'type' => Controls_Manager::SELECT,
'options' => [
'inline' => esc_html__( 'Inline', 'elementor-pro' ),
'stacked' => esc_html__( 'Stacked', 'elementor-pro' ),
],
'default' => 'inline',
'devices' => [ 'desktop', 'tablet', 'mobile' ],
'condition' => [
'view_cart_button_show!' => '',
'checkout_button_show!' => '',
],
'selectors' => [
'{{WRAPPER}}' => '{{VALUE}}',
],
'selectors_dictionary' => [
'inline' => '--cart-footer-layout: 1fr 1fr; --products-max-height-sidecart: calc(100vh - 240px); --products-max-height-minicart: calc(100vh - 385px)',
'stacked' => '--cart-footer-layout: 1fr; --products-max-height-sidecart: calc(100vh - 300px); --products-max-height-minicart: calc(100vh - 450px)',
],
]
);
$this->add_responsive_control(
'space_between_buttons',
[
'label' => esc_html__( 'Space Between', 'elementor-pro' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px', 'em', 'rem', 'custom' ],
'range' => [
'px' => [
'min' => 0,
'max' => 50,
],
],
'selectors' => [
'{{WRAPPER}}' => '--space-between-buttons: {{SIZE}}{{UNIT}};',
],
'condition' => [
'view_cart_button_show!' => '',
'checkout_button_show!' => '',
],
]
);
$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => 'product_buttons_typography',
'global' => [
'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
],
'selector' => '{{WRAPPER}} .elementor-menu-cart__footer-buttons .elementor-button',
]
);
$this->add_control(
'button_border_radius',
[
'label' => esc_html__( 'Border Radius', 'elementor-pro' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
'range' => [
'px' => [
'min' => 0,
'max' => 100,
],
],
'selectors' => [
'{{WRAPPER}}' => '--cart-footer-buttons-border-radius: {{SIZE}}{{UNIT}};',
],
'separator' => 'after',
]
);
$this->add_control(
'heading_view_cart_button_style',
[
'type' => Controls_Manager::HEADING,
'label' => esc_html__( 'View Cart', 'elementor-pro' ),
'condition' => [
'view_cart_button_show!' => '',
],
]
);
$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => 'view_cart_buttons_typography',
'global' => [
'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
],
'selector' => '{{WRAPPER}} .elementor-menu-cart__footer-buttons a.elementor-button--view-cart',
'separator' => 'before',
'condition' => [
'view_cart_button_show!' => '',
],
]
);
$this->start_controls_tabs(
'view_cart_button_text_colors',
[
'condition' => [
'view_cart_button_show!' => '',
],
]
);
$this->start_controls_tab(
'heading_view_cart_button_normal_style',
[
'label' => esc_html__( 'Normal', 'elementor-pro' ),
'condition' => [
'view_cart_button_show!' => '',
],
]
);
$this->add_control(
'view_cart_button_text_color',
[
'label' => esc_html__( 'Text Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}}' => '--view-cart-button-text-color: {{VALUE}};',
],
'condition' => [
'view_cart_button_show!' => '',
],
]
);
$this->add_control(
'view_cart_button_background_color',
[
'label' => esc_html__( 'Background Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}}' => '--view-cart-button-background-color: {{VALUE}};',
],
]
);
$this->end_controls_tab();
$this->start_controls_tab(
'heading_view_cart_button_hover_style',
[
'label' => esc_html__( 'Hover', 'elementor-pro' ),
'condition' => [
'view_cart_button_show!' => '',
],
]
);
$this->add_control(
'view_cart_button_hover_text_color',
[
'label' => esc_html__( 'Text Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}}' => '--view-cart-button-hover-text-color: {{VALUE}};',
],
'condition' => [
'view_cart_button_show!' => '',
],
]
);
$this->add_control(
'view_cart_button_hover_background',
[
'label' => esc_html__( 'Background Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}}' => '--view-cart-button-hover-background-color: {{VALUE}};',
],
]
);
$this->add_control(
'view_cart_button_border_hover_color',
[
'label' => esc_html__( 'Border Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}} .elementor-menu-cart__footer-buttons .elementor-button--view-cart:hover' => 'border-color: {{VALUE}};',
],
'condition' => [
'view_cart_border_border!' => '',
],
]
);
$this->end_controls_tab();
$this->end_controls_tabs();
$this->add_group_control(
Group_Control_Border::get_type(),
[
'name' => 'view_cart_border',
'selector' => '{{WRAPPER}} .elementor-button--view-cart',
'separator' => 'before',
'condition' => [
'view_cart_button_show!' => '',
],
]
);
$this->add_responsive_control(
'view_cart_button_border_radius',
[
'label' => esc_html__( 'Border Radius', 'elementor-pro' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
'selectors' => [
'{{WRAPPER}} .elementor-menu-cart__footer-buttons a.elementor-button--view-cart' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
],
'condition' => [
'view_cart_button_show!' => '',
],
]
);
$this->add_group_control(
Group_Control_Box_Shadow::get_type(),
[
'name' => 'view_cart_button_box_shadow',
'selector' => '{{WRAPPER}} .elementor-button--view-cart',
'condition' => [
'view_cart_button_show!' => '',
],
]
);
$this->add_responsive_control(
'view_cart_button_padding',
[
'label' => esc_html__( 'Padding', 'elementor-pro' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
'selectors' => [
'{{WRAPPER}}' => '--view-cart-button-padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
],
'condition' => [
'view_cart_button_show!' => '',
],
'separator' => 'after',
]
);
$this->add_control(
'heading_checkout_button_style',
[
'type' => Controls_Manager::HEADING,
'label' => esc_html__( 'Checkout', 'elementor-pro' ),
'condition' => [
'checkout_button_show!' => '',
],
]
);
$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => 'cart_checkout_button_typography',
'global' => [
'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
],
'selector' => '{{WRAPPER}} .elementor-menu-cart__footer-buttons a.elementor-button--checkout',
'separator' => 'before',
'condition' => [
'checkout_button_show!' => '',
],
]
);
$this->start_controls_tabs(
'cart_checkout_button_text_colors',
[
'condition' => [
'checkout_button_show!' => '',
],
]
);
$this->start_controls_tab(
'heading_cart_checkout_button_normal_style',
[
'label' => esc_html__( 'Normal', 'elementor-pro' ),
'condition' => [
'checkout_button_show!' => '',
],
]
);
$this->add_control(
'checkout_button_text_color',
[
'label' => esc_html__( 'Text Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}}' => '--checkout-button-text-color: {{VALUE}};',
],
'condition' => [
'checkout_button_show!' => '',
],
]
);
$this->add_control(
'checkout_button_background_color',
[
'label' => esc_html__( 'Background Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}}' => '--checkout-button-background-color: {{VALUE}};',
],
]
);
$this->end_controls_tab();
$this->start_controls_tab(
'heading_cart_checkout_button_hover_style',
[
'label' => esc_html__( 'Hover', 'elementor-pro' ),
'condition' => [
'checkout_button_show!' => '',
],
]
);
$this->add_control(
'checkout_button_hover_text_color',
[
'label' => esc_html__( 'Text Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}}' => '--checkout-button-hover-text-color: {{VALUE}};',
],
'condition' => [
'checkout_button_show!' => '',
],
]
);
$this->add_control(
'checkout_button_hover_background',
[
'label' => esc_html__( 'Background Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}}' => '--checkout-button-hover-background-color: {{VALUE}};',
],
]
);
$this->add_control(
'checkout_button_border_hover_color',
[
'label' => esc_html__( 'Border Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}} .elementor-menu-cart__footer-buttons .elementor-button--checkout:hover' => 'border-color: {{VALUE}};',
],
'condition' => [
'checkout_border_border!' => '',
],
]
);
$this->end_controls_tab();
$this->end_controls_tabs();
$this->add_group_control(
Group_Control_Border::get_type(),
[
'name' => 'checkout_border',
'selector' => '{{WRAPPER}} .elementor-button--checkout',
'separator' => 'before',
'condition' => [
'checkout_button_show!' => '',
],
]
);
$this->add_responsive_control(
'view_checkout_button_border_radius',
[
'label' => esc_html__( 'Border Radius', 'elementor-pro' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
'selectors' => [
'{{WRAPPER}} .elementor-menu-cart__footer-buttons a.elementor-button--checkout' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
],
'condition' => [
'checkout_button_show!' => '',
],
]
);
$this->add_group_control(
Group_Control_Box_Shadow::get_type(),
[
'name' => 'view_checkout_button_box_shadow',
'selector' => '{{WRAPPER}} .elementor-button--checkout',
'condition' => [
'checkout_button_show!' => '',
],
]
);
$this->add_responsive_control(
'view_checkout_button_padding',
[
'label' => esc_html__( 'Padding', 'elementor-pro' ),
'type' => Controls_Manager::DIMENSIONS,
'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
'selectors' => [
'{{WRAPPER}}' => '--checkout-button-padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
],
'condition' => [
'checkout_button_show!' => '',
],
'separator' => 'after',
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_style_messages',
[
'label' => esc_html__( 'Messages', 'elementor-pro' ),
'tab' => Controls_Manager::TAB_STYLE,
]
);
$this->add_group_control(
Group_Control_Typography::get_type(),
[
'name' => 'cart_empty_message_typography',
'global' => [
'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
],
'selector' => '{{WRAPPER}} .woocommerce-mini-cart__empty-message',
]
);
$this->add_control(
'empty_message_color',
[
'label' => esc_html__( 'Empty Cart Message Color', 'elementor-pro' ),
'type' => Controls_Manager::COLOR,
'selectors' => [
'{{WRAPPER}}' => '--empty-message-color: {{VALUE}};',
],
]
);
$this->add_responsive_control(
'empty_message_alignment',
[
'label' => esc_html__( 'Alignment', 'elementor-pro' ),
'type' => Controls_Manager::CHOOSE,
'options' => [
'left' => [
'title' => esc_html__( 'Left', 'elementor-pro' ),
'icon' => 'eicon-text-align-left',
],
'center' => [
'title' => esc_html__( 'Center', 'elementor-pro' ),
'icon' => 'eicon-text-align-center',
],
'right' => [
'title' => esc_html__( 'Right', 'elementor-pro' ),
'icon' => 'eicon-text-align-right',
],
'justify' => [
'title' => esc_html__( 'Justified', 'elementor-pro' ),
'icon' => 'eicon-text-align-justify',
],
],
'selectors' => [
'{{WRAPPER}}' => '--empty-message-alignment: {{VALUE}};',
],
]
);
$this->end_controls_section();
}
/**
* Check if user did not explicitly disabled the use of our mini-cart template and set the option accordingly.
* The option value is later used by Module::woocommerce_locate_template().
*/
private function maybe_use_mini_cart_template() {
$option_value = get_option( 'elementor_' . Module::OPTION_NAME_USE_MINI_CART, '' );
if ( empty( $option_value ) || 'initial' === $option_value ) {
update_option( 'elementor_' . Module::OPTION_NAME_USE_MINI_CART, 'yes' );
}
}
protected function render() {
$settings = $this->get_settings_for_display();
if ( ! wp_script_is( 'wc-cart-fragments' ) ) {
wp_enqueue_script( 'wc-cart-fragments' );
}
$this->maybe_use_mini_cart_template();
Module::render_menu_cart( $settings );
}
public function render_plain_content() {}
public function get_group_name() {
return 'woocommerce';
}
}