color_scheme = aladdin_get_theme_mod( 'color_scheme', $defaults['color_scheme'] ); $this->add_scheme(0, __('Blue', 'aladdin')); $this->add_scheme(1, __('Green', 'aladdin')); $section_id = 'main_colors'; $section_priority = 10; $p = 10; $this->add_section($section_id, __('Main Colors', 'aladdin'), __('Main website colors', 'aladdin'), $section_priority++); /* colors */ $i = 'link_color'; $this->add_color($i, $section_id, __('Link', 'aladdin'), $p++, false); $this->set_color($i, 0, '#1e73be'); $this->set_color($i, 1, '#1e73be'); $i = 'heading_color'; $this->add_color($i, $section_id, __('H1-H6 heading', 'aladdin'), $p++, false); $this->set_color($i, 0, '#3f3f3f'); $this->set_color($i, 1, '#3f3f3f'); $i = 'heading_link'; $this->add_color($i, $section_id, __('H1-H6 Link', 'aladdin'), $p++, false); $this->set_color($i, 0, '#1e73be'); $this->set_color($i, 1, '#1e73be'); $i = 'description_color'; $this->add_color($i, $section_id, __('Description', 'aladdin'), $p++, false); $this->set_color($i, 0, '#ffffff'); $this->set_color($i, 1, '#ffffff'); $i = 'hover_color'; $this->add_color($i, $section_id, __('Link Hover', 'aladdin'), $p++, false, 'refresh'); $this->set_color($i, 0, '#a72ec9'); $this->set_color($i, 1, '#a72ec9'); add_action( 'customize_register', array( $this, 'aladdin_create_colors_controls' ), 21 ); add_action( 'aladdin_option_defaults', array( $this, 'aladdin_add_defaults' ) ); add_action( 'customize_controls_print_scripts', array( $this, 'aladdin_print_customizer_js_colors') ); } /* Print js for color scheme switching */ public function aladdin_print_customizer_js_colors() { ?> color_scheme; } public function add_section($name, $title, $description, $priority, $panel = 'custom_colors') { $this->sections[$name]['title'] = $title; $this->sections[$name]['description'] = $description; $this->sections[$name]['priority'] = $priority; $this->sections[$name]['panel'] = $panel; } // Set color properties public function add_color($name, $section, $title, $priority, $is_has_opacity = false, $transport = 'postMessage') { $this->colors[$name]['section'] = $section; $this->colors[$name]['val'] = ''; $this->colors[$name]['text'] = $title; $this->colors[$name]['priority'] = $priority; $this->colors[$name]['is_has_opacity'] = $is_has_opacity; $this->colors[$name]['transport'] = $transport; } // Set color value and opacity for the color scheme public function set_color($name, $color_scheme, $color, $opacity = 1) { $this->colors[$name][$color_scheme]['def_val'] = $color; $this->colors[$name][$color_scheme]['def_op'] = $opacity; } // Set color value and opacity for the color scheme public function use_default( $id ) { $this->is_use_default_colors = true; $this->color_scheme = $id; } // Return hex color value public function get_color( $name ) { if ( true == $this->is_use_default_colors ) { $color = $this->colors[ $name ][ $this->color_scheme ]['def_val']; if( $this->colors[$name]['is_has_opacity'] ) { $opacity = $this->colors[ $name ][ $this->color_scheme ]['def_op']; $color = $this->hex_to_rgba( $color, $opacity ); } } else { $color = get_theme_mod($name, $this->colors[ $name ][ $this->color_scheme ]['def_val']); if( $this->colors[$name]['is_has_opacity'] ) { $opacity = get_theme_mod($name.'_opacity', $this->colors[ $name ][ $this->color_scheme ]['def_op']); $color = $this->hex_to_rgba( $color, $opacity ); } } return $color; } // Add new color scheme public function add_scheme( $id, $text) { $this->color_schemes[ $id ] = $text; } // Set color scheme public function set_scheme( $id ) { $this->color_scheme = $id; } // Return color schemes public function get_schemes() { return $this->color_schemes; } // Add sections and controls to the Customizer public function aladdin_create_colors_controls( $wp_customize ) { global $wp_version; if ( version_compare( $wp_version, '4.0.0', '>=' ) ) { $wp_customize->add_panel( 'custom_colors', array( 'priority' => 103, 'title' => __( 'Colors', 'aladdin' ), 'description' => __( 'In this section you can change colors for different elements.', 'aladdin' ), ) ); } $wp_customize->add_section( 'color_scheme', array( 'title' => __( 'Color Scheme', 'aladdin' ), 'description' => __( 'This option refresh theme colors.', 'aladdin' ), 'priority' => 1, 'panel' => 'custom_colors', ) ); $wp_customize->add_setting( 'color_scheme', array( 'default' => $this->color_scheme, 'capability' => 'edit_theme_options', 'sanitize_callback' => 'aladdin_sanitize_color_scheme' ) ); $wp_customize->add_control( 'color_scheme', array( 'label' => __( 'Color Scheme', 'aladdin' ), 'section' => 'color_scheme', 'settings' => 'color_scheme', 'type' => 'select', 'priority' => 1, 'choices' => $this->get_schemes(), ) ); // Register Customizer sections foreach( $this->sections as $id => $section ) { $wp_customize->add_section( $id, array( 'priority' => $section['priority'], 'title' => $section['title'], 'description' => $section['description'], 'panel' => $section['panel'], ) ); } // Register Customizer settings and controls foreach( $this->colors as $id => $colors ) { $p = $colors['priority']; $wp_customize->add_setting( $id, array( 'default' => $colors[ $this->color_scheme ]['def_val'], 'transport' => $colors['transport'], 'capability' => 'edit_theme_options', 'sanitize_callback' => 'aladdin_sanitize_hex_color' ) ); $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, $id, array( 'label' => $colors['text'], 'section' => $colors['section'], 'settings' => $id, 'priority' => $colors['priority'], ) ) ); if( $colors['is_has_opacity'] ) { $wp_customize->add_setting( $id.'_opacity', array( 'default' => $colors[ $this->color_scheme ]['def_op'], 'transport' => 'postMessage', 'capability' => 'edit_theme_options', 'sanitize_callback' => 'aladdin_sanitize_opacity' ) ); $wp_customize->add_control( $id.'_opacity', array( 'label' => __('Opacity for the ', 'aladdin').$colors['text'], 'section' => $colors['section'], 'settings' => $id.'_opacity', 'type' => 'select', 'priority' => $colors['priority'], 'choices' => array ( '0' => '0', '0.1' => '0.1', '0.2' => '0.2', '0.3' => '0.3', '0.4' => '0.4', '0.5' => '0.5', '0.6' => '0.6', '0.7' => '0.7', '0.8' => '0.8', '0.9' => '0.9', '1' => '1') ) ); $wp_customize->add_setting( $id.'_opacity_range', array( 'type' => 'empty', 'default' => 10*get_theme_mod($id.'_opacity', $colors[ $this->color_scheme ]['def_op']), 'capability' => 'edit_theme_options', 'transport' => 'postMessage', 'sanitize_callback' => 'absint' ) ); $wp_customize->add_control( $id.'_opacity_range', array( 'label' => '', 'section' => $colors['section'], 'settings' => $id.'_opacity_range', 'type' => 'range', 'input_attrs' => array( 'min' => 0, 'max' => 10, 'step' => 1,), 'priority' => $colors['priority'], )); } } } /** * Transform hex color to rgba * * @param string $color hex color. * @param int $opacity opacity. * @return string rgba color. * @since Aladdin 1.0.0 */ function hex_to_rgba( $color, $opacity ) { if ($color[0] == '#' ) { $color = substr( $color, 1 ); } $hex = array('ffffff'); if ( 6 == strlen($color) ) { $hex = array( $color[0].$color[1], $color[2].$color[3], $color[4].$color[5] ); } elseif ( 3 == strlen( $color ) ) { $hex = array( $color[0].$color[0], $color[1].$color[1], $color[2].$color[2] ); } $rgb = array_map('hexdec', $hex); return 'rgba('.implode(",",$rgb).','.$opacity.')'; } /* Add values to defaults array */ function aladdin_add_defaults( $defaults ) { foreach( $this->colors as $id => $values ) { $defaults[ $id ] = $values[0]['def_val']; } return $defaults; } } /** * Return string Sanitized color scheme * * @since Aladdin 1.0.0 */ function aladdin_sanitize_color_scheme( $value ) { global $aladdin_colors_class; $defaults = aladdin_get_defaults(); $possible_values = $aladdin_colors_class->get_schemes(); return ( array_key_exists( $value, $possible_values ) ? $value : $defaults['color_scheme'] ); } /** * Add custom styles to the header. * * @since Aladdin 1.0.0 */ function aladdin_hook_css_colors() { global $aladdin_colors_class; $colors = $aladdin_colors_class; ?>