• Resolved holle75

    (@holle75)


    Hi there, original woocommerce emails header h1 color is white (also when sent). When sent or showed via mailpoets template editor (meaning mailpoets template editor for woocommerce emails is switched on) the header h1 color is black. Thats strange.

    The header content can´t be modified by mailpoets editor …. where do you define header h1 color of woocommerce mails if you want to show and sent the “original white”??!

    thank you and best regards
    H.

Viewing 14 replies - 1 through 14 (of 14 total)
  • Plugin Support Gui A. a11n

    (@guicmazeredo)

    Hi there @holle75,

    Thanks for reaching out!

    You should be able to change the color of your heading as shown in this video: https://d.pr/v/MlAFL5

    You can also see more details here:
    https://kb.mailpoet.com/article/143-mailpoet-email-editor

    If the color that’s shown when sending or previewing your emails is different from the one you set when editing the email, it’s likely that there is a CSS from your theme or another plugin you are using overriding the MailPoet email editor.

    You can check if that’s the case by deactivating all plugins and switching to a default theme to see if the heading color will render as expected.

    I hope this helps!

    Let us know if you need any other assistance.

    Thread Starter holle75

    (@holle75)

    Hi Gui and thank you for your reply.
    I can´t modify the Header as shown in your video. The header h1 is blocked, when i try i´m getting an info ~ “automatically generated by woocommerce”.

    Thats what irritates me. When Mailpoet´s editor is switched off the header h1 is white, When MP editor is switched on, the Header h1 becomes black but i can´t change the color. No other plugins that would interfere are installed.

    Plugin Author Bruna a11n

    (@bruberries)

    Hi @holle75,

    As I understand, you’re not referring to the MailPoet Email Editor, but to the WooCommerce Emails Customizer, right?

    I can´t modify the Header as shown in your video. The header h1 is blocked, when i try i´m getting an info ~ “automatically generated by woocommerce”.

    That’s correct, it’s not possible to edit the header’s text as this content is automatically generated by WooCommerce. However, you should be able to change its color and font by going to the “Styles” tab.

    There you can set up the Header’s background to white and text will be set to black.

    Here’s a screenshot.

    Thread Starter holle75

    (@holle75)

    Hi Bruna, yes, thats whats supposed to happen. But doesn´t.
    Changing anything in the MailPoets woocommerce maileditor (branding color or text color) have no influence on the color of this h1 header (TEXT). As i mentioned, my original h1 header from woocommerce is white, so changing the original woocommerce email template wouldn´t help.

    Thread Starter holle75

    (@holle75)

    … would have loved to upload a screenshot but this seems to be impossible.

    Thread Starter holle75

    (@holle75)

    actually the color is not black but #202020. I have no idea where MailPoets editor is getting this color.

    .mailpoet_woocommerce_heading h1 {
        line-height: 1.2em;
        font-family: roboto, 'helvetica neue', helvetica, arial, sans-serif;
        font-size: 36px;
        color: #202020;
        margin: 0;
    }

    uuh, now i get it. Its “the automatic” that changes header h1 color depending on the lightness of the background. Without Mailpoets Editor Background color was much darker -> white header h1 color.

    Anyone an idea how to switch off this behavior?

    Thread Starter holle75

    (@holle75)

    ok, now its getting complicated. Any modification to your css via functions.php or email-styles.php is getting ignored when using MailPoets editor for woocommerce mails.
    So please, now the MailPoets team is in charge to offer an solution. Which file i have to modify?

    Hi there @holle75,

    Can you please share the following screenshots:

    – how WooCommerce email is previewed in the MailPoet Email Editor;
    – how this email looks like when you receive it.

    I recommend https://snipboard.io/ for easily sharing screenshots – please follow the instructions on the page, then paste the URL in your reply.

    Please also share your System Info from MailPoet > Help. Please remove your email address from there before sharing.

    Cheers!

    Thread Starter holle75

    (@holle75)

    https://snipboard.io/H31Cdq.jpg

    https://snipboard.io/lc7f16.jpg

    the sent email looks exactly like in MailPoet Editor.

    this is how it looks without Mailpoet Editor switched on in woocommerce:
    https://snipboard.io/27RbZe.jpg

    the white header h1 i would like to achieve

    Hi there @holle75,

    Thanks for getting back to us with the screenshots!

    Now I see what you mean here. I’ll check with my team regarding this behaviour and will get back to you shortly.

    Cheers!

    Hi there @holle75,

    I checked with our devs and it turns out that indeed, we automatically set the color of the heading to black or white based on the background color.

    We might change that once we switch to Gutenberg for emails, but that’s at least a year in the future, so there is a very small chance this behaviour will be adjusted sooner.

    I hope this clarifies a bit, but please let us know if you have any questions!

    Thread Starter holle75

    (@holle75)

    Hi Elvira, well, anyways there must be a file where this behavior is defined, right? Which one is it?

    You can make manual adjustments in the original woocommerce mails via a css or php file (as mentioned earlier). It´s a pitty that MailPoet is not offering the same functionality (it would be very simple and has nothing to do with Gutenberg-Mails)

    thank you
    H.

    • This reply was modified 4 years, 6 months ago by holle75.
    • This reply was modified 4 years, 6 months ago by holle75.
    Thread Starter holle75

    (@holle75)

    /wp-content/plugins/mailpoet/views/newsletter/templates/components/styles.hbs

    line 42

    .mailpoet_woocommerce_heading h1 {
    line-height: 1.2em;
    font-family: {{fontWithFallback text.fontFamily }};
    font-size: 36px;
    /* color: {{ woocommerce.headingFontColor }}; */
    color: #ffffff;
    margin: 0;
    }

    will hold until the next update …
    would be very easy to give the user in BO the opportunity to keep the automatic or define his/her own color.

    • This reply was modified 4 years, 5 months ago by holle75.
    Plugin Support Dani F. a11n

    (@danielinhou)

    Hi there @holle75,

    As my colleague Elvira explained, the devs are not planning to change this anytime soon. They expect to refactor this once we switch to Gutenberg for emails, but that’s at least a year in the future, so there is a very small chance this behaviour will be adjusted sooner.

    However, it might be possible with some custom code. If you need help with custom code, you can reach out to someone from Codeable: https://codeable.io.

    I hope this helps and thanks for your patience.

    Cheers

Viewing 14 replies - 1 through 14 (of 14 total)

The topic ‘h1 header color in woocommerce mails’ is closed to new replies.