<div class="newsletter-form" data-module="newsletterForm" data-api-endpoint="http://ti-dev-web.hugoandcat.dev/api/sitecore/customform/subscribe" data-news-letter-signup="" data-preload="true">
    <h3 class="newsletter-form__title">Newsletter</h3>
    <p class="newsletter-form__subtitle">Subscribe to our monthly newsletter and get the best offers, holiday ideas and unmissable events.</p>
    <form class="newsletter-form__form js-newsletter-form" action="" method="GET">
        <label class="newsletter-form__label" for="title">Title</label>
        <div class="newsletter-form__group">
            <div class="newsletter-form__input-group newsletter-form__input-group--select">
                <div class="newsletter-form__select">
                    <select id="title" name="title" class="js-newsletter-salutations-input">
                        <option value="">Title</option>
                        <option value="Lieutenant">Lieutenant</option>
                        <option value="Brigadier">Brigadier</option>
                        <option value="Colonel">Colonel</option>
                        <option value="Admiral">Admiral</option>
                    </select>
                </div>
                <div class="tooltip" data-module="tooltip">
                    <div class="tooltip__inner">
                        <div class="tooltip__icon tooltip__icon--info tooltip__toggle"></div>
                    </div>
                    <div class="tooltip__tooltip ">
                        <p class="tooltip__tooltip-content">And what is it exactly that we should know you as?</p>
                        <div class="tooltip__icon tooltip__icon--close tooltip__close"></div>
                    </div>
                </div>
            </div>
            <div class="newsletter-form__input-group">
                <label class="newsletter-form__label" for="first_name">First name</label>
                <input class="newsletter-form__input js-newsletter-first-name-input" type="text" id="first_name" name="first_name" autocomplete="off" placeholder="First name" pattern="[A-Za-z0-9 ,.]+" title="Please avoid using special characters except for period and comma." required />
                <div class="tooltip" data-module="tooltip">
                    <div class="tooltip__inner">
                        <div class="tooltip__icon tooltip__icon--info tooltip__toggle"></div>
                    </div>
                    <div class="tooltip__tooltip ">
                        <p class="tooltip__tooltip-content">This is your name, the first bit, like &#x27;James&#x27; in &#x27;James Bond&#x27;</p>
                        <div class="tooltip__icon tooltip__icon--close tooltip__close"></div>
                    </div>
                </div>
            </div>
            <div class="newsletter-form__input-group">
                <label class="newsletter-form__label" for="last_name">Last name</label>
                <input class="newsletter-form__input js-newsletter-surname-input" type="text" id="last_name" name="last_name" autocomplete="off" placeholder="Last name" pattern="[A-Za-z0-9 ,.]+" title="Please avoid using special characters except for period and comma." required />
                <div class="tooltip" data-module="tooltip">
                    <div class="tooltip__inner">
                        <div class="tooltip__icon tooltip__icon--info tooltip__toggle"></div>
                    </div>
                    <div class="tooltip__tooltip ">
                        <p class="tooltip__tooltip-content">This is your last name, the last bit, like &#x27;Twotts&#x27; in &#x27;Felicity Twotts&#x27;</p>
                        <div class="tooltip__icon tooltip__icon--close tooltip__close"></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="newsletter-form__group">
            <div class="newsletter-form__input-group">
                <label class="newsletter-form__label" for="email">Email address</label>
                <input class="newsletter-form__input js-newsletter-email-input" type="text" id="email" name="email" autocomplete="off" placeholder="Email address" pattern="[^<>]*" title="Please avoid using > or < symbols in details." required />
                <div class="tooltip" data-module="tooltip">
                    <div class="tooltip__inner">
                        <div class="tooltip__icon tooltip__icon--info tooltip__toggle"></div>
                    </div>
                    <div class="tooltip__tooltip ">
                        <p class="tooltip__tooltip-content">This is like a postal address but its for posting Electronic messages. The future is here and it might actually save the trees!</p>
                        <div class="tooltip__icon tooltip__icon--close tooltip__close"></div>
                    </div>
                </div>
            </div>
        </div>
        <label class="newsletter-form__label" for="email"></label>
        <input class="newsletter-form__inputemail2 js-newsletter-inputemail2" type="email" id="email2" name="email2" autocomplete="do-not-autocomplete-asdflaskd" placeholder="" />
        <p class="newsletter-form__message newsletter-form__message--error js-newsletter-error"><span class="newsletter-form__icon"></span></p>
        <p class="newsletter-form__message newsletter-form__message--error js-newsletter-api-error"><span class="newsletter-form__icon"></span>Something went wrong...</p>
        <p class="newsletter-form__message newsletter-form__message--success js-newsletter-success"><span class="newsletter-form__icon"></span>Success! Thank you for subscribing to our newsletter.</p>
        <div class="newsletter-form__group newsletter-form__checkboxes">
            <div class="newsletter-form__input-group newsletter-form__checkbox-group">
                <input type="checkbox" id="agree" value="" class="newsletter-form__checkbox input-checkbox is-default js-newsletter-checkbox-input" required>
                <label class="newsletter-form__disclaimer" for="agree">
                    <div class="richtext ">
                        <p>I understand that by signing up, I will receive personalised email content based on my use of Tourism Ireland’s website, emails and Tourism Ireland’s advertising on other websites, cookies and tracking pixels. You can unsubscribe at any time by clicking 'unsubscribe' in our emails. Find our more information on “How we handle your personal data” in our <a href='#'>privacy terms</a>.</p>
                    </div>
                </label>
            </div>
            <div class="newsletter-form__input-group newsletter-form__checkbox-group">
                <input type="checkbox" id="third-party-sign-up" value="false" class="newsletter-form__checkbox input-checkbox is-default js-third-party-sign-up">
                <label class="newsletter-form__disclaimer" for="third-party-sign-up">
                    <div class="richtext ">
                        <p>I would like to receive information and special offers by email from carefully selected travel partners. For more information please see our <a href='#'>privacy policy</a>.</p>
                    </div>
                </label>
            </div>
        </div>
        <button class="button-p1 button-p1--with-icon newsletter-form__button js-newsletter-submit" disabled>Subscribe</button>
    </form>
