Newsletters

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd"> <html lang="en"> <head> <meta charset="utf-8"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <link rel="shortcut icon" id="shortcutIcon" href="" type="image/x-icon"> <link rel="icon" id="favicon" href="" type="image/x-icon"> <link rel="stylesheet" type="text/css" href="https://static.advance.net/static/newsletters/css/styles.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet"> <script src="https://ak.sail-horizon.com/spm/spm.v1.min.js"></script> <script>Sailthru.init({ customerId: '6bdcf609a1a46664c627ddb792a05e3a' });</script> <script> (function (w, d, s, l, i) { w[l] = w[l] || []; w[l].push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' }); var f = d.getElementsByTagName(s)[0], j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f); })(window, document, 'script', 'dataLayer', 'GTM-5FH8H3G'); </script>  <script> ///newsletters_js_redesign var jsonAssets = 'https://static.advance.net/static/newsletters/json/'; var imgAssets = 'https://static.advance.net/static/newsletters/images/'; function loadNewsletterJSON(path, success, error) { var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function() { if (xhr.readyState === XMLHttpRequest.DONE) { if (xhr.status === 200) { if (success) { success(JSON.parse(xhr.responseText) ); } } else if (error) { error(xhr); } } }; xhr.open("GET", path, true); xhr.send(); } function buildFeaturedNewsletter(newsletterRecord, affiliate) { var featuredSection = document.createElement('div'); featuredSection.classList.add('newsletterlist__featured--section'); var featuredLabel = document.createElement('div') featuredLabel.classList.add('newsletterlist__featured--section-label'); featuredLabel.innerText = 'Featured'; var featuredSubLabel = document.createElement('div') featuredSubLabel.classList.add('newsletterlist__featured--section-sublabel'); featuredSubLabel.innerText = 'The best of our newsletters, handpicked by our editors.'; var featuredDiv = document.createElement('div'); featuredDiv.classList.add('newsletterlist__featured--listing'); featuredDiv.setAttribute('data-category', newsletterRecord.category); var featuredImage = document.createElement('img'); featuredImage.src = imgAssets + affiliate + '/' + newsletterRecord.image; featuredImage.alt = newsletterRecord.name; var featuredHeader = document.createElement('h3'); var featuredHeaderLabel = document.createElement('span'); featuredHeaderLabel.classList.add('newsletterlist__featured--listing-checkbox-wrapper'); var featuredHeaderInput = document.createElement('input'); featuredHeaderInput.type = 'checkbox'; featuredHeaderInput.name = 'lists[' + newsletterRecord.st_list + ']'; featuredHeaderInput.id = 'lists[' + newsletterRecord.st_list + ']'; featuredHeaderInput.classList.add('newsletterlist__featured--listing-checkbox'); var featuredButtonIcon = document.createElement('span'); featuredButtonIcon.classList.add('button-icon'); var featuredButtonText = document.createElement('span'); featuredButtonText.classList.add('button-text'); var featuredButton = document.createElement('div'); featuredButton.classList.add('featured-button'); featuredButton.appendChild(featuredButtonIcon); featuredButton.appendChild(featuredButtonText); var featuredCheckbox = document.createElement('label'); featuredCheckbox.classList.add('newsletterlist__featured--listing-checkbox-label'); featuredCheckbox.setAttribute('for', 'lists[' + newsletterRecord.st_list + ']'); featuredCheckbox.appendChild(featuredHeaderInput); featuredCheckbox.appendChild(featuredButton); var featuredSchedule = document.createElement('span'); featuredSchedule.classList.add('newsletterlist__featured--listing-schedule'); featuredSchedule.append(" " + newsletterRecord.frequency); featuredContent = document.createElement('div'); featuredContent.classList.add('newsletterlist__featured--listing-content'); featuredHeaderLabel.append(newsletterRecord.name); featuredHeader.append(featuredHeaderLabel); featuredHeader.append(featuredSchedule) var featuredDescription = document.createElement('div'); featuredDescription.classList.add('newsletterlist__featured--listing-description'); featuredDescription.innerHTML = '<p>' + newsletterRecord.description + ''; featuredContent.appendChild(featuredHeader); featuredContent.appendChild(featuredDescription); featuredContent.append(featuredCheckbox); featuredDiv.appendChild(featuredImage); featuredDiv.appendChild(featuredContent); featuredSection.appendChild(featuredLabel); featuredSection.appendChild(featuredSubLabel); featuredSection.appendChild(featuredDiv); return featuredSection; } function buildNewsletter(newsletterRecord, affiliate) { var listingDiv = document.createElement('div'); listingDiv.classList.add('newsletterlist__listings--listing'); listingDiv.setAttribute('data-category', newsletterRecord.category); var listingImage = document.createElement('img'); listingImage.src = imgAssets + affiliate + '/' + newsletterRecord.image; listingImage.height = 72; listingImage.alt = newsletterRecord.name; var listingHeader = document.createElement('h3'); var listingHeaderLabel = document.createElement('span'); listingHeaderLabel.classList.add('newsletterlist__listings--listing-checkbox-wrapper'); var listingHeaderInput = document.createElement('input'); listingHeaderInput.type = 'checkbox'; listingHeaderInput.name = 'lists[' + newsletterRecord.st_list + ']'; listingHeaderInput.id = 'lists[' + newsletterRecord.st_list + ']'; listingHeaderInput.classList.add('newsletterlist__listings--listing-checkbox'); var listingButtonIcon = document.createElement('span'); listingButtonIcon.classList.add('button-icon'); var listingButtonText = document.createElement('span'); listingButtonText.classList.add('button-text'); var listingButton = document.createElement('div'); listingButton.classList.add('listing-button'); listingButton.appendChild(listingButtonIcon); listingButton.appendChild(listingButtonText); var listingCheckbox = document.createElement('label'); listingCheckbox.classList.add('newsletterlist__listings--listing-checkbox-label'); listingCheckbox.setAttribute('for', 'lists[' + newsletterRecord.st_list + ']'); listingCheckbox.appendChild(listingHeaderInput); listingCheckbox.appendChild(listingButton); var listingSchedule = document.createElement('span'); listingSchedule.classList.add('newsletterlist__listings--listing-schedule'); listingSchedule.append(" " + newsletterRecord.frequency); listingHeaderLabel.append(newsletterRecord.name); listingHeader.append(listingHeaderLabel); listingHeader.append(listingSchedule) var listingDescription = document.createElement('div'); listingDescription.classList.add('newsletterlist__listings--listing-description'); listingDescription.innerHTML = '<p>' + newsletterRecord.description + ''; listingDiv.appendChild(listingImage); listingDiv.appendChild(listingHeader); listingDiv.appendChild(listingDescription); listingDiv.append(listingCheckbox); return listingDiv; } function useNewsletterData(data) { console.log(data); document.title = data.title + ' Newsletters'; var listingsdiv = document.querySelector('.js-all-listings'); for (i = 0; i < data.newsletter_data.length; i++) { if (data.featured !== data.newsletter_data[i].name) { var newsletterDiv = buildNewsletter(data.newsletter_data[i], data.affiliate); listingsdiv.appendChild(newsletterDiv); }; } var featuredDiv = document.querySelector('.newsletterlist__featured'); for (i = 0; i < data.newsletter_data.length; i++) { if (data.featured === data.newsletter_data[i].name) { var newsletterDiv = buildFeaturedNewsletter(data.newsletter_data[i], data.affiliate); featuredDiv.appendChild(newsletterDiv); break; } } var brandUrl = document.querySelector('.js-brand-url'); brandUrl.href = data.brandUrl; brandUrl.setAttribute('aria-label', data.title); var brandLogo = document.querySelector('.js-brand-logo'); brandLogo.src = imgAssets + data.affiliate + '/' + data.brandLogo; brandLogo.alt = data.title; // New code block 3/25 // if (data.subHeader !== '' && data.subHeader !== undefined) { // var brandSubhead = document.querySelector('.js-subheader'); // brandSubhead.innerText = data.subHeader; // brandSubhead.style.display = 'block'; // } // Sailthru "data-autofill" workaround var subscribedLists = ["cl_all_users_unique_test_4-1"]; subscribedLists.forEach(function(list) { var newsletterCheckbox = document.querySelector('input[name="lists[' + list + ']"]'); if (newsletterCheckbox != null) { newsletterCheckbox.click(); newsletterCheckbox.classList.add('subscribed'); } var newsletterCheckboxLabel = document.querySelector('label[for="lists[' + list + ']"]'); if (newsletterCheckboxLabel != null) { newsletterCheckboxLabel.classList.add('subscribed'); } }) } function initNewsletterPage(affiliate) { var jsonFilename = jsonAssets + affiliate + '.json'; loadNewsletterJSON(jsonFilename, useNewsletterData); } </script> <title>Newsletters</title> <style type="text/css"> @media only screen and (min-width: 767px) { .newsletterlist__email-submit input[type="submit"] { width: 216px; } } </style> <script>function st_recaptcha_1(token) { var form = document.querySelectorAll("form[data-st-form-num='1']")[0]; HTMLFormElement.prototype.submit.call(form); }</script></head> <body class="newsletterlist"> <nav class="newsletterlist__nav"> <div class="newsletterlist__nav--logo"> <a href="#" target="_blank" class="js-brand-url"> <img src="#" class="js-brand-logo"> </a> </div> <div class="newsletterlist__nav-subscribe"> <a href="https://www.cleveland.com/mobile-device/" class="newsletterlist__nav-subscribe-cta js-subscribe-label" target="_blank">Download Our App!</a> </div> </nav> <form method="post" id="pref-form" data-st-form-num="1"> <div class="newsletterlist__wrapper"> <h1>Email Newsletters</h1> <div class="newsletterlist__featured"></div> <div class="newsletterlist__listings">  <div class="newsletterlist__listings--all js-all-listings"></div>  </div> </div> <div class="newsletterlist__email-submit"> <p class="newsletterlist__listings--email"> <input id="email" type="email" class="newsletterlist__listings--email-input" placeholder="Email" name="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,5}$" required> <label class="newsletterlist__listings--email-label" for="email">Email</label> <input type="submit" value="Sign Up" id="form-submit" class="st-recaptcha" data-callback="st_recaptcha_1"><noscript> <input type="hidden" name="st_no_js" value="1"> </noscript> </p> <p class="newsletterlist__listings--disclaimer">By signing up you agree to our <a href="https://www.cleveland.com/user-agreement/" target="_blank">user agreement</a> (including the <a href="https://www.cleveland.com/user-agreement/#introduction" target="_blank">class action waiver and arbitration provisions</a>) and <a href="https://www.cleveland.com/privacy-policy/" target="_blank">privacy policy</a>. </p> </div> <input type="hidden" name="profile_id" value="60a7f2f249444c1884635c16"><input type="hidden" name="st_form_num" value="0"></form> <script> document.addEventListener("DOMContentLoaded", function () { initNewsletterPage('cleveland'); function validateEmail(email) { var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; return re.test(String(email).toLowerCase()); } function createOrUpdateRedirectInput(value) { var emailSubmitElement = document.querySelector('p.newsletterlist__listings--email'); var redirectInputElement = document.querySelector('input[name="redirect"]') var redirectUrl = 'https://link.cleveland.com/join/6fe/signup-confirmation?email=' + value; var isValidEmail = validateEmail(value); if (isValidEmail) { if (redirectInputElement) { redirectInputElement.setAttribute("value", redirectUrl); } else { var redirectInput = document.createElement("input"); redirectInput.setAttribute("type", "hidden"); redirectInput.setAttribute("name", "redirect"); redirectInput.setAttribute("value", redirectUrl); emailSubmitElement.appendChild(redirectInput); } } else { if (redirectInputElement) { redirectInputElement.remove(); } } } function handleCheckboxChange(e) { var newsletterName = e.target.name.substring(6, e.target.name.length - 1); var submitVars = document.querySelector('input[name="vars[' + newsletterName + ']'); if (e.target.checked) { if (submitVars) { submitVars.setAttribute("value", "nwltr_subpage"); } else { var newInput = document.createElement("input"); newInput.setAttribute("type", "hidden"); newInput.setAttribute("name", "vars[" + newsletterName + "]"); newInput.setAttribute("value", "nwltr_subpage"); document.querySelector('form').appendChild(newInput); } } else { if (submitVars) { submitVars.remove(); } } // Check if any checkboxes are checked var checkboxes = document.querySelectorAll('form input[type="checkbox"]'); var anyChecked = Array.prototype.slice.call(checkboxes).some(x => x.checked); // If any are checked, create and append the hidden input if (anyChecked) { var hiddenInput = document.querySelector('input[name="vars[nwltr_optin_source]"]'); var hiddenMasterListInput = document.querySelector('input[name="lists[Master_list_subscription_page]"]'); if (!hiddenInput) { hiddenInput = document.createElement("input"); hiddenInput.setAttribute("type", "hidden"); hiddenInput.setAttribute("name", "vars[nwltr_optin_source]"); hiddenInput.setAttribute("value", "nwltr_subpage"); document.querySelector('form').appendChild(hiddenInput); } if (!hiddenMasterListInput) { hiddenInput = document.createElement("input"); hiddenInput.setAttribute("type", "hidden"); hiddenInput.setAttribute("name", "lists[Master_list_subscription_page]"); hiddenInput.setAttribute("value", "on"); document.querySelector('form').appendChild(hiddenInput); } } else { var hiddenInput = document.querySelector('input[name="vars[nwltr_optin_source]"]'); var hiddenMasterListInput = document.querySelector('input[name="lists[Master_list_subscription_page]"]'); if (hiddenInput) { hiddenInput.remove(); } if (hiddenMasterListInput) { hiddenMasterListInput.remove(); } } } // Define a callback function to be run when mutations are observed var callback = function (mutationsList, observer) { for (let mutation of mutationsList) { if (mutation.type === 'childList') { var checkboxes = document.querySelectorAll('form input[type="checkbox"]'); if (checkboxes.length > 0) { // Stop observing observer.disconnect(); // Add event listeners to checkboxes checkboxes.forEach(function (checkbox) { checkbox.addEventListener('change', handleCheckboxChange); }); } } } }; // Create a new observer instance with the callback function var observer = new MutationObserver(callback); // Start observing the document with the configured parameters observer.observe(document, { childList: true, subtree: true }); var emailAddrInput = document.querySelector('input[name="email"]'); emailAddrInput.addEventListener('input', (e) => createOrUpdateRedirectInput(e.target.value)); var urlQueryString = location.search.substring(1); var parsedQS = urlQueryString !== '' ? JSON.parse('{"' + urlQueryString.replace(/&/g, '","').replace(/=/g, '":"') + '"}', function (key, value) { return key === "" ? value : decodeURIComponent(value) }) : {}; console.log('https://link.cleveland.com/join/6fe/signup-confirmation?email=' + parsedQS.email) if (parsedQS.email) { emailAddrInput.value = parsedQS.email; createOrUpdateRedirectInput(emailAddrInput.value); } document.getElementById('form-submit').addEventListener('click', function (e) { var emailAddr = emailAddrInput.value; if (!emailAddr || !validateEmail(emailAddr)) { e.preventDefault(); alert('Please enter valid email address'); return; } var allCheckboxes = [].slice.call(document.querySelectorAll('form input[type="checkbox"]')); var newsletters = {}; allCheckboxes.forEach(function (checkbox) { if (checkbox.checked == true) { var newsletterName = checkbox.name.substring(6, checkbox.name.length - 1); newsletters[newsletterName] = 1; } }) console.log("newsletters: ", newsletters); var subscriptions = Object.keys(newsletters).filter(function (x) { return newsletters[x] == 1 }); if (subscriptions.length == 0) { e.preventDefault(); alert('Please select at least one newsletter'); console.log('No newsletters selected!') return; } }); window.addEventListener('adiTrackReady', function () { document.getElementById('form-submit').addEventListener('click', (event) => { var newsletterCheckboxes = document.querySelectorAll('form input[type="checkbox"]'); var newslettersSelected = [] for (checkbox of newsletterCheckboxes) { if (checkbox.checked == true) { var newsletterName = checkbox.name.substring(0, checkbox.name.length - 1).replace("lists[Newsletter_", "").replace("lists[Advertisement_", ""); if (checkbox.className.includes("featured")) { newsletterName = newsletterName.concat(" ", "(F)"); } newslettersSelected.push(newsletterName) } } if (newslettersSelected.length > 0) { var newslettersString = newslettersSelected.join("|"); adiTrack.event( { ga4: { name: "newsletters", action: "subscribe", list: newslettersString, } }, { affiliateList: ['all'] } ); } }); var newsletterCheckboxes = document.querySelectorAll('form input[type="checkbox"]'); for (checkbox of newsletterCheckboxes) { checkbox.addEventListener('change', (event) => { if (event.currentTarget.checked == true) { var newsletterName = event.currentTarget.name.substring(0, event.currentTarget.name.length - 1).replace("lists[Newsletter_", "").replace("lists[Advertisement_", ""); if (event.currentTarget.className.includes("featured")) { newsletterName = newsletterName.concat(" ", "(F)"); } adiTrack.event( { ga4: { name: "newsletters", action: "click", list: newsletterName, } }, { affiliateList: ['all'] } ); } }); } }); }); </script> </body> </html><script type="text/javascript">function st_recaptcha_onload() { const submitButtons = window.self.document.querySelectorAll(".st-recaptcha"); for (var i = 0; i < submitButtons.length; i++) { submitButtons[i].addEventListener('click', function (e) { if (e.defaultPrevented) { e.stopImmediatePropagation(); } }); grecaptcha.render(submitButtons[i], {'sitekey': '6Lf8zqgoAAAAAFUUkcOQ6F63JUDRJdiz_4BCIDPj'}); } }</script><script src="https://www.google.com/recaptcha/api.js?onload=st_recaptcha_onload&render=explicit" async="" defer></script>

CINXE.COM

Newsletters