add newsletter subscription

Author: loiclefloch

_config.yml

@@ -5,7 +5,7 @@
 # Site
 title: Loïc Lefloch
 subtitle: ""
-description: ""
+description: "Monthly newsletter and regular blog posts, delivering the latest tech trends, insights, and curated content all in one place."
 keywords:
 author: Loïc Lefloch
 language: en

source/_posts/make-gmail-readable.md

@@ -3,7 +3,7 @@ title: Make Gmail Readable
 date: 2025-02-25 23:03:00
 category: TIL
 permalink: /make-gmail-readable/
-description: "TODO"
+description: "Make Gmail readable"
 lang: en
 tags: 
 ---

source/_posts/the-case-of-vanishing-pages.md

@@ -3,7 +3,7 @@ title: "The Case of the Vanishing Pages: Debugging an Elusive React Bug"
 date: 2025-02-05 20:13:00
 permalink: /the-case-of-vanishing-pages/
 category: Post mortem
-description: ""
+description: "A post mortem on an illusive bug when deploying an SPA app into production"
 lang: en
 ---
 

source/subscribe.md

@@ -0,0 +1,4 @@
+---
+title: Subscribe
+layout: subscribe
+---

themes/cactus/_config.yml

@@ -15,7 +15,8 @@ direction: ltr
 # languages/*.yml
 nav:
   home: /
-#  Articles: /archives/
+  Subscribe: /subscribe
+  #  Articles: /archives/
   A propos: /about/
 #  Projets: https://github.com/loiclefloch
   Rechercher: /search/
@@ -27,12 +28,12 @@ nav:
 # You can optionally add a 'label' key to set the title attribute on the link.
 # 'icon' value will be used as title when 'label' is missing.
 social_links:
-  - icon: bluesky
-    link: https://bsky.app/profile/loiclefloch.dev
   - icon: linkedin
     link: https://www.linkedin.com/in/loiclefloch
   - icon: github
     link: http://github.com/loiclefloch
+  - icon: bluesky
+    link: https://bsky.app/profile/loiclefloch.dev
 
 # Customize the overview with displaying a tagcloud on the index page.
 # Options: https://hexo.io/docs/helpers.html#tagcloud

themes/cactus/layout/_partial/buy_me_coffee.ejs

@@ -0,0 +1,6 @@
+<script src="https://loiclefloch.kit.com/commerce.js" async defer></script>
+<div style="text-align: center;">
+  <a class="convertkit-button" href="https://loiclefloch.kit.com/products/loiclefloch" data-commerce>
+    Buy me a coffee
+  </a>
+</div>

themes/cactus/layout/_partial/scripts.ejs

@@ -80,8 +80,8 @@
   });
   </script>
 <% } %>
-<!-- Baidu Analytics -->
 <% if (theme.baidu_analytics.enabled && theme.baidu_analytics.id){ %>
+    <!-- Baidu Analytics -->
   <script type="text/javascript">
         var _hmt = _hmt || [];
         (function() {
@@ -92,12 +92,12 @@
         })();
         </script>
 <% } %>
-<!-- Cloudflare Analytics -->
 <% if (theme.cloudflare_analytics.enabled && theme.cloudflare_analytics.id){ %>
+    <!-- Cloudflare Analytics -->
   <script defer src='https://static.cloudflareinsights.com/beacon.min.js' data-cf-beacon='{"token": "<%= theme.cloudflare_analytics.id %>"}'></script>
 <% } %>
-<!-- Disqus Comments -->
 <% if (page.comments && theme.disqus.enabled && theme.disqus.shortname){ %>
+    <!-- Disqus Comments -->
     <script type="text/javascript">
         var disqus_shortname = '<%= theme.disqus.shortname %>';
 
@@ -110,8 +110,8 @@
         }());
     </script>
 <% } %>