</div>
<div class="newsletter-form" data-module="newsletterForm" data-api-endpoint="{{form.apiEndpoint}}"
    data-news-letter-signup="{{newsLetterSignup}}" data-preload="{{preload}}">
    <h3 class="newsletter-form__title">{{title}}</h3>
    <p class="newsletter-form__subtitle">{{subtitle}}</p>
    <form class="newsletter-form__form js-newsletter-form" action="" method="GET">
        <label class="newsletter-form__label" for="title">{{form.salutationPlaceholderText}}</label>
        <div class="newsletter-form__group">
            {{#if form.salutations}}
            <div class="newsletter-form__input-group newsletter-form__input-group--select">
                <div class="newsletter-form__select">
                    <select id="title" name="title" class="js-newsletter-salutations-input">
                        <option value="">{{form.salutationPlaceholderText}}</option>
                        {{#each form.salutations}}
                            <option value="{{value}}">{{name}}</option>
                        {{/each}}
                    </select>
                </div>
                    {{#if form.salutationToolTip}}
                        {{> @cp-tooltip form.salutationToolTip}}
                    {{/if}}
            </div>
            {{/if}}
            <div class="newsletter-form__input-group">
                <label class="newsletter-form__label" for="first_name">{{form.firstNamePlaceholderText}}</label>
                <input class="newsletter-form__input js-newsletter-first-name-input" type="text" id="first_name" name="first_name"  autocomplete="off" placeholder="{{form.firstNamePlaceholderText}}" pattern="[A-Za-z0-9 ,.]+" title="Please avoid using special characters except for period and comma." required />
                {{#if form.firstNameToolTip}}
                        {{> @cp-tooltip form.firstNameToolTip}}
                {{/if}}
            </div>
            <div class="newsletter-form__input-group">
                <label class="newsletter-form__label" for="last_name">{{form.surnamePlaceholderText}}</label>
                <input class="newsletter-form__input js-newsletter-surname-input" type="text" id="last_name" name="last_name"  autocomplete="off" placeholder="{{form.surnamePlaceholderText}}" pattern="[A-Za-z0-9 ,.]+" title="Please avoid using special characters except for period and comma." required />
                {{#if form.surnameToolTip}}
                        {{> @cp-tooltip form.surnameToolTip}}
                {{/if}}
            </div>
        </div>
        <div class="newsletter-form__group">
            <div class="newsletter-form__input-group">
                <label class="newsletter-form__label" for="email">{{form.emailPlaceholderText}}</label>
                <input class="newsletter-form__input js-newsletter-email-input" type="text" id="email" name="email"  autocomplete="off" placeholder="{{form.emailPlaceholderText}}" pattern="[^<>]*" title="Please avoid using > or < symbols in details." required />
                {{#if form.emailToolTip}}
                        {{> @cp-tooltip form.emailToolTip}}
                {{/if}}
            </div>
        </div>
        <label class="newsletter-form__label" for="email">{{form.placeholderText}}</label>
        <input class="newsletter-form__inputemail2 js-newsletter-inputemail2" type="email" id="email2" name="email2"
        autocomplete="do-not-autocomplete-asdflaskd" placeholder="{{form.placeholderText}}" />
        <p class="newsletter-form__message newsletter-form__message--error js-newsletter-error"><span class="newsletter-form__icon"></span>{{form.errorMessage}}</p>
        <p class="newsletter-form__message newsletter-form__message--error js-newsletter-api-error"><span class="newsletter-form__icon"></span>{{form.apiErrorMessage}}</p>
        <p class="newsletter-form__message newsletter-form__message--success js-newsletter-success"><span class="newsletter-form__icon"></span>{{form.successMessage}}</p>
        <div class="newsletter-form__group newsletter-form__checkboxes">
            {{#if disclaimerText }}
                <div class="newsletter-form__input-group newsletter-form__checkbox-group">
                    <input type="checkbox" id="agree" value="" class="newsletter-form__checkbox input-checkbox is-default js-newsletter-checkbox-input" required>
                    <label class="newsletter-form__disclaimer" for="agree">{{> @cp-text-richtext disclaimerText}}</label>
                </div>
            {{/if}}
            {{#if thirdPartySignUp }}
                <div class="newsletter-form__input-group newsletter-form__checkbox-group">
                    <input type="checkbox" id="third-party-sign-up" value="false" class="newsletter-form__checkbox input-checkbox is-default js-third-party-sign-up">
                    <label class="newsletter-form__disclaimer" for="third-party-sign-up">{{> @cp-text-richtext thirdPartySignUp}}</label>
                </div>
            {{/if}}
        </div>
        <button class="button-p1 button-p1--with-icon newsletter-form__button js-newsletter-submit" disabled>{{form.button.text}}</button>
    </form>
</div>
{
  "preload": true,
  "title": "Newsletter",
  "subtitle": "Subscribe to our monthly newsletter and get the best offers, holiday ideas and unmissable events.",
  "disclaimerText": {
    "content": "<p>I understand that by signing up, I will receive personalised email content based on my use of Tourism Ireland’s website, emails and Tourism Ireland’s advertising on other websites, cookies and tracking pixels. You can unsubscribe at any time by clicking 'unsubscribe' in our emails. Find our more information on “How we handle your personal data” in our <a href='#'>privacy terms</a>.</p>"
  },
  "thirdPartySignUp": {
    "content": "<p>I would like to receive information and special offers by email from carefully selected travel partners. For more information please see our <a href='#'>privacy policy</a>.</p>"
  },
  "form": {
    "apiEndpoint": "http://ti-dev-web.hugoandcat.dev/api/sitecore/customform/subscribe",
    "salutations": [
      {
        "name": "Lieutenant",
        "value": "Lieutenant"
      },
      {
        "name": "Brigadier",
        "value": "Brigadier"
      },
      {
        "name": "Colonel",
        "value": "Colonel"
      },
      {
        "name": "Admiral",
        "value": "Admiral"
      }
    ],
    "salutationPlaceholderText": "Title",
    "salutationToolTip": {
      "content": "And what is it exactly that we should know you as?"
    },
    "firstNamePlaceholderText": "First name",
    "firstNameToolTip": {
      "content": "This is your name, the first bit, like 'James' in 'James Bond'"
    },
    "surnamePlaceholderText": "Last name",
    "surnameToolTip": {
      "content": "This is your last name, the last bit, like 'Twotts' in 'Felicity Twotts'"
    },
    "emailPlaceholderText": "Email address",
    "emailToolTip": {
      "content": "This is like a postal address but its for posting Electronic messages. The future is here and it might actually save the trees!"
    },
    "emailErrorMessage": "Email format incorrect",
    "requiredErrorMessage": "Fields can not be blank",
    "apiErrorMessage": "Something went wrong...",
    "successMessage": "Success! Thank you for subscribing to our newsletter.",
    "button": {
      "text": "Subscribe",
      "url": "#"
    }
  }
}

There are no notes for this item.