# darkify/1.4.0/src/Frontend/Templates/views/switch.php

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

- Page: https://pluginprobe.com/plugins/darkify/1.4.0/code/src/Frontend/Templates/views/switch.php
- Raw: https://pluginprobe.com/plugins/darkify/1.4.0/raw/src/Frontend/Templates/views/switch.php
- Modified: 2025-05-15T13:43:26+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.4.0/code/src/Frontend/Templates/views/switch.php#L10-L20`.

```php
<?php
if (!defined('ABSPATH')) {
    die;
} // Cannot access directly.

$hide_on_mobile = isset($options["hide_on_mobile"]) ? $options["hide_on_mobile"] : '';
$hide_dark_mode_on_mobile = isset($hide_on_mobile['hide_dark_mode_on_mobile']) ? $hide_on_mobile['hide_dark_mode_on_mobile'] : '';
$tooltip_on_floating_switch = isset($options["tooltip_on_floating_switch"]) ? $options["tooltip_on_floating_switch"] : '';
$tooltip_color = isset($tooltip_on_floating_switch['tooltip_color']) ? $tooltip_on_floating_switch['tooltip_color'] : '';

$switcher_button_position = isset($options["switcher_button_position"]) ? $options["switcher_button_position"] : '';

$dark_mode_switch_position = isset($switcher_button_position["dark_mode_switch_position"]) ? $switcher_button_position["dark_mode_switch_position"] : "";
$switch_position_top_right = isset($switcher_button_position["switch_position_top_right"]) ? $switcher_button_position["switch_position_top_right"] : "";
$switch_position_top_right_top = isset($switch_position_top_right["top"]) ? $switch_position_top_right["top"] : "40";
$switch_position_top_right_right = isset($switch_position_top_right["right"]) ? $switch_position_top_right["right"] : "40";
$switch_position_top_left = isset($switcher_button_position["switch_position_top_left"]) ? $switcher_button_position["switch_position_top_left"] : "";
$switch_position_top_left_top = isset($switch_position_top_left["top"]) ? $switch_position_top_left["top"] : "40";
$switch_position_top_left_left = isset($switch_position_top_left["left"]) ? $switch_position_top_left["left"] : "40";
$switch_position_bottom_right = isset($switcher_button_position["switch_position_bottom_right"]) ? $switcher_button_position["switch_position_bottom_right"] : "";
$switch_position_bottom_right_bottom = isset($switch_position_bottom_right["bottom"]) ? $switch_position_bottom_right["bottom"] : "40";
$switch_position_bottom_right_right = isset($switch_position_bottom_right["right"]) ? $switch_position_bottom_right["right"] : "40";
$switch_position_bottom_left = isset($switcher_button_position["switch_position_bottom_left"]) ? $switcher_button_position["switch_position_bottom_left"] : "";
$switch_position_bottom_left_bottom = isset($switch_position_bottom_left["bottom"]) ? $switch_position_bottom_left["bottom"] : "40";
$switch_position_bottom_left_left = isset($switch_position_bottom_left["left"]) ? $switch_position_bottom_left["left"] : "40";
$different_switch_in_mobile = isset($options["different_switch_in_mobile"]) ? $options["different_switch_in_mobile"] : '';
$switch_position_different_in_mobile = isset($different_switch_in_mobile["switch_position_different_in_mobile"]) ? $different_switch_in_mobile["switch_position_different_in_mobile"] : "";
$switch_position_top_right_in_mobile = isset($different_switch_in_mobile["switch_position_top_right_in_mobile"]) ? $different_switch_in_mobile["switch_position_top_right_in_mobile"] : "";
$switch_position_top_right_top_in_mobile = isset($switch_position_top_right_in_mobile["top"]) ? $switch_position_top_right_in_mobile["top"] : "40";
$switch_position_top_right_right_in_mobile = isset($switch_position_top_right_in_mobile["right"]) ? $switch_position_top_right_in_mobile["right"] : "40";
$switch_position_top_left_in_mobile = isset($different_switch_in_mobile["switch_position_top_left_in_mobile"]) ? $different_switch_in_mobile["switch_position_top_left_in_mobile"] : "";
$switch_position_top_left_top_in_mobile = isset($switch_position_top_left_in_mobile["top"]) ? $switch_position_top_left_in_mobile["top"] : "40";
$switch_position_top_left_left_in_mobile = isset($switch_position_top_left_in_mobile["left"]) ? $switch_position_top_left_in_mobile["left"] : "40";
$switch_position_bottom_right_in_mobile = isset($different_switch_in_mobile["switch_position_bottom_right_in_mobile"]) ? $different_switch_in_mobile["switch_position_bottom_right_in_mobile"] : "";
$switch_position_bottom_right_bottom_in_mobile = isset($switch_position_bottom_right_in_mobile["bottom"]) ? $switch_position_bottom_right_in_mobile["bottom"] : "40";
$switch_position_bottom_right_right_in_mobile = isset($switch_position_bottom_right_in_mobile["right"]) ? $switch_position_bottom_right_in_mobile["right"] : "40";
$switch_position_bottom_left_in_mobile = isset($different_switch_in_mobile["switch_position_bottom_left_in_mobile"]) ? $different_switch_in_mobile["switch_position_bottom_left_in_mobile"] : "";
$switch_position_bottom_left_bottom_in_mobile = isset($switch_position_bottom_left_in_mobile["bottom"]) ? $switch_position_bottom_left_in_mobile["bottom"] : "40";
$switch_position_bottom_left_left_in_mobile = isset($switch_position_bottom_left_in_mobile["left"]) ? $switch_position_bottom_left_in_mobile["left"] : "40";
$floating_switch_width = isset($tooltip_on_floating_switch["floating_switch_width"]) ? $tooltip_on_floating_switch["floating_switch_width"] : "";
?>
<style type="text/css" class="darkify_inline_css">
    #darkify_switch_<?php echo esc_attr($this->unique_id); ?> {
        <?php foreach ($this->utils->generateSwitchStyles($options) as $key => $value) { ?><?php echo esc_attr($key); ?>: <?php echo esc_attr($value); ?>;
        <?php } ?>
    }

    #darkify_switch_<?php echo esc_attr($this->unique_id); ?> {
        --darkify_switch_position_from_top_right_top: <?php echo esc_attr($switch_position_top_right_top); ?>px;
        --darkify_switch_position_from_top_right_right: <?php echo esc_attr($switch_position_top_right_right); ?>px;
        --darkify_switch_position_from_bottom_right_bottom: <?php echo esc_attr($switch_position_bottom_right_bottom); ?>px;
        --darkify_switch_position_from_bottom_right_right: <?php echo esc_attr($switch_position_bottom_right_right); ?>px;
        --darkify_switch_position_from_top_left_top: <?php echo esc_attr($switch_position_top_left_top); ?>px;
        --darkify_switch_position_from_top_left_left: <?php echo esc_attr($switch_position_top_left_left); ?>px;
        --darkify_switch_position_from_bottom_left_bottom: <?php echo esc_attr($switch_position_bottom_left_bottom); ?>px;
        --darkify_switch_position_from_bottom_left_left: <?php echo esc_attr($switch_position_bottom_left_left); ?>px;
        <?php if ($switch_position_different_in_mobile) { ?>
        --darkify_switch_position_from_top_right_top_in_mobile: <?php echo esc_attr($switch_position_top_right_right_in_mobile); ?>px;
        --darkify_switch_position_from_top_right_right_in_mobile: <?php echo esc_attr($switch_position_top_right_right_in_mobile); ?>px;
        --darkify_switch_position_from_bottom_right_bottom_in_mobile: <?php echo esc_attr($switch_position_bottom_right_bottom_in_mobile); ?>px;
        --darkify_switch_position_from_bottom_right_right_in_mobile: <?php echo esc_attr($switch_position_bottom_right_right_in_mobile); ?>px;
        --darkify_switch_position_from_top_left_top_in_mobile: <?php echo esc_attr($switch_position_top_left_top_in_mobile); ?>px;
        --darkify_switch_position_from_top_left_left_in_mobile: <?php echo esc_attr($switch_position_top_left_top_in_mobile); ?>px;
        --darkify_switch_position_from_bottom_left_bottom_in_mobile: <?php echo esc_attr($switch_position_bottom_left_bottom_in_mobile); ?>px;
        --darkify_switch_position_from_bottom_left_left_in_mobile: <?php echo esc_attr($switch_position_bottom_left_left_in_mobile); ?>px;
         <?php } if ($floating_switch_width) { ?>--darkify_switch_tooltip_bg_color: <?php echo esc_attr($tooltip_color["tooltip_background_color"]); ?>;
        --darkify_switch_tooltip_text_color: <?php echo esc_attr($tooltip_color["tooltip_text_color"]); ?>;
        <?php } ?>
    }
</style>

<?php
$hide_dark_mode_on_mobile_screen = "";

if ($hide_dark_mode_on_mobile) {
    if ($hide_on_mobile["type_of_hide_by"] == "screen_size" || $hide_on_mobile["type_of_hide_by"] == "both") {
        $hide_dark_mode_on_mobile_screen = "darkify_hide_on_mobile";
    }
}

if ($dark_mode_switch_position == "") {
    $floating_switch_position = "darkify_bottom_right";
} else {
    $floating_switch_position = "darkify_" . $dark_mode_switch_position;
}
if ($switch_position_different_in_mobile) {
    $floating_switch_position .= " darkify_" . $different_switch_in_mobile["switch_position_in_mobile"] . "_in_mobile";
}

$tooltip_classes = "";
if ($floating_switch_width) {
    $tooltip_classes = "darkify_tooltip darkify_tooltip_" . $tooltip_on_floating_switch["tooltip_position"];
}

$darkify_absolute_position = isset($options["enable_absolute_position"]) ? $options["enable_absolute_position"] : '';
$position_class = '';
if ($darkify_absolute_position) {
    $position_class = ' darkify_absolute_position';
}
$dark_mode_switcher = isset($options["enable_dark_switcher"]) ? $options["enable_dark_switcher"] : 'classic';

if ("classic" === $dark_mode_switcher) { ?>
    <div id="darkify_switch_<?php echo esc_attr($this->unique_id); ?>" onclick="darkify_switch_trigger()" class="darkify_switch darkify_switch_style <?php echo esc_attr($floating_switch_position); ?> <?php echo esc_attr($position_class); ?> <?php echo esc_attr($tooltip_classes); ?> <?php echo esc_attr($hide_dark_mode_on_mobile_screen); ?>">
        <div class="theme-toggle">
            <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="50px" height="50px" fill="currentColor" stroke-linecap="round" class="theme-toggle__classic" viewBox="0 0 32 32">
                <clipPath id="theme-toggle__classic__cutout">
                    <path d="M0-5h30a1 1 0 0 0 9 13v24H0Z" />
                </clipPath>
                <g clip-path="url(#theme-toggle__classic__cutout)">
                    <circle cx="16" cy="16" r="9.34" />
                    <g stroke="currentColor" stroke-width="1.5">
                        <path d="M16 5.5v-4" />
                        <path d="M16 30.5v-4" />
                        <path d="M1.5 16h4" />
                        <path d="M26.5 16h4" />
                        <path d="m23.4 8.6 2.8-2.8" />
                        <path d="m5.7 26.3 2.9-2.9" />
                        <path d="m5.8 5.8 2.8 2.8" />
                        <path d="m23.4 23.4 2.9 2.9" />
                    </g>
                </g>
            </svg>
        </div>
        <?php if ($floating_switch_width) { ?> <span class="darkify_tooltiptext"><?php echo esc_attr($tooltip_on_floating_switch["tooltip_text"]); ?></span> <?php } ?>
    </div>
<?php } ?>
<?php if ("inner-moon" === $dark_mode_switcher) { ?>
    <div id="darkify_switch_<?php echo esc_attr($this->unique_id); ?>" onclick="darkify_switch_trigger()" class="darkify_switch darkify_switch_style <?php echo esc_attr($floating_switch_position); ?> <?php echo esc_attr($options["enable_absolute_position"] ? "darkify_absolute_position" : ""); ?> <?php echo esc_attr($tooltip_classes); ?> <?php echo esc_attr($hide_dark_mode_on_mobile_screen); ?>">
        <div class="theme-toggle">
            <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="50px" height="50px" fill="currentColor" class="theme-toggle__inner-moon" viewBox="0 0 32 32">
                <path d="M27.5 11.5v-7h-7L16 0l-4.5 4.5h-7v7L0 16l4.5 4.5v7h7L16 32l4.5-4.5h7v-7L32 16l-4.5-4.5zM16 25.4a9.39 9.39 0 1 1 0-18.8 9.39 9.39 0 1 1 0 18.8z" />
                <circle cx="16" cy="16" r="8.1" />
            </svg>
        </div>
        <?php if ($floating_switch_width) { ?> <span class="darkify_tooltiptext"><?php echo esc_attr($tooltip_on_floating_switch["tooltip_text"]); ?></span> <?php } ?>
    </div>
<?php } ?>
<?php if ("expand" === $dark_mode_switcher) { ?>
    <div id="darkify_switch_<?php echo esc_attr($this->unique_id); ?>" onclick="darkify_switch_trigger()" class="darkify_switch darkify_switch_style <?php echo esc_attr($floating_switch_position); ?> <?php echo esc_attr($options["enable_absolute_position"] ? "darkify_absolute_position" : ""); ?> <?php echo esc_attr($tooltip_classes); ?> <?php echo esc_attr($hide_dark_mode_on_mobile_screen); ?>">
        <div class="theme-toggle">
            <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="50px" height="50px" fill="currentColor" class="theme-toggle__expand" viewBox="0 0 32 32">
                <clipPath id="theme-toggle__expand__cutout">
                    <path d="M0-11h25a1 1 0 0017 13v30H0Z" />
                </clipPath>
                <g clip-path="url(#theme-toggle__expand__cutout)">
                    <circle cx="16" cy="16" r="8.4" />
                    <path d="M18.3 3.2c0 1.3-1 2.3-2.3 2.3s-2.3-1-2.3-2.3S14.7.9 16 .9s2.3 1 2.3 2.3zm-4.6 25.6c0-1.3 1-2.3 2.3-2.3s2.3 1 2.3 2.3-1 2.3-2.3 2.3-2.3-1-2.3-2.3zm15.1-10.5c-1.3 0-2.3-1-2.3-2.3s1-2.3 2.3-2.3 2.3 1 2.3 2.3-1 2.3-2.3 2.3zM3.2 13.7c1.3 0 2.3 1 2.3 2.3s-1 2.3-2.3 2.3S.9 17.3.9 16s1-2.3 2.3-2.3zm5.8-7C9 7.9 7.9 9 6.7 9S4.4 8 4.4 6.7s1-2.3 2.3-2.3S9 5.4 9 6.7zm16.3 21c-1.3 0-2.3-1-2.3-2.3s1-2.3 2.3-2.3 2.3 1 2.3 2.3-1 2.3-2.3 2.3zm2.4-21c0 1.3-1 2.3-2.3 2.3S23 7.9 23 6.7s1-2.3 2.3-2.3 2.4 1 2.4 2.3zM6.7 23C8 23 9 24 9 25.3s-1 2.3-2.3 2.3-2.3-1-2.3-2.3 1-2.3 2.3-2.3z" />
                </g>
            </svg>
        </div>
        <?php if ($floating_switch_width) { ?> <span class="darkify_tooltiptext"><?php echo esc_attr($tooltip_on_floating_switch["tooltip_text"]); ?></span> <?php } ?>
    </div>
<?php } ?>
<?php if ("within" === $dark_mode_switcher) { ?>
    <div id="darkify_switch_<?php echo esc_attr($this->unique_id); ?>" onclick="darkify_switch_trigger()" class="darkify_switch darkify_switch_style <?php echo esc_attr($floating_switch_position); ?> <?php echo esc_attr($options["enable_absolute_position"] ? "darkify_absolute_position" : ""); ?> <?php echo esc_attr($tooltip_classes); ?> <?php echo esc_attr($hide_dark_mode_on_mobile_screen); ?>">
        <div class="theme-toggle">
            <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" class="theme-toggle__within" height="1em" width="1em" viewBox="0 0 32 32" fill="currentColor">
                <clipPath id="theme-toggle__within__clip">
                    <path d="M0 0h32v32h-32ZM6 16A1 1 0 0026 16 1 1 0 006 16" />
                </clipPath>
                <g clip-path="url(#theme-toggle__within__clip)">
                    <path d="M30.7 21.3 27.1 16l3.7-5.3c.4-.5.1-1.3-.6-1.4l-6.3-1.1-1.1-6.3c-.1-.6-.8-.9-1.4-.6L16 5l-5.4-3.7c-.5-.4-1.3-.1-1.4.6l-1 6.3-6.4 1.1c-.6.1-.9.9-.6 1.3L4.9 16l-3.7 5.3c-.4.5-.1 1.3.6 1.4l6.3 1.1 1.1 6.3c.1.6.8.9 1.4.6l5.3-3.7 5.3 3.7c.5.4 1.3.1 1.4-.6l1.1-6.3 6.3-1.1c.8-.1 1.1-.8.7-1.4zM16 25.1c-5.1 0-9.1-4.1-9.1-9.1 0-5.1 4.1-9.1 9.1-9.1s9.1 4.1 9.1 9.1c0 5.1-4 9.1-9.1 9.1z" />
                </g>
                <path class="theme-toggle__within__circle" d="M16 7.7c-4.6 0-8.2 3.7-8.2 8.2s3.6 8.4 8.2 8.4 8.2-3.7 8.2-8.2-3.6-8.4-8.2-8.4zm0 14.4c-3.4 0-6.1-2.9-6.1-6.2s2.7-6.1 6.1-6.1c3.4 0 6.1 2.9 6.1 6.2s-2.7 6.1-6.1 6.1z" />
                <path class="theme-toggle__within__inner" d="M16 9.5c-3.6 0-6.4 2.9-6.4 6.4s2.8 6.5 6.4 6.5 6.4-2.9 6.4-6.4-2.8-6.5-6.4-6.5z" />
            </svg>
        </div>
        <?php if ($floating_switch_width) { ?> <span class="darkify_tooltiptext"><?php echo esc_attr($tooltip_on_floating_switch["tooltip_text"]); ?></span> <?php } ?>
    </div>
<?php } ?>
```