# darkify/1.5.1/src/Admin/elementor/widgets/elementor-widget.php

Darkify – Dark Mode & Night Mode for Website & Admin (Dark Theme Included), version 1.5.1. 331 lines.

- Page: https://pluginprobe.com/plugins/darkify/1.5.1/code/src/Admin/elementor/widgets/elementor-widget.php
- Raw: https://pluginprobe.com/plugins/darkify/1.5.1/raw/src/Admin/elementor/widgets/elementor-widget.php
- Modified: 2026-05-04T09:54:44+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/darkify/1.5.1/code/src/Admin/elementor/widgets/elementor-widget.php#L10-L20`.

```php
<?php
// Exit if accessed directly.
if (! defined('ABSPATH')) {
    exit;
}

/**
 * Elementor Darkify widget.
 *
 * This class handles the creation of a custom Elementor widget 
 * for displaying Switcher in the Darkify Pro plugin.
 *
 * @since 1.0
 */
class Elementor_Darkify extends \Elementor\Widget_Base
{

    /**
     * Get widget name.
     *
     * Returns the widget name for use in Elementor.
     *
     * @since 1.0
     * @return string Widget name.
     */
    public function get_name()
    {
        return 'darkify';
    }

    /**
     * Get widget title.
     *
     * Returns the display title of the widget in Elementor.
     *
     * @since 1.0
     * @return string Widget title.
     */
    public function get_title()
    {
        return esc_html__('Dark Mode Switcher', 'darkify');
    }

    /**
     * Get widget icon.
     *
     * Returns the icon for the widget that will appear in the Elementor editor.
     *
     * @since 1.0
     * @return string Widget icon class.
     */
    public function get_icon()
    {
        return 'eicon-adjust';
    }

    public function get_style_depends(): array
    {
        return ['theme-around', 'theme-classic', 'theme-dark-inner', 'theme-dark-side', 'theme-eclipse', 'theme-expand', 'theme-half-sun', 'theme-horizon', 'theme-inner-moon', 'theme-lightbulb', 'theme-simple', 'theme-orbit', 'theme-duality', 'theme-dual', 'theme-shift', 'theme-within'];
    }

    /**
     * Get widget categories.
     *
     * Defines the category or categories the widget belongs to in Elementor.
     *
     * @since 1.0
     * @return array Widget categories.
     */
    public function get_categories()
    {
        return ['basic'];
    }

    protected function _register_controls()
    {
        // ----------------------------------------  Darkify Settings ------------------------------
        $this->start_controls_section(
            'darkify__settings',
            array(
                'label' => esc_html__('Darkify', 'darkify'),
                'tab'   => \Elementor\Controls_Manager::TAB_CONTENT,
            )
        );
        // Switch style.
        $this->add_control(
            'darkify_switch_heading',
            [
                'label' => __('Switch Style', 'darkify'),
                'type'  => \Elementor\Controls_Manager::HEADING,
            ]
        );
        $this->add_control(
            'style',
            [
                'type'        => 'darkify_switch',
                'options' => array_merge(['classic', 'expand', 'inner-moon', 'within', 'orbit', 'around', 'dark-side', 'horizon', 'eclipse', 'lightbulb', 'dark-inner', 'half-sun', 'simple', 'duality', 'dual', 'shift']),
                'description' => __('Select the Dark Mode Switch Style', 'darkify'),
                'default'     => 1,
                'id'          => 'darkify-switch',
                'classes' => 'darkify-switch-style-elementor',
                'assets_url' => DARKIFY_DIR_URL . '/src/Admin/Framework/assets/images/',
            ]
        );
        $this->add_control(
            'size',
            [
                'label' => __('Switch Size', 'darkify'),
                'type' => \Elementor\Controls_Manager::SELECT,
                'options' => [
                    '0.6' => __('XS', 'darkify'),
                    '0.8' => __('S', 'darkify'),
                    '1.0' => __('M', 'darkify'),
                    '1.2' => __('L', 'darkify'),
                    '1.4' => __('XL', 'darkify'),
                    '1.6' => __('XXL', 'darkify'),
                    'custom' => __('Custom', 'darkify'),
                ],
                'default'     => '1.0',
            ]
        );
        $this->add_control(
            'custom_size',
            [
                'label' => __('Custom Switch Size', 'darkify'),
                'type' => \Elementor\Controls_Manager::NUMBER,
                'min' => 40,
                'max' => 5000,
                'step' => 10,
                'default'     => 100,
                'condition'   => array(
                    'size' => 'custom',
                ),
            ]
        );
        // ----------------------
        // 1. SWITCH BACKGROUND
        // ----------------------
        $this->add_control(
            'switch_bg_heading',
            [
                'label' => __('Switch Background', 'darkify'),
                'type'  => \Elementor\Controls_Manager::HEADING,
            ]
        );
        $this->add_control(
            'switch_bg_light',
            [
                'label' => __('Light Mode', 'darkify'),
                'type'  => \Elementor\Controls_Manager::COLOR,
                'default'   => '#121116',
                'selectors'  => [
                    '{{WRAPPER}} .darkify_switch_style, {{WRAPPER}} .switch-shift .theme-toggle .toggle-thumb'   => 'background-color: {{VALUE}};',
                ]
            ]
        );
        $this->add_control(
            'switch_bg_dark',
            [
                'label' => __('Dark Mode', 'darkify'),
                'type'  => \Elementor\Controls_Manager::COLOR,
                'default'   => '#ffffff',
                'selectors'  => [
                    '.darkify_dark_mode_enabled {{WRAPPER}} .darkify_switch_style, .darkify_dark_mode_enabled {{WRAPPER}} .switch-shift .theme-toggle .toggle-thumb'   => 'background-color: {{VALUE}};',
                ],
            ]
        );
        // ----------------------
        // 2. SWITCH ICON COLOR
        // ----------------------
        $this->add_control(
            'switch_icon_heading',
            [
                'label' => __('Switch Icon Color', 'darkify'),
                'type'  => \Elementor\Controls_Manager::HEADING,
                'condition'   => array(
                    'style!' => ['duality', 'shift'],
                ),
            ]
        );
        $this->add_control(
            'switch_icon_light',
            [
                'label' => __('Light Mode', 'darkify'),
                'type'  => \Elementor\Controls_Manager::COLOR,
                'default'   => '#ffffff',
                'condition'   => array(
                    'style!' => ['duality', 'shift', 'dual'],
                ),
                'selectors'  => [
                    '{{WRAPPER}} .darkify_switch_style svg'   => 'color: {{VALUE}}; stroke: {{VALUE}};',
                    '{{WRAPPER}} .darkify_switch_style.switch-orbit .theme-toggle svg'   => 'fill: {{VALUE}};',
                ],
            ]
        );
        $this->add_control(
            'switch_icon_dark',
            [
                'label' => __('Dark Mode', 'darkify'),
                'type'  => \Elementor\Controls_Manager::COLOR,
                'default'   => '#121116',
                'condition'   => array(
                    'style!' => ['duality', 'shift', 'dual'],
                ),
                'selectors'  => [
                    '.darkify_dark_mode_enabled {{WRAPPER}} .darkify_switch_style svg'   => 'color: {{VALUE}}; stroke: {{VALUE}};',
                    '{{WRAPPER}} .darkify_switch_style.switch-orbit .theme-toggle .toggle-sun svg'   => 'fill: {{VALUE}};',
                ],
            ]
        );
        // ----------------------
        // 4. SWITCH BORDER
        // ----------------------
        $this->add_control(
            'switch_border_heading',
            [
                'label' => __('Switch Border', 'darkify'),
                'type'  => \Elementor\Controls_Manager::HEADING,
            ]
        );
        // Border Width
        $this->add_control(
            'switch_border_width',
            [
                'label' => __('Width', 'darkify'),
                'type'  => \Elementor\Controls_Manager::SLIDER,
                'size_units' => ['px'],
                'range' => [
                    'px' => [
                        'min' => 0,
                        'max' => 10,
                    ],
                ],
                'default' => [
                    'size' => 0,
                ],
                'selectors' => [
                    '{{WRAPPER}} .darkify_switch_style' => 'border-width: {{SIZE}}{{UNIT}};',
                ],
            ]
        );
        $this->add_control(
            'switch_border_light',
            [
                'label' => __('Light Color', 'darkify'),
                'type' => \Elementor\Controls_Manager::COLOR,
                'default'   => '#121116',
                'selectors' => [
                    '{{WRAPPER}} .darkify_switch_style' => 'border-color: {{VALUE}};',
                ],
            ]
        );
        $this->add_control(
            'switch_border_dark',
            [
                'label' => __('Dark Color', 'darkify'),
                'type' => \Elementor\Controls_Manager::COLOR,
                'default'   => '#ffffff',
                'selectors' => [
                    '.darkify_dark_mode_enabled {{WRAPPER}} .darkify_switch_style' => 'border-color: {{VALUE}};',
                ],
            ]
        );
        // Border Radius
        $this->add_control(
            'switch_border_radius',
            [
                'label' => __('Radius', 'darkify'),
                'type'  => \Elementor\Controls_Manager::SLIDER,
                'size_units' => ['px'],
                'range' => [
                    'px' => [
                        'min' => 0,
                        'max' => 100,
                    ],
                ],
                'default' => [
                    'size' => 7,
                ],
                'selectors' => [
                    '{{WRAPPER}} .darkify_switch_style' => 'border-radius: {{SIZE}}{{UNIT}};',
                ],
            ]
        );
        $this->add_responsive_control(
            'align',
            [
                'label'     => __('Alignment', 'darkify'),
                'type'      => \Elementor\Controls_Manager::CHOOSE,
                'options'   => [
                    'left'   => [
                        'title' => __('Left', 'darkify'),
                        'icon'  => 'dashicons dashicons-editor-alignleft',
                    ],
                    'center' => [
                        'title' => __('Center', 'darkify'),
                        'icon'  => 'dashicons dashicons-editor-aligncenter',
                    ],
                    'right'  => [
                        'title' => __('Right', 'darkify'),
                        'icon'  => 'dashicons dashicons-editor-alignright',
                    ],
                ],
                'toggle'    => true,
                'default'   => 'left',
                'selectors' => [
                    '{{WRAPPER}}' => 'display: flex; justify-content: {{VALUE}};',
                ],
            ]
        );
        // End section
        $this->end_controls_section();
    }

    protected function render()
    {
        $settings = $this->get_settings_for_display();

        $style = isset($settings['style']) ? $settings['style'] : 1;
        $size = isset($settings['size']) ? $settings['size'] : 1;
        $custom_size = isset($settings['custom_size']) ? $settings['custom_size'] : 100;
        if ('custom' === $size) {
            $switcher_size = $custom_size;
        } else {
            $switcher_size = $size * 100;
        }

        echo do_shortcode(wp_sprintf('[darkify switch="%s" icon_size="40px" light_mode_bg="#121116" dark_mode_bg="#ffffff" light_mode_color="#ffffff" dark_mode_color="#121116" border="0px" border_light_color="#121119" border_dark_color="#ffffff" border_radius="7px" switch_size="%s"]', esc_attr($style), esc_attr($switcher_size)));
    }
}

```