-<!-- utterances Comments -->
 <% if (page.comments && theme.utterances.enabled && theme.utterances.repo && theme.utterances.issue_term && theme.utterances.theme){ %>
+    <!-- utterances Comments -->
     <script type="text/javascript">
       var utterances_repo = '<%= theme.utterances.repo %>';
       var utterances_issue_term = '<%= theme.utterances.issue_term %>';

themes/cactus/layout/_partial/signup.ejs

@@ -0,0 +1,37 @@
+<section class="newsletter-signup" id="signup">
+  <h2>Subscribe to my newsletter</h2>
+  <p>Get monthly updates on top tech trends, must-read blogs, insightful analysis, and key news - curated for busy tech enthusiasts.</p>
+
+  <!-- ConvertKit Form -->
+  <div class="convertkit-form">
+    <div style="border-radius: 8px; text-align: center;">
+      <script src="https://f.convertkit.com/ckjs/ck.5.js"></script>
+      <form action="https://app.kit.com/forms/8791305/subscriptions" class="seva-form formkit-form"
+            method="post" data-sv-form="8791305" data-uid="b27cf41443" data-format="inline" data-version="5"
+            data-options="{&quot;settings&quot;:{&quot;after_subscribe&quot;:{&quot;action&quot;:&quot;message&quot;,&quot;success_message&quot;:&quot;Success! Now check your email to confirm your subscription.&quot;,&quot;redirect_url&quot;:&quot;&quot;},&quot;analytics&quot;:{&quot;google&quot;:null,&quot;fathom&quot;:null,&quot;facebook&quot;:null,&quot;segment&quot;:null,&quot;pinterest&quot;:null,&quot;sparkloop&quot;:null,&quot;googletagmanager&quot;:null},&quot;modal&quot;:{&quot;trigger&quot;:&quot;timer&quot;,&quot;scroll_percentage&quot;:null,&quot;timer&quot;:5,&quot;devices&quot;:&quot;all&quot;,&quot;show_once_every&quot;:15},&quot;powered_by&quot;:{&quot;show&quot;:false,&quot;url&quot;:&quot;https://kit.com/features/forms?utm_campaign=poweredby&amp;utm_content=form&amp;utm_medium=referral&amp;utm_source=dynamic&quot;},&quot;recaptcha&quot;:{&quot;enabled&quot;:false},&quot;return_visitor&quot;:{&quot;action&quot;:&quot;show&quot;,&quot;custom_content&quot;:&quot;&quot;},&quot;slide_in&quot;:{&quot;display_in&quot;:&quot;bottom_right&quot;,&quot;trigger&quot;:&quot;timer&quot;,&quot;scroll_percentage&quot;:null,&quot;timer&quot;:5,&quot;devices&quot;:&quot;all&quot;,&quot;show_once_every&quot;:15},&quot;sticky_bar&quot;:{&quot;display_in&quot;:&quot;top&quot;,&quot;trigger&quot;:&quot;timer&quot;,&quot;scroll_percentage&quot;:null,&quot;timer&quot;:5,&quot;devices&quot;:&quot;all&quot;,&quot;show_once_every&quot;:15}},&quot;version&quot;:&quot;5&quot;}"
+            min-width="400 500 600 700 800">
+        <div data-style="clean">
+          <ul class="formkit-alert formkit-alert-error" data-element="errors" data-group="alert"></ul>
+          <div data-element="fields" data-stacked="false" class="seva-fields formkit-fields">
+            <div class="formkit-field">
+                <input class="formkit-input" name="email_address"
+                       aria-label="Email Address" placeholder="Email Address"
+                       required="" type="email"
+                       style="color: rgb(255, 255, 255); border-color: rgb(227, 227, 227); border-radius: 4px; font-weight: 400;"
+                />
+            </div>
+            <button data-element="submit" class="formkit-submit formkit-submit"
+                    style="color: rgb(255, 255, 255); background-color: rgb(147, 190, 174); border-radius: 8px; font-weight: 700;">
+              <div class="formkit-spinner">
+                <div></div>
+                <div></div>
+                <div></div>
+              </div>
+              <span class="">Subscribe</span></button>
+          </div>
+        </div>
+      </form>
+    </div>
+    <p class="unsubscribe"><em>No spam, unsubscribe anytime.</em></p>
+  </div>
+</section>

themes/cactus/layout/_partial/signup_small.ejs

@@ -0,0 +1,5 @@
+<section class="newsletter-signup-small">
+  <div style="text-align: center">
+    You can <a href="#signup">subscribe</a> to my newsletter!
+  </div>
+</section>

themes/cactus/layout/about.ejs

@@ -10,10 +10,11 @@ Consultant Tech Lead Senior @ [Octo Technology](https://octo.com/)
     <li><a href="/">Articles</a></li>
 </ul>
 
+<%- partial('_partial/buy_me_coffee') %>
 
 <%- markdown(`
 ---
 
 Powered by [Hexo.io](https://hexo.io/).
 Theme based on Cactus by [Pieter Robberechts](https://github.com/probberechts/hexo-theme-cactus).
-`) %>
+`) %>