diff --git a/mkdocs/.cache/plugin/social/a0e08f718467ae7b80a2d7c04439534f.png b/mkdocs/.cache/plugin/social/a0e08f718467ae7b80a2d7c04439534f.png new file mode 100644 index 0000000..a0055d7 Binary files /dev/null and b/mkdocs/.cache/plugin/social/a0e08f718467ae7b80a2d7c04439534f.png differ diff --git a/mkdocs/docs/cm/apps/listmonk.md b/mkdocs/docs/cm/apps/listmonk.md index e9e0e13..4782740 100644 --- a/mkdocs/docs/cm/apps/listmonk.md +++ b/mkdocs/docs/cm/apps/listmonk.md @@ -1,5 +1,9 @@ # Listmonk: Self-Hosted Newsletter & Mailing List Manager +The following content is provided by a third-party. For BNKops setup-guide for Listmonk: + +[Listmonk Guide](../guides/listmonk.md){ .md-button } + Listmonk is a powerful, self-hosted newsletter and mailing list manager. It gives you complete control over your email campaigns, subscriber data, and messaging without relying on third-party services that might have restrictive terms, high costs, or data privacy concerns. It's ideal for building and engaging with your community. ## Key Features diff --git a/mkdocs/docs/cm/guides/generate.png b/mkdocs/docs/cm/guides/generate.png new file mode 100644 index 0000000..4a5dbc9 Binary files /dev/null and b/mkdocs/docs/cm/guides/generate.png differ diff --git a/mkdocs/docs/cm/guides/image-1.png b/mkdocs/docs/cm/guides/image-1.png new file mode 100644 index 0000000..63e0b59 Binary files /dev/null and b/mkdocs/docs/cm/guides/image-1.png differ diff --git a/mkdocs/docs/cm/guides/image.png b/mkdocs/docs/cm/guides/image.png new file mode 100644 index 0000000..18d4bce Binary files /dev/null and b/mkdocs/docs/cm/guides/image.png differ diff --git a/mkdocs/docs/cm/guides/listmonk-editor.png b/mkdocs/docs/cm/guides/listmonk-editor.png new file mode 100644 index 0000000..e30dba2 Binary files /dev/null and b/mkdocs/docs/cm/guides/listmonk-editor.png differ diff --git a/mkdocs/docs/cm/guides/listmonk-general.png b/mkdocs/docs/cm/guides/listmonk-general.png new file mode 100644 index 0000000..8886c22 Binary files /dev/null and b/mkdocs/docs/cm/guides/listmonk-general.png differ diff --git a/mkdocs/docs/cm/guides/listmonk-settings.png b/mkdocs/docs/cm/guides/listmonk-settings.png new file mode 100644 index 0000000..14c5188 Binary files /dev/null and b/mkdocs/docs/cm/guides/listmonk-settings.png differ diff --git a/mkdocs/docs/cm/guides/listmonk.md b/mkdocs/docs/cm/guides/listmonk.md new file mode 100644 index 0000000..b2047e3 --- /dev/null +++ b/mkdocs/docs/cm/guides/listmonk.md @@ -0,0 +1,160 @@ +# Listmonk Guide + +All the following is a guide for setting up your Listmonk for newsletter management. + +## General Settings + +To start with Listmonk we need to start with setting our general settings. Setting your base url (listmonk.[your-domain.com]) and your newsletter email are the first steps. + +![alt text](listmonk-general.png) + +![alt text](save-listmonk.png) + +## SMTP / Email Configuration + +BNKops uses Proton Mail for our SMTP services and so this guide will outline how to use Listmonk with Proton. Free email SMTP services can be obtained with any major corporate provider however we do recommend using a paid service if possible. + +## Proton SMTP Keys: + +We need to generate SMTP tokens from Proton for Listmonk. + +Once logged into your Proton mail account, you want to navigate to the SMTP settings. To do so you click the `cog` - All settings - IMAP/SMTP - Generate token + +![alt text](proton-smtp.png) + +Make sure to set a email for your newsletter specifically: + +![alt text](generate.png) + +Login to Listmonk and navigate to the Settings - Settings - SMTP page: + +![alt text](listmonk-settings.png) + +Input your settings and **set `Auth Protocol` to plain** + +![alt text](image.png) + +Test your connection and `Save`. + +## Appearance + +### Email Templates + +You can change your email templates with Listmonks built in editor or ask a LLM to create you a custom one: + +To create one using the in-built editor, go to Templates - New and then select Visual: + +![alt text](listmonk-editor.png) + +### Site Colors + +You can update Listmonk sitewide colors by navitaging to Settings - Settings - Appearance and updating the CSS. + +![alt text](image-1.png) + +You can ask a LLM to update BNKops css as well: + +``` +body, html { + background-color: #4A148C !important; /* Deep purple background */ + color: #FFFFFF !important; + font-family: Arial, sans-serif !important; +} +.public { + background-color: #4A148C !important; /* Deep purple background */ +} +.container { + max-width: 600px !important; + margin: 20px auto !important; + padding: 30px !important; + background-color: #673AB7 !important; /* Lighter purple for container */ + border-radius: 8px !important; + box-shadow: 0 0 20px rgba(0,0,0,0.3) !important; +} +.logo { + display: none !important; +} +h1, h2, h3 { + color: #F7A8B8 !important; /* Trans flag pink for headings */ +} +h1 { + font-size: 28px !important; + text-align: center !important; + margin-bottom: 20px !important; + font-weight: bold !important; +} +label { + color: #FFFFFF !important; + font-weight: bold !important; +} +input[type="text"], input[type="email"], textarea { + background-color: #512DA8 !important; /* Slightly darker purple for inputs */ + border: 1px solid #8E6CD8 !important; /* Lighter purple for borders */ + color: #FFFFFF !important; + padding: 12px !important; + border-radius: 4px !important; + width: 100% !important; + box-sizing: border-box !important; + margin-bottom: 15px !important; + font-size: 16px !important; +} +.btn, button[type="submit"] { + background-color: #55CDFC !important; /* Trans flag blue for buttons */ + color: #000000 !important; /* Black text for readability */ + padding: 12px 20px !important; + border: none !important; + border-radius: 4px !important; + cursor: pointer !important; + font-weight: bold !important; + width: 100% !important; + margin-top: 15px !important; + font-size: 16px !important; + transition: background-color 0.3s !important; + text-shadow: 0 0 1px rgba(255,255,255,0.5) !important; /* Subtle text shadow for legibility */ +} +.btn:hover, button[type="submit"]:hover { + background-color: #7BD4FF !important; /* Lighter blue on hover */ +} +footer { + display: none !important; +} +.checkbox-list label { + color: #FFFFFF !important; + font-weight: normal !important; + display: inline !important; +} +/* Updated link styles to match branding */ +a { + color: #F7A8B8 !important; /* Trans flag pink for links */ + text-decoration: none !important; +} +a:hover { + text-decoration: underline !important; +} +/* Make sure links in specific contexts maintain the branding */ +.content a, +.page-content a, +.message-content a { + color: #F7A8B8 !important; /* Trans flag pink for links */ + text-decoration: none !important; +} +.content a:hover, +.page-content a:hover, +.message-content a:hover { + text-decoration: underline !important; +} +.mailing-list-archive { + text-align: right !important; + margin-top: 15px !important; +} +.form-group { + margin-bottom: 20px !important; +} +input[type="checkbox"] { + margin-right: 5px !important; + accent-color: #55CDFC !important; /* Trans flag blue for checkboxes */ +} +::placeholder { + color: #B39DDB !important; /* Light purple for placeholders */ +} +``` \ No newline at end of file diff --git a/mkdocs/docs/cm/guides/proton-smtp.png b/mkdocs/docs/cm/guides/proton-smtp.png new file mode 100644 index 0000000..3f92b96 Binary files /dev/null and b/mkdocs/docs/cm/guides/proton-smtp.png differ diff --git a/mkdocs/docs/cm/guides/save-listmonk.png b/mkdocs/docs/cm/guides/save-listmonk.png new file mode 100644 index 0000000..e2830b8 Binary files /dev/null and b/mkdocs/docs/cm/guides/save-listmonk.png differ diff --git a/mkdocs/docs/overrides/home.html b/mkdocs/docs/overrides/home.html index d44cab6..7f5b7ad 100644 --- a/mkdocs/docs/overrides/home.html +++ b/mkdocs/docs/overrides/home.html @@ -16,7 +16,7 @@
Browse Resources - About BNKops + About BNKops
diff --git a/mkdocs/mkdocs.yml b/mkdocs/mkdocs.yml index b8da7ba..b9c5513 100755 --- a/mkdocs/mkdocs.yml +++ b/mkdocs/mkdocs.yml @@ -76,6 +76,7 @@ nav: - Guides: - Overview: cm/guides/index.md - Authoring Content: cm/guides/authoring-content.md + - Listmonk: cm/guides/listmonk.md - Using Ollama in VS Code: cm/guides/ollama-vscode.md - Quick Commands: quick-commands.md - Archive: diff --git a/mkdocs/site/index.html b/mkdocs/site/index.html index 2aa03b7..1b74dc6 100644 --- a/mkdocs/site/index.html +++ b/mkdocs/site/index.html @@ -5722,7 +5722,7 @@ New website! Heck yeah!
Browse Resources - About BNKops + About BNKops
diff --git a/mkdocs/site/overrides/home.html b/mkdocs/site/overrides/home.html index d44cab6..7f5b7ad 100644 --- a/mkdocs/site/overrides/home.html +++ b/mkdocs/site/overrides/home.html @@ -16,7 +16,7 @@
Browse Resources - About BNKops + About BNKops