[Tutorial] Letterbird | Contact Form

This tutorial is intended for WriteFreely users; I imagine it also works for Write.as Pro. If you need to add a contact form to your blog, you can use Letterbird, which is a freemium service without trackers that allows embedding forms in websites. Although WriteFreely does not support custom JS by default, thanks to the trick published by Inferno, we can experiment with adding some scripts. It is worth mentioning that although this script does not present any issues, the code can be optimized since it was designed by an AI :dizzy_face:.

First, you must add this to the end of the CSS code in the customization editor. Edit with your own domain and letterbird username.

/* custom CSS */
</style>
<script>
  document.addEventListener('DOMContentLoaded', function() {
    if (window.location.href === 'https://YOUR.DOMAIN/EXAMPLE-PAGE') {
      var script = document.createElement('script');
      script.src = 'https://letterbird.co/embed/v1.js';
      script.defer = true;
      script.setAttribute('data-letterbirduser', 'YOUR-USERNAME');
      script.setAttribute('data-targetelement', '#letterbird-container'); 
      document.head.appendChild(script);
    }
  });
</script>

<style type="text/css">

Finally, copy the div into the page:

<div id="letterbird-container"></div>

Here is a screenshot and you can see a demo in: Acerca de — Cri