Some one asked if i could have a look on how to remove the essence pro background image and replace it with a custom background color. Customizable form the wp customizer.
Open the customize.php for /lib/customizer/ folder and comment out the following
1 2 3 4 5 6 7 8 | /* $wp_customize->add_section( 'header_image', [ 'title' => __( 'Header Background Image', 'essence-pro' ), 'description' => sprintf( ' %1$s %2$s ', __( 'The default header background image is displayed on the front page and all posts and pages where a unique featured image is not available.', 'essence-pro' ), __( 'A default image is included with the theme, but you may choose a different default image below.', 'essence-pro' ) ), 'panel' => 'essence-settings', ] );*/ |
then add the following to the same file first block
1 2 3 4 5 6 7 8 | $wp_customize->add_section( 'header_image', [ 'title' => __( 'Header Background', 'essence-pro' ), 'description' => sprintf( ' %1$s %2$s ', __( 'The default header background image is displayed on the front page and all posts and pages where a unique featured image is not available.', 'essence-pro' ), __( 'A default image is included with the theme, but you may choose a different default image below.', 'essence-pro' ) ), 'panel' => 'essence-settings', ] ); |
Second block
1 2 3 4 5 6 7 8 | // Background Colors. $wp_customize->add_setting( 'essence_background_color', [ 'default' => essence_customizer_get_default_background_color(), 'sanitize_callback' => 'sanitize_hex_color', ] ); |
Third block:
1 2 3 4 5 6 7 8 9 10 11 12 | $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'essence_background_color', [ 'description' => __( 'Change the default background color', 'essence-pro' ), 'label' => __( 'Background Color', 'essence-pro' ), 'section' => 'header_image', 'settings' => 'essence_background_color', ] ) ); |
Now save and open up the following file /lib/customizer/output
add the following to the varables to function essence_css()
1 | $color_background = get_theme_mod( 'essence_background_color', essence_customizer_get_default_background_color() ); |
and add the following code in the function between
1 2 3 4 5 6 7 8 9 | $css .= ( essence_customizer_get_default_background_color() !== $color_background) ? sprintf( ' .header-hero { background-color: %1$s; } ', $color_background ) : ''; |
Go to the helper function and go paste:
1 2 3 4 5 | function essence_customizer_get_default_background_color() { return '#e27add'; } |