Skip to content

Feat/support table #4

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
akfaiz merged 3 commits into from
Jul 25, 2025
Merged

Feat/support table #4

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
c96e811
separate plain theme to another tmpl and support generate table
akfaiz Jul 24, 2025
683eabc
feat: add examples
akfaiz Jul 24, 2025
10c469f
feat: update screenshot example
akfaiz Jul 24, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 13 additions & 12 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@ Go-Mailer is a Go library that wraps the [wneessen/go-mail](https://github.com/w
- **Uses Existing `mail.Client`**: Integrates with an existing `wneessen/go-mail` client for flexible configuration and reuse.
- **Fluent HTML Message Builder**: Provides a chainable API for constructing HTML emails with methods like `Subject`, `To`, `Line`, `Action`, etc.
- Attachment Support: Easily attach files from local disk, embedded filesystems, IOFS filesystems, or `io.Reader`/`io.ReadSeeker`.
- Customizable Email Content: Allows setting greetings, salutations, and product information for a personalized experience.
- Responsive HTML Template: Automatically formats emails with a clean, responsive design compatible with most email clients.
- CSS-inlined HTML: Automatically inlines CSS styles for better compatibility with email clients that strip out `<style>` tags.

Expand Down Expand Up @@ -74,19 +73,21 @@ func main() {
}
```

## Fluent HTML Message Builder
The fluent HTML message builder provides a chainable API to construct HTML emails intuitively. Key methods include:
## More Examples

- `Action(string, string)`: Adds a clickable button with a label and URL.
- `Greeting(string)`: Sets a greeting line at the top of the email.
- `Line(string)`: Adds a plain text line to the email body.
- `Linef(string, ...interface{})`: Adds a formatted line to the email body.
- `Product(mailer.Product)`: Sets product information for the email, which can be used in the footer.
- `Salutation(string)`: Sets a salutation line at the bottom of the email.
- `Theme(string)`: Sets the theme for the email. Supported themes are "default" and "plain".
You can find more examples in the [examples](examples) directory.

The builder automatically formats the email with a clean, responsive HTML template, ensuring compatibility with most email clients.
The HTML template is based on [Postmark Transactional Email Templates](https://github.com/ActiveCampaign/postmark-templates).
## Supported Themes

The following open-source themes are bundled with this package:

* `default` by [Postmark Transactional Email Templates](https://github.com/ActiveCampaign/postmark-templates)

<img src="examples/default/welcome.png" height="200" /> <img src="examples/default/reset.png" height="200" /> <img src="examples/default/receipt.png" height="200" />

* `plain` by [Postmark Transactional Email Templates](https://github.com/ActiveCampaign/postmark-templates)

<img src="examples/plain/welcome.png" height="200" /> <img src="examples/plain/reset.png" height="200" /> <img src="examples/plain/receipt.png" height="200" />

## License
This project is licensed under the MIT License. See the [LICENSE](LICENSE) file for details.
218 changes: 218 additions & 0 deletions examples/default/receipt.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,218 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta name="x-apple-disable-message-reformatting"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="color-scheme" content="light dark"/>
<meta name="supported-color-schemes" content="light dark"/>
<title>GoMailer</title>




<style type="text/css">url("https://fonts.googleapis.com/css?family=Nunito+Sans:400,700&display=swap") {

}@media only screen and (max-width: 500px){
.button {
width: 100% !important;
text-align: center !important
}
}
@media only screen and (max-width: 600px){
.email-body_inner,
.email-footer {
width: 100% !important
}
}
@media (prefers-color-scheme: dark){
body,
.email-body,
.email-body_inner,
.email-content,
.email-wrapper,
.email-masthead,
.email-footer {
background-color: #333333 !important;
color: #FFF !important
}
p,
ul,
ol,
blockquote,
h1,
h2,
h3,
span,
.purchase_item {
color: #FFF !important
}
.attributes_content,
.discount {
background-color: #222 !important
}
.email-masthead_name {
text-shadow: none !important
}
}
:root {
color-scheme: light dark !important;
supported-color-schemes: light dark !important
}</style></head>
<body style="height:100%;margin:0;-webkit-text-size-adjust:none;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;background-color:#F2F4F6;color:#51545E;width:100%">

<table class="email-wrapper" width="100%" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;margin:0;padding:0;-premailer-width:100%;-premailer-cellpadding:0;-premailer-cellspacing:0;background-color:#F2F4F6">
<tbody><tr>
<td align="center" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px">
<table class="email-content" width="100%" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;margin:0;padding:0;-premailer-width:100%;-premailer-cellpadding:0;-premailer-cellspacing:0">

<tbody><tr>
<td class="email-masthead" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px;padding:25px 0;text-align:center">
<a href="https://github.com/ahmadfaizk/go-mailer" class="f-fallback email-masthead_name" style="font-size:16px;font-weight:bold;color:#A8AAAF;text-decoration:none;text-shadow:0 1px 0 white">GoMailer</a>
</td>
</tr>


<tr>
<td class="email-body" width="570" cellpadding="0" cellspacing="0" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px;width:100%;margin:0;padding:0;-premailer-width:100%;-premailer-cellpadding:0;-premailer-cellspacing:0">
<table class="email-body_inner" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation" style="width:570px;margin:0 auto;padding:0;-premailer-width:570px;-premailer-cellpadding:0;-premailer-cellspacing:0;background-color:#FFFFFF">

<tbody><tr>
<td class="content-cell" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px;padding:45px">
<div class="f-fallback">
<h1 style="margin-top:0;color:#333333;font-size:22px;font-weight:bold;text-align:left">Hello,</h1>

<p style="margin:.4em 0 1.1875em;font-size:16px;line-height:1.625;color:#51545E">Thank you for your order!</p>






<p style="margin:.4em 0 1.1875em;font-size:16px;line-height:1.625;color:#51545E">Here are the details of your order:</p>

<table class="purchase" width="100%" cellpadding="0" cellspacing="0" style="width:100%;margin:0;padding:35px 0;-premailer-width:100%;-premailer-cellpadding:0;-premailer-cellspacing:0">
<tbody><tr>
<td style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px">
<table class="purchase_content" width="100%" cellpadding="0" cellspacing="0" style="width:100%;margin:0;padding:25px 0 0 0;-premailer-width:100%;-premailer-cellpadding:0;-premailer-cellspacing:0">
<tbody><tr>

<th class="purchase_heading" align="left" style="font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px;padding-bottom:8px;border-bottom:1px solid #EAEAEC">
<p class="f-fallback" style="line-height:1.625;margin:0;color:#85878E;font-size:12px">Item</p>
</th>

<th class="purchase_heading" align="right" style="font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px;padding-bottom:8px;border-bottom:1px solid #EAEAEC">
<p class="f-fallback" style="line-height:1.625;margin:0;color:#85878E;font-size:12px">Count</p>
</th>

<th class="purchase_heading" align="right" style="font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px;padding-bottom:8px;border-bottom:1px solid #EAEAEC">
<p class="f-fallback" style="line-height:1.625;margin:0;color:#85878E;font-size:12px">Price</p>
</th>

</tr>

<tr>


<td width="50%" class="purchase_item align-left" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;text-align:left;padding:10px 0;color:#51545E;font-size:15px;line-height:18px">
<span class="f-fallback">Widget A</span>
</td>


<td width="25%" class="purchase_item align-right" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;text-align:right;padding:10px 0;color:#51545E;font-size:15px;line-height:18px">
<span class="f-fallback">2</span>
</td>


<td width="25%" class="purchase_item align-right" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;text-align:right;padding:10px 0;color:#51545E;font-size:15px;line-height:18px">
<span class="f-fallback">$20.00</span>
</td>

</tr>

<tr>


<td width="50%" class="purchase_item align-left" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;text-align:left;padding:10px 0;color:#51545E;font-size:15px;line-height:18px">
<span class="f-fallback">Widget B</span>
</td>


<td width="25%" class="purchase_item align-right" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;text-align:right;padding:10px 0;color:#51545E;font-size:15px;line-height:18px">
<span class="f-fallback">1</span>
</td>


<td width="25%" class="purchase_item align-right" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;text-align:right;padding:10px 0;color:#51545E;font-size:15px;line-height:18px">
<span class="f-fallback">$15.00</span>
</td>

</tr>

</tbody></table>
</td>
</tr>
</tbody></table>





<p style="margin:.4em 0 1.1875em;font-size:16px;line-height:1.625;color:#51545E">Click here to view your order</p>

<table class="body-action" align="center" width="100%" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;margin:30px auto;padding:0;-premailer-width:100%;-premailer-cellpadding:0;-premailer-cellspacing:0;text-align:center">
<tbody><tr>
<td align="center" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px">
<table width="100%" border="0" cellspacing="0" cellpadding="0" role="presentation">
<tbody><tr>
<td align="center" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px">
<a href="https://example.com/order" class="f-fallback button button--primary" target="_blank" style="background-color:#3869D4;border-top:10px solid #3869D4;border-right:18px solid #3869D4;border-bottom:10px solid #3869D4;border-left:18px solid #3869D4;display:inline-block;color:#FFF;text-decoration:none;border-radius:3px;box-shadow:0 2px 3px rgba(0, 0, 0, 0.16);-webkit-text-size-adjust:none;box-sizing:border-box">View Order</a>
</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>



<p style="margin:.4em 0 1.1875em;font-size:16px;line-height:1.625;color:#51545E">If you have any questions, feel free to contact us.</p>

<p style="margin:.4em 0 1.1875em;font-size:16px;line-height:1.625;color:#51545E">Best regards,<br/>GoMailer</p>



<table class="body-sub" role="presentation" style="margin-top:25px;padding-top:25px;border-top:1px solid #EAEAEC">
<tbody><tr>
<td style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px">
<p class="f-fallback sub" style="margin:.4em 0 1.1875em;line-height:1.625;color:#51545E;font-size:13px">If you&#39;re having trouble clicking the &#34;View Order&#34; button, copy and paste
the URL below into your web browser:</p>
<p class="f-fallback sub" style="margin:.4em 0 1.1875em;line-height:1.625;color:#51545E;font-size:13px">https://example.com/order</p>
</td>
</tr>
</tbody></table>


</div>
</td>
</tr>
</tbody></table>
</td>
</tr>

<tr>
<td style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px">
<table class="email-footer" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation" style="width:570px;margin:0 auto;padding:0;-premailer-width:570px;-premailer-cellpadding:0;-premailer-cellspacing:0;text-align:center">
<tbody><tr>
<td class="content-cell" align="center" style="word-break:break-word;font-family:&#34;Nunito Sans&#34;, Helvetica, Arial, sans-serif;font-size:16px;padding:45px">
<p class="f-fallback sub align-center" style="margin:.4em 0 1.1875em;line-height:1.625;text-align:center;font-size:13px;color:#A8AAAF">© 2025 GoMailer. All rights reserved.</p>
</td>
</tr>
</tbody></table>
</td>
</tr>

</tbody></table>
</td>
</tr>
</tbody></table>

</body></html>
Binary file added examples/default/receipt.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
27 changes: 27 additions & 0 deletions examples/default/receipt.txt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
[GoMailer] ( https://github.com/ahmadfaizk/go-mailer )

************
Hello,
************

Thank you for your order!

Here are the details of your order:

Item | Count | Price
---------+-------+-------
Widget A | 2 | $20.00
Widget B | 1 | $15.00

View Order ( https://example.com/order )

If you have any questions, feel free to contact us.

Best regards,
GoMailer

If you're having trouble clicking the "View Order" button, copy and paste the URL below into your web browser:

https://example.com/order

© 2025 GoMailer. All rights reserved.
Loading