Woodlands.co.uk Component Library

Call to Action Form: Subscribe to Blog

Call to Action Forms

Different types of forms which include email subscription, blog subscription and basic search call to action.

<form action="" method="GET" class="form form--cta form--cta--alt form--cta--blog form--cta--box">

    <div class="form--cta__container">
        <label for="form--cta__field-id" class="form__label form__title">Subscribe to our blog</label>

        <label for="form--cta__field-id" class="form__subtitle">We’ll email you with every new article</label>

        <div class="form__group">
            <input type="text" id="form--cta__field-id" name="field" placeholder="Enter email address…" />
            <button class="button button--green button--green--dark ">
                <span>Subscribe</span>
            </button>

        </div>
    </div>
</form>
 
<form action="" method="GET" class="form {{modifier 'form--cta' form.modifiers}}">
    {{#if form.drawing }}
    <div class="form--cta__image">
        {{ render '@drawing' }}
    </div>
    {{/if}}

    <div class="form--cta__container">
        <label for="form--cta__field-id" class="form__label form__title">{{ form.label }}</label>

        {{#if form.sub }}
        <label for="form--cta__field-id" class="form__subtitle">{{ form.sub }}</label>
        {{/if}}

        <div class="form__group">
            <input type="text" id="form--cta__field-id" name="field" placeholder="{{ form.placeholder }}" />
            {{ render '@button' button merge=true }}
        </div>
    </div>
</form>