<div class="form-overlay" data-module="formOverlay" data-timeout-seconds="5" data-expiry="24" data-preload="true">
    <div class="form-overlay__container">
        <span class="form-overlay__close js-close"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21.33 21.33">
                <path d="M.39,20.94a1.33,1.33,0,0,1,0-1.88L19.06.39a1.33,1.33,0,0,1,1.88,1.89L2.28,20.94A1.34,1.34,0,0,1,.39,20.94Z" style="fill-rule:evenodd" />
                <path d="M.39.39a1.34,1.34,0,0,1,1.89,0L20.94,19.06a1.33,1.33,0,0,1-1.88,1.88L.39,2.28A1.34,1.34,0,0,1,.39.39Z" style="fill-rule:evenodd" />
            </svg></span>
        <div class="form-overlay__banner-container">
            <figure class="image js-image  " data-module="imagelazy" data-is-small-image="">
                <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="Alt Text">
                <picture class="image__container">
                    <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                    <source media="(min-width: 768px) and (max-width:1319px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                    <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                    <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="Alt Text">
                </picture>
            </figure>
        </div>
        <div class="form-overlay__form-container">
            <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="false">
                <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="Colistingonel">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>
    </div>
</div>
<div class="form-overlay" data-module="formOverlay" data-timeout-seconds="{{timeout}}" data-expiry="{{cookieExpiryHours}}" data-preload="true">
    <div class="form-overlay__container">
        <span class="form-overlay__close js-close">{{{closeIcon}}}</span>
        <div class="form-overlay__banner-container">
            {{> @cp-medium-image responsiveImage}}
        </div>
        <div class="form-overlay__form-container">
            {{> @cp-newsletter-form overlayForm}}
        </div>
    </div>
</div>
{
  "closeIcon": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 21.33 21.33\"><path d=\"M.39,20.94a1.33,1.33,0,0,1,0-1.88L19.06.39a1.33,1.33,0,0,1,1.88,1.89L2.28,20.94A1.34,1.34,0,0,1,.39,20.94Z\" style=\"fill-rule:evenodd\"/><path d=\"M.39.39a1.34,1.34,0,0,1,1.89,0L20.94,19.06a1.33,1.33,0,0,1-1.88,1.88L.39,2.28A1.34,1.34,0,0,1,.39.39Z\" style=\"fill-rule:evenodd\"/></svg>",
  "timeout": 5,
  "responsiveImage": {
    "altText": "Alt Text",
    "dominantColour": "#c9c9c9",
    "lowResolutionUrl": "https://images.unsplash.com/photo-1551819561-c69621886139?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=50&q=10",
    "sources": [
      {
        "type": "image/jpeg",
        "largeUrl": "https://images.unsplash.com/photo-1551819561-c69621886139?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80",
        "smallUrl": "https://images.unsplash.com/photo-1551819561-c69621886139?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=80"
      }
    ]
  },
  "cookieExpiryHours": 24,
  "overlayForm": {
    "preload": false,
    "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": "Colistingonel"
        },
        {
          "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.