forestryio / hugo-theme-novela

Novela, the simplest way to start publishing with Hugo and Forestry.
https://hugo-novela-forestry.netlify.app/
MIT License
360 stars 192 forks source link

Subscription integration problem #82

Open afrizalhabibi opened 2 years ago

afrizalhabibi commented 2 years ago

Hi, thanks for your amazing theme, I have problem with subscription problem, i cannot understand how to integration my formspree email on this theme. Could you help me to explain it?

stephenajulu commented 2 years ago

Personal advice. Replace the one provided and use this.

<section id="subscriptionSection" class="section narrow">
    <div class="subscription-container">
        <div class="subscription-content">
            <h3 class="subscription-heading">
                Join our email list and get notified about new content
            </h3>
            <p class="subscription-text">
                Be the first to receive our latest content with the ability to
                opt-out at anytime. We promise to not spam your inbox or share your
                email with any third parties.
            </p>
            <form id="subscriptionForm" class="subscription-form" action="{{ .Site.Params.formaction }}" method="POST">
                <input
                  id="emailInput"
                  class="subscription-input"
                  placeholder="your@email.com"
                  name="email"
                  type="email"
                  required
                  pattern="^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$"
                />
                <button id="submitButton"
                  class="submit-button"
                  type="submit"
                >
                    Subscribe
                </button>
                <div class="subscription-error-message">
                    The email you entered is not valid.
                </div>
            </form>
        </div>
    </div>
</section>

{{ $script := resources.Get "js/addFormStyles.js" }}
<script src="{{ $script.RelPermalink }}"></script>

Remember to add formaction under params in the config file, like this

params:
  formaction: https://formspree.io/f/exmple