Support » Plugin: WooCommerce » Email does not have color in header

  • Hi,

    The emails sent out don’t have color in the header is white so the title text of the email is not visible. I have played with colors in the settings > email area but that does not fix the problem

    This is the styling CSS when I use inspect tool but the background color is lined out and dont know how to activate it. Thank you for all of your help

    “Style Attribute {
    background-color: A11F8B;
    border-radius: 3px 3px 0 0 !important;
    color: #ffffff;
    border-bottom: 0;
    font-weight: bold;
    line-height: 100%;
    vertical-align: middle;
    font-family: “Helvetica Neue”, Helvetica, Roboto, Arial, sans-serif;”

    System Repoprt is bellow

    ### WordPress Environment ###

    Home URL:
    Site URL:
    WC Version: 2.6.7
    Log Directory Writable: ✔
    WP Version: 4.6.1
    WP Multisite: –
    WP Memory Limit: 256 MB
    WP Debug Mode: –
    WP Cron: ✔
    Language: en_US

    ### Server Environment ###

    Server Info: Apache/2
    PHP Version: ❌ 5.5.22 – We recommend a minimum PHP version of 5.6. See: How to update your PHP version
    PHP Post Max Size: 20 MB
    PHP Time Limit: 120
    PHP Max Input Vars: 1000
    cURL Version: 7.22.0

    SUHOSIN Installed: –
    MySQL Version: 5.6.32
    Max Upload Size: 20 MB
    Default Timezone is UTC: ✔
    fsockopen/cURL: ✔
    SoapClient: ❌ Your server does not have the SoapClient class enabled – some gateway plugins which use SOAP may not work as expected.
    DOMDocument: ✔
    GZip: ✔
    Multibyte String: ✔
    Remote Post: ✔
    Remote Get: ✔

    ### Database ###

    WC Database Version: 2.6.7
    woocommerce_sessions: ✔
    woocommerce_api_keys: ✔
    woocommerce_attribute_taxonomies: ✔
    woocommerce_downloadable_product_permissions: ✔
    woocommerce_order_items: ✔
    woocommerce_order_itemmeta: ✔
    woocommerce_tax_rates: ✔
    woocommerce_tax_rate_locations: ✔
    woocommerce_shipping_zones: ✔
    woocommerce_shipping_zone_locations: ✔
    woocommerce_shipping_zone_methods: ✔
    woocommerce_payment_tokens: ✔
    woocommerce_payment_tokenmeta: ✔
    MaxMind GeoIP Database: ✔

    ### Active Plugins (13) ###

    Better Font Awesome: by MIGHTYminnow & Mickey Kay – 1.6.0
    iThemes Security: by iThemes – 5.7.0
    Payment Gateway Based Fees and Discounts for WooCommerce: by Algoritmika Ltd – 2.1.1
    Envira Gallery Lite: by Thomas Griffin – 1.5.4
    WooCommerce – Gift Cards: by WP Ronin – 2.4.1
    TinyMCE Advanced: by Andrew Ozz – 4.4.1
    UpdraftPlus – Backup/Restore: by UpdraftPlus.Com
    DavidAnderson –

    Product Customer List for WooCommerce: by Kokomo – 2.3.8
    WooEvents: by ExThemes – 2.2.9
    WooCommerce Food Menu: by SolverCircle – 1.2
    WooCommerce: by WooThemes – 2.6.7
    WordPress Importer: by wordpressdotorg – 0.6.3
    WP Smush: by WPMU DEV – 2.5.2

    ### Settings ###

    Force SSL: –
    Currency: USD ($)
    Currency Position: left
    Thousand Separator: ,
    Decimal Separator: .
    Number of Decimals: 2

    ### API ###

    API Enabled: ✔

    ### WC Pages ###

    Shop Base: #177 – /shop/
    Cart: #178 – /cart/
    Checkout: #179 – /checkout/
    My Account: #180 – /my-account/

    ### Taxonomies ###

    Product Types: external (external)
    grouped (grouped)
    simple (simple)
    variable (variable)

    ### Theme ###

    Name: Joyful Provisions
    Version: 1
    Author URL:
    Child Theme: ✔
    Parent Theme Name: Divi
    Parent Theme Version: 3.0.17
    Parent Theme Author URL:
    WooCommerce Support: ✔

    ### Templates ###

    Overrides: –

Viewing 9 replies - 1 through 9 (of 9 total)
  • The background color should be a hex number: #A11F8B not A11F8B. Without the # its an invalid hex number, which is why its struck out in the inspector.

    How did that change? I tried to change it on the inspect tool but cant… it wont let me. Dont know how that happened in the first place.

    It says its inherited from tabel#template_header… Where can I find that to change it there?

    Can’t see it at:
    so have a look at:

    If you alter a template, you’ll need to make a child theme and copy it there, to avoid your edits being overwritten.

    I have found an element and the base color under setting (base color) is set but for some reason, it keeps beeing struck out.

    #template_header {
    background-color: <?php echo esc_attr( $base ); ?>;
    border-radius: 3px 3px 0 0 !important;
    color: <?php echo esc_attr( $base_text ); ?>;
    border-bottom: 0;
    font-weight: bold;
    line-height: 100%;
    vertical-align: middle;
    font-family: “Helvetica Neue”, Helvetica, Roboto, Arial, sans-serif;

    Is this a setting in Divi? Ensure it has a #, so #A11F8B.

    If it does have a # prefix in the setting, but not in the inspector, you should ask Divi support about it.

    Forum members don’t have access to commercial themes.

    I don’t think this is related to the theme at all. I am using another theme and I’m facing this issue. I don’t have any common plugins with the OP except woocommerce.
    The option is getting saved without a #, so when it is retrieved in the styles, there’s no #.

    I’ve had a look in my wp_options table and for option_name = woocommerce_email_base_color, and the relevant option_value does include the #.

    I am using the default utf8 character set and English language. Maybe for other character sets, keyboard layouts or languages, a different key code is being generated.

    I fixed this. In my case, ‘Recover Abandoned Cart’ plugin was including a color picker JS file which was replacing all normal color picker input boxes in wordpress admin. I simply removed the colorjs file by:

    /* Fix recover abandoned cart color issue. */
    add_action('admin_enqueue_scripts', function(){
        $screen = get_current_screen();
        if($screen->base != 'woocommerce_page_wc-settings')
    }, 20);
    • This reply was modified 2 years, 5 months ago by  dpacmittal.
Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Email does not have color in header’ is closed to new replies.