chima
November 13, 2024, 4:28am
1
Purpose of thread: This is where we can keep all information regarding our email/newsletter hosting. If you have suggestions, edits, or questions, please leave them in this thread.
We are currently using ActionNetwork for our emails. Each email we send out uses a header/footer template so that the footer has the required disclosures/unsubscribe links. We should probably move away from ActionNetwork considering how close they work with the Democratic Party, but we should be able to reuse the html for emails in the future as well.
-coming soon-
1 Like
chima
November 13, 2024, 4:43am
2
2024-11-12T08:00:00Z :
Included alt="Working Class Unity Logo" to the logo image.
Moved Elements into New Order:
Placed new buttons (“Join Us” and “Calendar”) at the top of the footer.
Followed by social media icons, including a newly added Instagram icon.
Centered contact email below the social icons.
Updated the footer text.
Moved “Paid for by Working Class Unity” box to the bottom.
<!-- Email Wrapper Table -->
<table border="0" cellpadding="10" cellspacing="0" style="width: 100%; max-width: 600px; margin: auto; border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt;">
<tr>
<!-- Main Content Container -->
<td valign="top" style="background-color: #FFFFFF; padding: 10px 10px 40px;">
<!-- Inner Table for Content -->
<table border="0" cellpadding="10" cellspacing="0" style="width: 100%; border-collapse: collapse;">
<tr>
<!-- Logo Section -->
<td valign="top" style="width: 100%; text-align: center;">
<div style="color: #505050; font-family: Arial, sans-serif; font-size: 17px; line-height: 140%; text-align: center;">
<!-- WCU Logo -->
<img src="https://s3.amazonaws.com/can2-unlayer/1684964197120-WCU_Email_Header.png" alt="Working Class Unity Logo" style="height: 150px; max-width: 100%; display: block; margin: auto;">
</div>
</td>
</tr>
<tr>
<!-- Email Body Content Starts -->
<td valign="top" style="width: 100%;">
<div style="color: #505050; font-family: Arial, sans-serif; font-size: 17px; line-height: 140%; text-align: left;">
<!-- Email content starts here -->
<!-- Email content ends here -->
</div>
</td>
</tr>
</table>
<!-- Footer starts here -->
<div style="text-align: center; margin-top: 40px; padding-top: 15px; border-top: 2px solid #ececec; max-width: 600px; margin-left: auto; margin-right: auto; font-weight: 400; font-size: 13px; line-height: 130%; font-family: Arial, sans-serif; color: #505050;">
<!-- Buttons -->
<table align="center" border="0" cellpadding="0" cellspacing="0" style="margin-bottom: 20px;">
<tr>
<td>
<a href="https://workingclassunity.com/register/" style="background-color: #04334f; color: #ffffff; padding: 10px 20px; text-decoration: none; font-size: 16px; font-family: Arial, sans-serif; display: inline-block; border-radius: 4px;">
Join Us
</a>
</td>
<td width="10"> </td> <!-- Spacer -->
<td>
<a href="https://workingclassunity.com/calendar/" style="background-color: #04334f; color: #ffffff; padding: 10px 20px; text-decoration: none; font-size: 16px; font-family: Arial, sans-serif; display: inline-block; border-radius: 4px;">
Calendar
</a>
</td>
</tr>
</table>
<!-- Social Media Icons -->
<table style="width: auto; max-width: 325px; margin: 0 auto; padding-bottom: 10px;" cellspacing="0" cellpadding="0">
<tr>
<td style="text-align: center;">
<a href="https://www.facebook.com/WorkClassUnity">
<img src="https://actionnetwork.org/user_files/user_files/000/048/524/original/fb-icon.png" alt="Like on Facebook" style="height: 36px; width: 36px; border: 0;">
</a>
</td>
<td width="10"> </td> <!-- Spacer -->
<td style="text-align: center;">
<a href="https://twitter.com/WorkClassUnity">
<img src="https://actionnetwork.org/user_files/user_files/000/048/526/original/tw-icon.png" alt="Follow on Twitter" style="height: 36px; width: 36px; border: 0;">
</a>
</td>
<td width="10"> </td> <!-- Spacer -->
<td style="text-align: center;">
<a href="https://www.instagram.com/workingclassunity/">
<img src="https://actionnetwork.org/user_files/user_files/000/115/655/original/Instagram_Image.png" alt="Follow on Instagram" style="height: 36px; width: 36px; border: 0;">
</a>
</td>
</tr>
</table>
<!-- Contact Email -->
<p style="font-family: Arial, sans-serif; font-size: 14px; margin: 20px 0;">
Email us: <a href="mailto:info@workingclassunity.com" style="color: #04334f; text-decoration: none;">info@workingclassunity.com</a>
</p>
<!-- Footer Text -->
<p style="font-family: Arial, sans-serif; font-size: 14px;">
This email was sent to {{ Email | default: 'your email' }}. Email is <strong>the</strong> most important way we keep in touch with you for updates and ways to get involved, so thank you for reading.
</p>
<p style="font-family: Arial, sans-serif; font-size: 14px;">
Send us mail: Working Class Unity P.O. Box 8596 Stockton, CA 95208
</p>
<!-- Update Info and Unsubscribe Links -->
<p style="font-family: Arial, sans-serif; font-size: 14px; margin: 20px 0;">
<a href="https://actionnetwork.org/forms/did-your-contact-information-change/" style="color: #04334f; text-decoration: none;">Update My Personal Information</a>
</p>
<p style="font-family: Arial, sans-serif; font-size: 14px;">
<a href="{{ UnsubscribeLink }}" style="color: #04334f; text-decoration: none;">Unsubscribe</a>
</p>
<!-- Paid for by Working Class Unity Box -->
<p style="font-family: Arial, sans-serif; width: 100%; max-width: 350px; color: #04334f; border: 1px solid #04334f; font-weight: 400; box-sizing: border-box; padding: 10px; margin: 20px auto; text-align: center; line-height: 1;">
Paid for by Working Class Unity
</p>
</div>
<!--[if mso]>
</td>
</tr>
</table>
</center>
<![endif]-->
</td>
</tr>
</table>
Updated appearance:
