BuddyDev

Search

Buddypress Invite Email UGLY

  • Participant
    Level: Initiated
    Posts: 2
    DJ ZAH on #55200

    Anyway to make the email look better than this when a user gets invited to a group?

    –b1=_VnBAQbgvSh8UjR1aLzyz4BWTEkdROmCcCUwfbtlIRc
    Content-Type: text/plain; charset=us-ascii

    cowboydenny has invited you to join the group: “Davison Schools”.

    {{{group.invite_message}}}

    To accept your invitation, visit: https://eventguyz.com/members/djzah/groups/invites/

    To learn more about the group, visit: https://eventguyz.com/groups/davison-schools/.
    To view cowboydenny’s profile, visit: https://eventguyz.com/members/cowboydenny/

    –b1=_VnBAQbgvSh8UjR1aLzyz4BWTEkdROmCcCUwfbtlIRc
    Content-Type: text/html; charset=us-ascii

    <!DOCTYPE html>
    <html lang=”en” xmlns=”http://www.w3.org/1999/xhtml&#8221; xmlns:v=”urn:schemas-microsoft-com:vml” xmlns:o=”urn:schemas-microsoft-com:office:office”>
    <head>
    <meta charset=”UTF-8″>
    <meta name=”viewport” content=”width=device-width”> <!– Forcing initial-scale shouldn’t be necessary –>
    <meta http-equiv=”X-UA-Compatible” content=”IE=edge”> <!– Use the latest (edge) version of IE rendering engine –>
    <meta name=”x-apple-disable-message-reformatting”> <!– Disable auto-scale in iOS 10 Mail entirely –>
    <title></title> <!– The title tag shows in email notifications, like Android 4.4. –>

    <!– CSS Reset –>
    <style type=”text/css”>
    /* What it does: Remove spaces around the email design added by some email clients. */
    /* Beware: It can remove the padding / margin and add a background color to the compose a reply window. */
    html,
    body {
    Margin: 0 !important;
    padding: 0 !important;
    height: 100% !important;
    width: 100% !important;
    }

    /* What it does: Stops email clients resizing small text. */
    * {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    }

    /* What is does: Centers email on Android 4.4 */
    div[style*=”margin: 16px 0″] {
    margin: 0 !important;
    }

    /* What it does: Stops Outlook from adding extra spacing to tables. */
    table,
    td {
    mso-table-lspace: 0pt !important;
    mso-table-rspace: 0pt !important;
    }

    /* What it does: Fixes webkit padding issue. Fix for Yahoo mail table alignment bug. Applies table-layout to the first 2 tables then removes for anything nested deeper. */
    table {
    border-spacing: 0 !important;
    border-collapse: collapse !important;
    table-layout: fixed !important;
    Margin: 0 auto !important;
    }
    table table table {
    table-layout: auto;
    }

    /* What it does: Uses a better rendering method when resizing images in IE. */
    /* & manages img max widths to ensure content body images don’t exceed template width. */
    img {
    -ms-interpolation-mode:bicubic;
    height: auto;
    max-width: 100%;
    }

    /* What it does: A work-around for email clients meddling in triggered links. */
    *[x-apple-data-detectors], /* iOS */
    .x-gmail-data-detectors, /* Gmail */
    .x-gmail-data-detectors *,
    .aBn {
    border-bottom: 0 !important;
    cursor: default !important;
    color: inherit !important;
    text-decoration: none !important;
    font-size: inherit !important;
    font-family: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    }

    /* What it does: Prevents Gmail from displaying an download button on large, non-linked images. */
    .a6S {
    display: none !important;
    opacity: 0.01 !important;
    }

    /* If the above doesn’t work, add a .g-img class to any image in question. */
    img.g-img + div {
    display: none !important;
    }

    /* What it does: Prevents underlining the button text in Windows 10 */
    .button-link {
    text-decoration: none !important;
    }
    </style>

    </head>
    <body class=”email_bg” width=”100%” bgcolor=”#F7F3F0″ style=”margin: 0; mso-line-height-rule: exactly;”>
    <table cellpadding=”0″ cellspacing=”0″ border=”0″ height=”100%” width=”100%” bgcolor=”#F7F3F0″ style=”border-collapse:collapse;” class=”email_bg”><tr><td valign=”top”>
    <center style=”width: 100%; text-align: left;”>

    <!– Visually Hidden Preheader Text : BEGIN –>
    <div style=”display: none; font-size: 1px; line-height: 1px; max-height: 0px; max-width: 0px; opacity: 0; overflow: hidden; mso-hide: all; font-family: sans-serif;”>

    </div>
    <!– Visually Hidden Preheader Text : END –>

    <div style=”max-width: 600px; margin: auto;” class=”email-container”>
    <!–[if mso]>
    <table role=”presentation” cellspacing=”0″ cellpadding=”0″ border=”0″ width=”600″ align=”center”>
    <tr>
    <td>
    <![endif]–>

    <!– Email Header : BEGIN –>
    <table role=”presentation” cellspacing=”0″ cellpadding=”0″ border=”0″ align=”center” width=”100%” style=”max-width: 600px; border-top: 7px solid #D84800″ bgcolor=”#F7F3F0″ class=”header_bg”>
    <tr>
    <td style=”text-align: center; padding: 15px 0; font-family: sans-serif; mso-height-rule: exactly; font-weight: bold; color: #000000; font-size: 30px” class=”header_text_color header_text_size”>
    EventGuyZ </td>
    </tr>
    </table>
    <!– Email Header : END –>

    <!– Email Body : BEGIN –>
    <table role=”presentation” cellspacing=”0″ cellpadding=”0″ border=”0″ align=”center” bgcolor=”#FFFFFF” width=”100%” style=”max-width: 600px; border-radius: 5px;” class=”body_bg”>

    <!– 1 Column Text : BEGIN –>
    <tr>
    <td>
    <table role=”presentation” cellspacing=”0″ cellpadding=”0″ border=”0″ width=”100%”>
    <tr>
    <td style=”padding: 20px; font-family: sans-serif; mso-height-rule: exactly; line-height: 24px; color: #555555; font-size: 15px” class=”body_text_color body_text_size”>
    <span style=”font-weight: bold; font-size: 20px” class=”welcome”>Hi djzah,</span>
    <hr color=”#F7F3F0″>
    <p>cowboydenny has invited you to join the group: Davison Schools.</p>
    <p>{{{group.invite_message}}}</p>
    <p>{{{group.small_card}}}</p>
    <p>Click here to manage this and all other pending group invites.</p>

    </td>
    </tr>
    </table>
    </td>
    </tr>
    <!– 1 Column Text : BEGIN –>

    </table>
    <!– Email Body : END –>

    <!– Email Footer : BEGIN –>
    <br>
    <table role=”presentation” cellspacing=”0″ cellpadding=”0″ border=”0″ align=”left” width=”100%” style=”max-width: 600px; border-radius: 5px;” bgcolor=”#F7F3F0″ class=”footer_bg”>
    <tr>
    <td style=”padding: 20px; width: 100%; font-size: 12px; font-family: sans-serif; mso-height-rule: exactly; line-height: 19px; text-align: left; color: #525252; word-break: break-all;” class=”footer_text_color footer_text_size”>

    <span class=”footer_text”>© 2025 EventGuyZ · Privacy Policy</span>
    <br><br>
    unsubscribe

    </td>
    </tr>
    </table>
    <!– Email Footer : END –>

    <!–[if mso]>
    </td>
    </tr>
    </table>
    <![endif]–>
    </div>
    </center>
    </td></tr></table>
    </body>
    </html>

    –b1=_VnBAQbgvSh8UjR1aLzyz4BWTEkdROmCcCUwfbtlIRc–

  • Keymaster
    (BuddyDev Team)
    Posts: 24881
    Brajesh Singh on #55201

    Hi,
    Thank you for the question.

    You may use an email designer or email customizer plugin.

    Here is one that supports BuddyPress.
    https://wordpress.org/plugins/wp-html-mail/

    It should allows you to customize it a bit better.

    PS:- You have shared markup which is aimed at email clients(and most email clients support html).

    Regards
    Brajesh

  • Participant
    Level: Initiated
    Posts: 2
    DJ ZAH on #55209

    Thanks for the advice. I opened the email with Apple Mail which processes html on other emails but its not from Buddypress, at least based on the Group Invite email.

    I checked out your suggestion for WP HTML Mail but it doesn’t support MDJM Event Manager (its for my DJs) and we use Sendgrid with the WP Mail SMTP plugin.

    Do you have any other suggestions to make email look clean?

  • Keymaster
    (BuddyDev Team)
    Posts: 24881
    Brajesh Singh on #55221

    Hi,
    I am sorry, In that case you can override BuddyPress’s email template to your liking by editing a copy in your child theme. I don’t see any ready made solution.

    Regards
    Brajesh

You must be logged in to reply to this topic.

This topic is: not resolved