hugo-theme-novela icon indicating copy to clipboard operation
hugo-theme-novela copied to clipboard

Subscription integration problem

Open afrizalhabibi opened this issue 2 years ago • 1 comments

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?

afrizalhabibi avatar Oct 07 '21 14:10 afrizalhabibi

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="[email protected]"
                  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

stephenajulu avatar Oct 08 '21 13:10 stephenajulu