->plugin_url( 'assets/images/os-theme.gif' )
. ')
',
'type' => 'switcher',
),
) ),
'wp_dark_mode_advanced' => apply_filters( 'wp_dark_mode/advanced_settings', array(
'low_image' => array(
'name' => 'low_image',
'default' => 'off',
'label' => __( 'Low Image Brightness', 'wp-dark-mode' ),
'desc' => __( 'Decrease the brightness and contrast of images in the dark mode.', 'wp-dark-mode' ),
'type' => 'switcher',
),
'remember_darkmode' => array(
'name' => 'remember_darkmode',
'default' => 'off',
'label' => __( 'Remember Dark Mode', 'wp-dark-mode' ),
'desc' => __( 'If remember dark mode is on, browser remembers the user\'s selected mode and shows it to them when they re-open the browser', 'wp-dark-mode' ),
'type' => 'switcher',
),
'specific_category' => array(
'name' => 'specific_category',
'default' => 'off',
'label' => __( 'Specific Category', 'wp-dark-mode' ),
'desc' => __( 'Apply dark mode only on specific category post.', 'wp-dark-mode' ),
'type' => 'switcher',
),
'specific_categories' => array(
'name' => 'specific_categories',
'default' => [$this, 'specific_categories'],
'label' => __( 'Select Category(s)', 'wp-dark-mode' ),
'desc' => __( 'Select the category(s) in which you want to apply the darkmode. Outside of the category the dark mode won\'t be applied.', 'wp-dark-mode' ),
'type' => 'cb_function',
),
'time_based_mode' => array(
'name' => 'time_based_mode',
'default' => 'off',
'label' => __( 'Time Based Dark Mode', 'wp-dark-mode' ),
'desc' => __( 'Automatically turn on the dark mode between a given time range.', 'wp-dark-mode' ),
'type' => 'switcher',
),
'start_at' => array(
'name' => 'start_at',
'default' => '17:00',
'label' => __( 'Dark Mode Start Time', 'wp-dark-mode' ),
'desc' => __( 'Time to start Dark mode.', 'wp-dark-mode' ),
'type' => 'select',
'options' => $time_range,
),
'end_at' => array(
'name' => 'end_at',
'default' => '06:00',
'label' => __( 'Dark Mode End Time', 'wp-dark-mode' ),
'desc' => __( 'Time to end Dark mode.', 'wp-dark-mode' ),
'type' => 'select',
'options' => $time_range,
),
) ),
'wp_dark_mode_display' => apply_filters( 'wp_dark_mode/display_settings', array(
'switch_style' => array(
'name' => 'switch_style',
'default' => '1',
'label' => __( 'Floating Switch Style', 'wp-dark-mode' ),
'desc' => __( 'Select the switcher button style for the frontend.', 'wp-dark-mode' ),
'type' => 'image_choose',
'options' => [
'1' => wp_dark_mode()->plugin_url( 'assets/images/button-presets/1.svg' ),
'2' => wp_dark_mode()->plugin_url( 'assets/images/button-presets/2.svg' ),
'3' => wp_dark_mode()->plugin_url( 'assets/images/button-presets/3.svg' ),
'4' => wp_dark_mode()->plugin_url( 'assets/images/button-presets/4.svg' ),
'5' => wp_dark_mode()->plugin_url( 'assets/images/button-presets/5.svg' ),
'6' => wp_dark_mode()->plugin_url( 'assets/images/button-presets/6.svg' ),
'7' => wp_dark_mode()->plugin_url( 'assets/images/button-presets/7.svg' ),
],
),
'switcher_position' => array(
'name' => 'switcher_position',
'default' => 'right_bottom',
'label' => __( 'Floating Switch Position', 'wp-dark-mode' ),
'desc' => __( 'Select the position of the floating dark mode switcher button on the frontend.',
'wp-dark-mode' ),
'type' => 'select',
'options' => [
'left_bottom' => __( 'Left Bottom', 'wp-dark-mode' ),
'right_bottom' => __( 'Right Bottom', 'wp-dark-mode' ),
],
),
'enable_menu_switch' => array(
'name' => 'enable_menu_switch',
'default' => 'off',
'label' => __( 'Display Switch in Menu', 'wp-dark-mode' ),
'desc' => __( 'Display the darkmode switch in the menu.', 'wp-dark-mode' ),
'type' => 'switcher',
),
'switch_menus' => array(
'name' => 'switch_menus',
'default' => [$this, 'switch_menus'],
'label' => __( 'Select Menu(s)', 'wp-dark-mode' ),
'desc' => __( 'Select the menu(s) in which you want to display the darkmode switch.', 'wp-dark-mode' ),
'type' => 'cb_function',
),
'custom_switch_icon' => array(
'name' => 'custom_switch_icon',
'default' => 'off',
'label' => __( 'Custom Switch Icon', 'wp-dark-mode' ),
'desc' => __( 'Customize the darkmode switch icon in the dark & light mode.', 'wp-dark-mode' ),
'type' => 'switcher',
),
'switch_icon_light' => array(
'name' => 'switch_icon_light',
'label' => __( 'Switch Icon (Light)', 'wp-dark-mode' ),
'desc' => __( 'Switch Icon in the light mode.', 'wp-dark-mode' ),
'type' => 'file',
),
'switch_icon_dark' => array(
'name' => 'switch_icon_dark',
'label' => __( 'Switch Icon (Dark)', 'wp-dark-mode' ),
'desc' => __( 'Switch Icon in the dark mode.', 'wp-dark-mode' ),
'type' => 'file',
),
'custom_switch_text' => array(
'name' => 'custom_switch_text',
'default' => 'off',
'label' => __( 'Custom Switch Text', 'wp-dark-mode' ),
'desc' => __( 'Customize the darkmode switch text.', 'wp-dark-mode' ),
'type' => 'switcher',
),
'switch_text_light' => array(
'name' => 'switch_text_light',
'default' => 'Light',
'label' => __( 'Switch Text (Light)', 'wp-dark-mode' ),
'desc' => __( 'Floating switch light text.', 'wp-dark-mode' ),
'type' => 'text',
),
'switch_text_dark' => array(
'name' => 'switch_text_dark',
'default' => 'Dark',
'label' => __( 'Switch Text (Dark)', 'wp-dark-mode' ),
'desc' => __( 'Floating switch dark text.', 'wp-dark-mode' ),
'type' => 'text',
),
'show_above_post' => array(
'name' => 'show_above_post',
'default' => 'off',
'label' => __( 'Show Above Posts', 'wp-dark-mode' ),
'desc' => __( 'Show the dark mode switcher button above of all the post.', 'wp-dark-mode' ),
'type' => 'switcher',
),
'show_above_page' => array(
'name' => 'show_above_page',
'default' => 'off',
'label' => __( 'Show Above Pages', 'wp-dark-mode' ),
'desc' => __( 'Show the dark mode switcher button above of all the pages.', 'wp-dark-mode' ),
'type' => 'switcher',
),
'includes' => array(
'name' => 'includes',
'default' => '',
'label' => __( 'Includes Elements', 'wp-dark-mode' ),
'desc' => __( 'Add comma separated CSS selectors (classes, ids) to includes.', 'wp-dark-mode' ),
'type' => 'textarea',
),
'excludes' => array(
'name' => 'excludes',
'default' => '',
'label' => __( 'Excludes Elements', 'wp-dark-mode' ),
'desc' => __( 'Add comma separated CSS selectors (classes, ids) to ignore the darkmode. ex: .class1, #hero-area', 'wp-dark-mode' ),
'type' => 'textarea',
),
'exclude_pages' => array(
'name' => 'exclude_pages',
'default' => [ $this, 'exclude_pages' ],
'label' => __( 'Exclude Pages', 'wp-dark-mode' ),
'desc' => __( 'Select the pages to disable darkmode on the selected pages.', 'wp-dark-mode' ),
'type' => 'cb_function',
),
) ),
'wp_dark_mode_style' => apply_filters( 'wp_dark_mode/style_settings', array(
'color_preset' => array(
'name' => 'color_preset',
'default' => '0',
'label' => __( 'Darkmode Color Preset:', 'wp-dark-mode' ),
'desc' => __( 'Select the predefined darkmode background, text and link preset color.', 'wp-dark-mode' ),
'type' => 'image_choose',
'options' => [
'0' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/1.svg' ),
'1' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/2.svg' ),
'2' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/3.svg' ),
'3' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/4.svg' ),
'4' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/5.svg' ),
'5' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/6.svg' ),
'6' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/7.svg' ),
'7' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/8.svg' ),
'8' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/9.svg' ),
'9' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/10.svg' ),
'10' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/11.svg' ),
'11' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/12.svg' ),
'12' => wp_dark_mode()->plugin_url( 'assets/images/color-presets/13.svg' ),
],
),
'customize_colors' => array(
'name' => 'customize_colors',
'default' => 'off',
'label' => __( 'Want to customize colors?', 'wp-dark-mode' ),
'desc' => __( 'Customize the darkmode background, text and link colors.', 'wp-dark-mode' ),
'type' => 'switcher',
),
'darkmode_bg_color' => array(
'name' => 'darkmode_bg_color',
'default' => '',
'label' => __( 'Darkmode Background Color', 'wp-dark-mode' ),
'desc' => __( 'Select the background color when the dark mode is on.', 'wp-dark-mode' ),
'type' => 'color',
),
'darkmode_text_color' => array(
'name' => 'darkmode_text_color',
'default' => '',
'label' => __( 'Darkmode Text Color', 'wp-dark-mode' ),
'desc' => __( 'Select the text color when the dark mode is on.', 'wp-dark-mode' ),
'type' => 'color',
),
'darkmode_links_color' => array(
'name' => 'darkmode_link_color',
'default' => '',
'label' => __( 'Darkmode Links Color', 'wp-dark-mode' ),
'desc' => __( 'Select the links color when the dark mode is on.', 'wp-dark-mode' ),
'type' => 'color',
),
) ),
'wp_dark_mode_license' => apply_filters( 'wp_dark_mode/license_settings', array(
'license_settings' => array(
'name' => 'license',
'default' => [ 'WP_Dark_Mode_Settings', 'license_output' ],
'type' => 'cb_function',
),
) ),
'wp_dark_mode_start' => apply_filters( 'wp_dark_mode/getting_start', array(
'getting_started' => array(
'name' => 'getting_started',
'default' => [ 'WP_Dark_Mode_Settings', 'getting_started' ],
'type' => 'cb_function',
),
) ),
'wp_dark_mode_custom_css' => apply_filters( 'wp_dark_mode/custom_css', array(
array(
'name' => 'custom_css',
'label' => 'Dark Mode Custom CSS',
'type' => 'textarea',
'desc' => 'Add custom css for dark mode only. This CSS will only apply when the dark mode is on. use !important flag on each property.',
),
) ),
'wp_dark_mode_image_settings' => apply_filters( 'wp_dark_mode/image_settings', array(
array(
'name' => 'image_settings',
'default' => [ $this, 'image_settings' ],
'type' => 'cb_function',
),
) ),
);
if ( ! wp_dark_mode()->is_pro_active() && !wp_dark_mode()->is_ultimate_active() ) {
$key = array_search( 'wp_dark_mode_license', array_column( $fields, 'id' ) );
unset( $fields[ $key ] );
}
self::$settings_api = new WPPOOL_Settings_API();
//set sections and fields
self::$settings_api->set_sections( $sections );
self::$settings_api->set_fields( $fields );
//initialize them
self::$settings_api->admin_init();
}
public function specific_categories() {
$categories = wp_dark_mode_get_settings('wp_dark_mode_advanced', 'specific_categories', []);
?>
Select the category(s) in which you want to apply the darkmode. Outside of the category the dark mode won't be applied.
Select the menu(s) in which you want to display the darkmode switch.
is_ultimate_active() ) { $images = get_option( 'wp_dark_mode_image_settings' ); $light_images = ! empty( $images['light_images'] ) ? array_filter( (array) $images['light_images'] ) : []; $dark_images = ! empty( $images['dark_images'] ) ? array_filter( (array) $images['dark_images'] ) : []; } ?>🔹️ Light Mode Image: The image link shown in the light mode.
🔹️ Dark Mode Image: The image link that will replace the light mode image while in dark mode.
| Light Mode Image | Dark Mode Image | |
| Add Remove | ||
| Add Remove |