Pope Valley Winery Signup Forms
“Text Us Now” Website Button & Popup
The “Text Us Now” button on this page can be displayed on any page of your website by pasting the code below in the page header.
NOTE: You can also create your own mobile-friendly pop-up at https://tools.simpletexting.com/
<script>
var ctaData;
(function (d, l, i, h, s) {
h = d.getElementsByTagName('head')[0];
s = d.createElement('script');
s.async = 1;
s.src = l;
ctaData = i;
h.appendChild(s);
}(document, 'https://tools.simpletexting.com/assets/ctaviewer.js?v=1.0', 'eyJkYXRhIjp7ImlzUG93ZXJlZCI6ZmFsc2UsImZvbGRlciI6Imh0dHBzOi8vdG9vbHMuc2ltcGxldGV4dGluZy5jb20vIiwic2l6ZSI6IjE3IiwiY29sb3IiOiIjNTYzZDA0IiwiZm9udCI6Ik9wZW4gU2FucyIsInJlYXNvbiI6IlRleHQgTEVUU0NIQVQgdG8gMS03MDctOTY1LTEyNDYiLCJyZWFzb25BbGlnbiI6ImNlbnRlciIsInJlYXNvbldlaWdodCI6ImJvbGQiLCJyZWFzb25JdGFsaWMiOiIiLCJzZWNvbmRhcnlTaXplIjoiMTMiLCJzZWNvbmRhcnlGb250IjoiUnViaWsiLCJzZWNvbmRhcnlDb2xvciI6IiM3NTg0OWMiLCJzZWNvbmRhcnlSZWFzb24iOiJBc2sgYW55IHF1ZXN0aW9ucyBhYm91dCBQb3BlIFZhbGxleSBXaW5lcnkhIE91ciB0ZWFtIHdpbGwgZ2V0IGJhY2sgdG8geW91IEFTQVA6KSIsInNlY29uZGFyeVJlYXNvbkFsaWduIjoiY2VudGVyIiwic2Vjb25kYXJ5UmVhc29uV2VpZ2h0IjoiIiwic2Vjb25kYXJ5UmVhc29uSXRhbGljIjoiIiwiY29tcGFueSI6IllvdXIgQ29tcGFueSBOYW1lIiwiZXN0aW1hdGVkIjo0LCJlbWFpbCI6ImVtYWlsQGRvbWFpbi5jb20iLCJjdXN0b21Qcml2YWN5IjpmYWxzZSwidGVybXMiOiIiLCJwcml2YWN5IjoiIiwiY29tcGxpYW5jZUZvbnQiOiJSdWJpayIsImNvbXBsaWFuY2VTaXplIjo5LCJjb21wbGlhbmNlQ29sb3IiOiIjNzU4NDljIiwiY29tcGxpYW5jZUFsaWduIjoiY2VudGVyIiwiY29tcGxpYW5jZVdlaWdodCI6IiIsImNvbXBsaWFuY2VJdGFsaWMiOiIiLCJsb2dvIjoiaHR0cHM6Ly93d3cudmludGVyYWN0aXZlLmNvbS9zL3dlYnNpdGVfbG9nbzIucG5nIiwibG9nb1N0eWxlIjoiYm94ZWQiLCJsb2dvQWxpZ24iOiJjZW50ZXIiLCJsb2dvTWF4V2lkdGgiOiIxNDIiLCJoeXBlcmxpbmsiOiIiLCJpbWFnZSI6Imh0dHBzOi8vd3d3LnZpbnRlcmFjdGl2ZS5jb20vcy9xci1jb2RlLVBWVy1rZXl3b3JkLUxFVFNDSEFULnBuZyIsImltYWdlV2lkdGgiOiIyMjkiLCJpbWFnZUFsaWduIjoiY2VudGVyIiwiaW1hZ2VTdHlsZSI6ImJveGVkIiwicG9zaXRpb24iOiJjdGEtYm94ZWQiLCJjb2xvckEiOiIjNzU4NDlDIiwic3Ryb2tlIjoiI2ZmZmZmZiIsImJhY2tncm91bmQiOiIjZmZmZmZmIiwiY29ybmVyIjo4LCJzaGFkb3ciOiIwcHggMTZweCA2NHB4IHJnYmEoMCwwLDAsMC4wOCkiLCJmb250QSI6IlJ1YmlrIiwic2l6ZUEiOjE2LCJ3aWR0aCI6IjM1MCIsImNsb3NlUG9zaXRpb24iOiJjdGEtY2xvc2UtdHIiLCJrZXl3b3JkIjoiTEVUU0NIQVQiLCJwaG9uZSI6IjU1NTg4OCIsInNob3J0VGVybXMiOiIiLCJzaG9ydFRlcm1zUHJpdmFjeSI6IiIsInNob3J0UHJpdmFjeSI6IiIsIm1haW5CdXR0b25Gb250IjoiUnViaWsiLCJtYWluQnV0dG9uRm9udENvbG9yIjoiI2ZmZmZmZiIsIm1haW5CdXR0b25Gb250U2l6ZSI6MTYsIm1haW5CdXR0b25BbGlnbiI6ImNlbnRlciIsIm1haW5CdXR0b25XZWlnaHQiOiIiLCJtYWluQnV0dG9uSXRhbGljIjoiIiwibWFpbkJ1dHRvblNoYWRvdyI6IjBweCAwcHggMHB4IHJnYmEoMCwwLDAsMC4wKSIsIm1haW5CdXR0b25Db3JuZXIiOjgsIm1haW5CdXR0b25TdHJva2UiOiIjOWEyNDFhIiwibWFpbkJ1dHRvbkJhY2tncm91bmQiOiIjOWEyNDFhIiwibWFpbkJ1dHRvbkxhYmVsIjoiVGV4dCBVcyBOb3ciLCJtYWluQnV0dG9uVHlwZSI6ImN0YS1sYWJlbC10ZXh0aWNvbmwiLCJtYWluQnV0dG9uSWNvbiI6InBhY2stbWVzc2FnZS1jaXJjbGUiLCJ0cmlnZ2VyQnV0dG9uRm9udCI6IlJ1YmlrIiwidHJpZ2dlckJ1dHRvbkZvbnRDb2xvciI6IiNmZmZmZmYiLCJ0cmlnZ2VyQnV0dG9uRm9udFNpemUiOjE2LCJ0cmlnZ2VyQnV0dG9uQWxpZ24iOiJyaWdodCIsInRyaWdnZXJCdXR0b25XZWlnaHQiOiIiLCJ0cmlnZ2VyQnV0dG9uSXRhbGljIjoiIiwidHJpZ2dlckJ1dHRvblNoYWRvdyI6IjBweCAxNnB4IDY0cHggcmdiYSgwLDAsMCwwLjA4KSIsInRyaWdnZXJCdXR0b25Db3JuZXIiOjgsInRyaWdnZXJCdXR0b25TdHJva2UiOiIjOWEyNDFhIiwidHJpZ2dlckJ1dHRvbkJhY2tncm91bmQiOiIjOWEyNDFhIiwidHJpZ2dlckJ1dHRvbkxhYmVsIjoiVGV4dCBVcyBOb3ciLCJ0cmlnZ2VyQnV0dG9uVHlwZSI6ImN0YS1sYWJlbC10ZXh0aWNvbmwiLCJ0cmlnZ2VyQnV0dG9uSWNvbiI6InBhY2stbWVzc2FnZS1jaXJjbGUiLCJ0ZXh0VXNCdXR0b25OdW1iZXIiOiI1NTU4ODgiLCJ0ZXh0VXNCdXR0b25UZXh0IjoiIiwidGV4dFVzQnV0dG9uRm9udCI6IlJ1YmlrIiwidGV4dFVzQnV0dG9uRm9udENvbG9yIjoiI2ZmZmZmZiIsInRleHRVc0J1dHRvbkZvbnRTaXplIjoxNiwidGV4dFVzQnV0dG9uQWxpZ24iOiJyaWdodCIsInRleHRVc0J1dHRvbldlaWdodCI6IiIsInRleHRVc0J1dHRvbkl0YWxpYyI6IiIsInRleHRVc0J1dHRvblNoYWRvdyI6IjBweCAxNnB4IDY0cHggcmdiYSgwLDAsMCwwLjA4KSIsInRleHRVc0J1dHRvbkNvcm5lciI6OCwidGV4dFVzQnV0dG9uU3Ryb2tlIjoiIzIzOTlmMCIsInRleHRVc0J1dHRvbkJhY2tncm91bmQiOiIjMjM5OWYwIiwidGV4dFVzQnV0dG9uTGFiZWwiOiJXYXRjaCBhIGRlbW8iLCJ0ZXh0VXNCdXR0b25UeXBlIjoiY3RhLWxhYmVsLXRleHRpY29ubCIsInRleHRVc0J1dHRvbkljb24iOiJwYWNrLW1lc3NhZ2UtY2lyY2xlIn0sImJlaGF2aW9yIjp7ImRpc3BsYXlPbkRlc2t0b3AiOnRydWUsImRpc3BsYXlPbk1vYmlsZSI6dHJ1ZSwicG9zaXRpb24iOiJjdGEtcG9zaXRpb24tYnIiLCJib3R0b20iOjMyLCJsZWZ0IjozMiwicmlnaHQiOjMyLCJhdXRvT3BlbiI6ZmFsc2UsImRlbGF5IjoxMDAwfSwibGF5b3V0TmFtZSI6Ik1vYmlsZSBTaWduLVVwIFdpZGdldCAoUG9wdXApIn0='));
</script>Tasting Room Signage
Click the image(s) below to download a PDF
Concept 1
Concept 2
SMS Preference form with DOB requirement
Authorized users may edit this webform in SimpleTexting under Apps/Web Sign Up Forms.
To embed this form, copy the computer code below or login to SimpleTexting.com and click on Apps/Web Sign Up Forms/Get Code
NOTE: Form style and text settings can both be customized directly in your HTML code.
pope valley winery webform - html code
<style>/**
Font
*/
@font-face {
font-family: 'ProximaNovaA-Bold';
src: url("webfonts/32478F_0_0.eot");
src: url("webfonts/32478F_0_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_0_0.woff2") format("woff2"), url("webfonts/32478F_0_0.woff") format("woff"), url("webfonts/32478F_0_0.ttf") format("truetype"); }
@font-face {
font-family: 'ProximaNovaS-Bold';
src: url("webfonts/32478F_1_0.eot");
src: url("webfonts/32478F_1_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_1_0.woff2") format("woff2"), url("webfonts/32478F_1_0.woff") format("woff"), url("webfonts/32478F_1_0.ttf") format("truetype"); }
@font-face {
font-family: 'ProximaNovaA-BoldIt';
src: url("webfonts/32478F_2_0.eot");
src: url("webfonts/32478F_2_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_2_0.woff2") format("woff2"), url("webfonts/32478F_2_0.woff") format("woff"), url("webfonts/32478F_2_0.ttf") format("truetype"); }
@font-face {
font-family: 'ProximaNova-Bold';
src: url("webfonts/32478F_3_0.eot");
src: url("webfonts/32478F_3_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_3_0.woff2") format("woff2"), url("webfonts/32478F_3_0.woff") format("woff"), url("webfonts/32478F_3_0.ttf") format("truetype");
font-weight: 700;
font-style: normal; }
@font-face {
font-family: 'ProximaNovaS-BoldIt';
src: url("webfonts/32478F_4_0.eot");
src: url("webfonts/32478F_4_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_4_0.woff2") format("woff2"), url("webfonts/32478F_4_0.woff") format("woff"), url("webfonts/32478F_4_0.ttf") format("truetype"); }
@font-face {
font-family: 'ProximaNova-BoldIt';
src: url("webfonts/32478F_5_0.eot");
src: url("webfonts/32478F_5_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_5_0.woff2") format("woff2"), url("webfonts/32478F_5_0.woff") format("woff"), url("webfonts/32478F_5_0.ttf") format("truetype"); }
@font-face {
font-family: 'ProximaNovaA-Regular';
src: url("webfonts/32478F_6_0.eot");
src: url("webfonts/32478F_6_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_6_0.woff2") format("woff2"), url("webfonts/32478F_6_0.woff") format("woff"), url("webfonts/32478F_6_0.ttf") format("truetype"); }
@font-face {
font-family: 'ProximaNovaS-Regular';
src: url("webfonts/32478F_7_0.eot");
src: url("webfonts/32478F_7_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_7_0.woff2") format("woff2"), url("webfonts/32478F_7_0.woff") format("woff"), url("webfonts/32478F_7_0.ttf") format("truetype"); }
@font-face {
font-family: 'ProximaNovaA-RegularIt';
src: url("webfonts/32478F_8_0.eot");
src: url("webfonts/32478F_8_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_8_0.woff2") format("woff2"), url("webfonts/32478F_8_0.woff") format("woff"), url("webfonts/32478F_8_0.ttf") format("truetype"); }
@font-face {
font-family: 'ProximaNova-Regular';
src: url("webfonts/32478F_9_0.eot");
src: url("webfonts/32478F_9_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_9_0.woff2") format("woff2"), url("webfonts/32478F_9_0.woff") format("woff"), url("webfonts/32478F_9_0.ttf") format("truetype");
font-weight: 400;
font-style: normal; }
@font-face {
font-family: 'ProximaNovaS-RegularIt';
src: url("webfonts/32478F_A_0.eot");
src: url("webfonts/32478F_A_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_A_0.woff2") format("woff2"), url("webfonts/32478F_A_0.woff") format("woff"), url("webfonts/32478F_A_0.ttf") format("truetype"); }
@font-face {
font-family: 'ProximaNova-RegularIt';
src: url("webfonts/32478F_B_0.eot");
src: url("webfonts/32478F_B_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_B_0.woff2") format("woff2"), url("webfonts/32478F_B_0.woff") format("woff"), url("webfonts/32478F_B_0.ttf") format("truetype"); }
@font-face {
font-family: 'ProximaNovaA-Semibold';
src: url("webfonts/32478F_C_0.eot");
src: url("webfonts/32478F_C_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_C_0.woff2") format("woff2"), url("webfonts/32478F_C_0.woff") format("woff"), url("webfonts/32478F_C_0.ttf") format("truetype"); }
@font-face {
font-family: 'ProximaNovaS-Semibold';
src: url("webfonts/32478F_D_0.eot");
src: url("webfonts/32478F_D_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_D_0.woff2") format("woff2"), url("webfonts/32478F_D_0.woff") format("woff"), url("webfonts/32478F_D_0.ttf") format("truetype"); }
@font-face {
font-family: 'ProximaNova-Semibold';
src: url("webfonts/32478F_E_0.eot");
src: url("webfonts/32478F_E_0.eot?#iefix") format("embedded-opentype"), url("webfonts/32478F_E_0.woff2") format("woff2"), url("webfonts/32478F_E_0.woff") format("woff"), url("webfonts/32478F_E_0.ttf") format("truetype");
font-weight: 600;
font-style: normal; }
/**
Css variables
*/
html {
--primary-color: rgba(35, 153, 240);
--text-primary: rgba(0, 14, 36, 0.87);
--text-caption: rgba(0, 27, 72, 0.54);
--text-red-50: rgba(230, 54, 85);
--controls-border-color: rgba(0, 27, 72, 0.32);
--controls-border-radius: 8px;
--input-focus-box-shadow: 0px 0px 0px 2px rgba(35, 153, 240, 0.5);
--input-focus-border-color: var(--primary-color);
--card-box-shadow: 0px 2px 8px rgba(0, 27, 72, 0.13);
--st-color-white: #FFF;
--st-color-primary: rgba(35, 153, 240);
--st-color-text-disabled: rgba(0, 27, 72, 0.32);
}
/*
* ST Signup Forms styles
*/
body {
margin: 0;
padding: 0;
height: 100%;
font-size: 14px;
line-height: 14px;
font-family: ProximaNova-Regular, Arial, sans-serif;
color: var(--text-primary);
}
/* Fonts and helpers */
.st-title {
font-size: 1.25em;
font-weight: bold;
line-height: 1.5em;
color: var(--text-primary);
margin-bottom: 8px;
}
.st-general-error {
font-size: 1.25em;
line-height: 1.5em;
color: var(--text-red-50);
margin-bottom: 8px;
text-align: center;
}
/* Error icon */
.st-general-error img {
width: 1.25em;
height: 1.25em;
margin-bottom: -0.2em;
}
.st-font-caption {
font-size: 12px;
color: var(--text-caption);
line-height: 14px;
}
.st-font-caption a {
color: var(--text-caption);
}
.st-hidden {
display: none;
}
/* Sign-Up form */
@media (max-width: 246px) {
.st-signupform {
justify-content: flex-start;
}
}
.st-signupform {
display: flex;
justify-content: center;
}
.st-signupform-content {
max-width: 540px;
box-sizing: border-box;
padding: 32px;
color: var(--text-primary);
line-height: 1.5;
background: white;
box-shadow: var(--card-box-shadow);
border-radius: var(--controls-border-radius);
}
.st-signupform__label {
color: var(--text-primary);
font-weight: bold;
font-size: 14px;
line-height: 2em;
word-break: break-word;
}
.st-signupform__label .required-mark {
color: var(--text-red-50);
}
.st-signupform input:focus,
.st-signupform select:focus,
.st-signupform textarea:focus,
.st-signupform button:focus {
outline: none;
}
.st-signupform .st-error-message {
margin-bottom: 4px;
color: var(--text-red-50);
}
.st-checkbox-list {
margin-bottom: 4px;
}
.st-checkbox {
display: flex;
align-items: center;
justify-content: flex-start;
font-size: 16px;
line-height: 18px;
}
.st-field-option {
margin-bottom: 8px;
}
.st-field-option:last-child {
margin-bottom: 0;
}
.st-checkbox label {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.st-signupform input[type="text"],textarea {
width: 100%;
background-color: white;
border: 1px solid var(--controls-border-color);
border-radius: var(--controls-border-radius);
box-sizing: border-box;
padding: 8px;
font-size: 14px;
margin: 4px 0;
outline: none;
-webkit-transition: .3s all;
transition: .3s all;
}
.st-signupform input[type="text"]:focus,
textarea:focus,
.st-signupform input[type="checkbox"]:focus,
button:focus
{
border-color: var(--input-focus-border-color);
box-shadow: var(--input-focus-box-shadow);
-webkit-transition: .3s all;
transition: .3s all;
}
.st-signupform input[type="checkbox"] {
appearance: none;
width: 18px;
height: 18px;
border-radius: 4px;
background-color: var(--st-color-white);
border: 1px solid var(--st-color-text-disabled);
box-shadow: inset 0 0 3px rgb(0 0 0 / 15%);
position: relative;
transition: .3s all;
cursor: pointer;
box-sizing: border-box;
}
.st-signupform input[type="checkbox"]:disabled {
cursor: default;
}
.st-signupform input[type="checkbox"]:before {
content: '';
background-image: url('../join-web-form/st-checkbox.svg');
background-size: 8px;
display: block;
position: absolute;
background-position: center;
background-repeat: no-repeat;
opacity: 0;
left: 0;
right: 0;
bottom: 0;
top: 0;
transition: .3s all;
}
.st-signupform input[type="checkbox"]:after {
content: '';
position: absolute;
width: 10px;
height: 2px;
border-radius: 2px;
background-color: var(--st-color-white);
opacity: 0;
transition: .3s all;
top: 7px;
left: 3px;
}
.st-signupform input[type="checkbox"]:checked {
background-color: var(--st-color-primary);
border-color: var(--st-color-primary);
}
.st-signupform input[type="checkbox"]:checked:before {
opacity: 1;
background-size: 12px;
}
.st-signupform input[type="checkbox"]:indeterminate {
background-color: var(--st-color-primary);
border-color: var(--st-color-primary);
}
.st-signupform input[type="checkbox"]:indeterminate:after {
opacity: 1;
}
.st-signupform button[type="submit"] {
display: block;
width: 100%;
border-radius: var(--controls-border-radius);
box-sizing: border-box;
padding: 8px 16px;
font-size: 16px;
font-weight: 600;
text-decoration: none;
text-align: center;
cursor: pointer;
line-height: 20px;
background-color: var(--primary-color);
border: 0 none;
color: white;
margin: 30px 0 24px;
}
.st-signupform button[type="submit"]:disabled {
cursor: default;
background-color: var(--st-color-text-disabled);
color: white;
}
.st-signupform input.st-signupform-validation-error, textarea.st-signupform-validation-error,
.st-signupform input.st-signupform-validation-error:focus, textarea.st-signupform-validation-error:focus {
border-color: #F44336;
}
.st-signupform textarea {
padding-right: 24px;
resize: vertical;
min-height: 80px;
max-height: 200px;
}
.terms-checkbox {
margin-bottom: 4px;
}
.st-signupform .st-terms-and-conditions {
margin-top: 22px;
}
.st-signupform .st-terms-and-conditions-text {
color: var(--text-primary);
font-size: 16px;
line-height: 18px;
}
.st-signupform .st-terms-and-conditions-caption {
margin-left: 24px;
}
.st-signupform-terms-agreed-error {
margin: 4px 0 0 24px;
color: var(--text-red-50);
}
.st-signupform-server-error-message {
color: var(--text-red-50);
}
.st-signupform footer {
font-size: 14px;
color: var(--text-primary);
text-align: center;
}
.st-signupform footer a {
color: var(--primary-color);
}
</style><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Join Text Messaging List</title>
<link href="https://app2.simpletexting.com/join-web-form/style-new.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script>
(function joinWebForm(
win, doc, webFormId, formFields,
DUPLICATE_EMAIL_EXCEPTION, DUPLICATE_PHONE_EXCEPTION,CUSTOM_FIELDS_VALIDATION_EXCEPTION,
) {
const XHR = ('onload' in new win.XMLHttpRequest()) ? win.XMLHttpRequest : win.XDomainRequest;
const fieldErrorClassName = 'st-signupform-validation-error';
function getFormServerErrorMessage(form) {
return form.querySelector('.st-signupform-server-error-message');
}
function getFormTermsAgreedError(form) {
return form.querySelector('.st-signupform-terms-agreed-error');
}
function getSubmitButton(form) {
return form.querySelector('#subscribeNow');
}
function setServerErrorMessage(form, message) {
const formServerErrorMessage = getFormServerErrorMessage(form);
formServerErrorMessage.innerText = message;
if (message) {
formServerErrorMessage.classList.add("st-hidden");
} else {
formServerErrorMessage.classList.remove("st-hidden");
}
}
function isTermsAgreedAccepted(form) {
return form.querySelector('input[name="terms-agreed"]').checked;
}
function showTermsAgreedError(form) {
const submitButton = getSubmitButton(form);
const formTermsAgreedError = getFormTermsAgreedError(form);
submitButton.disabled = false;
formTermsAgreedError.classList.remove("st-hidden");
}
function hideTermsAgreedError(form) {
const formTermsAgreedError = getFormTermsAgreedError(form);
formTermsAgreedError.classList.add("st-hidden");
}
function clearFormErrors(form) {
const fields = form.querySelectorAll(`.${fieldErrorClassName}`);
fields.forEach(function (field) {
field.classList.remove(fieldErrorClassName);
const fieldError = form.querySelector(`#js-error-${field.name}`);
fieldError.innerText = '';
});
setServerErrorMessage(form, '');
hideTermsAgreedError(form);
}
function collectFormData(form) {
const formData = new FormData(form);
const data = {
webFormId,
fieldValues: {},
listIds: [],
};
formData.forEach(function (value, name) {
if (name === 'list') {
data.listIds.push(value);
} else if (name === 'phone') {
data.fieldValues[name] = value.replace(/\D/g, '');
} else if (!['terms-agreed', 'webFormId'].includes(name)) {
data.fieldValues[name] = value;
}
});
return data;
}
function convertServerErrorMessage(fieldName, errorMessage) {
const field = formFields.find(formField => formField.name === fieldName);
if (errorMessage === 'Required field value is empty') {
return `${field.label} is required`;
} else {
if (field.type === 'phone') {
return `${field.label} is required in (XXX) XXX-XXXX format`;
} else if (field.type === 'date') {
return `${field.label} is required in MM/DD/YYYY format`;
} else if (field.type === 'zipCode') {
if (field.format === 'US') {
return `${field.label} is required in XXXXX format`;
} else {
return `${field.label} is required in XXX-XXX format`;
}
} else if (field.type === 'url') {
return `${field.label} is required in http(s)://xxxxxx.xx format`;
} else if (field.type === 'gender') {
return `${field.label} is required in M, m, F, f, Male, Female, male, female format`;
} else if (field.type === 'number') {
return `${field.label} is required in number format`;
} else if (field.name === 'birthday') {
return `${field.label} is required in MM/DD/YYYY format`;
}
return errorMessage;
}
}
function parseServerValidationError(response) {
let results;
try {
const error = win.JSON.parse(response);
if (error.code === DUPLICATE_PHONE_EXCEPTION) {
results = [
{
fieldName: 'phone',
errorMessage: 'Phone number already exists.'
}
];
} else if (error.code === DUPLICATE_EMAIL_EXCEPTION) {
results = [
{
fieldName: 'email',
errorMessage: 'Email already exists.'
}
];
} else if (error.code === CUSTOM_FIELDS_VALIDATION_EXCEPTION) {
results = Object.entries(error.reasons).map(([key, value]) => ({
fieldName: key,
errorMessage: convertServerErrorMessage(key, value)
}));
} else {
results = [
{
fieldName: error.invalidValueName,
errorMessage: convertServerErrorMessage(key, error.reason)
}
];
}
} catch (error) {
results = [
{
fieldName: '',
errorMessage: 'Validation error.'
}
];
}
return results;
}
function handleLoadForm(form) {
const submitButton = getSubmitButton(form);
if (this.status === 200) {
const formData = new FormData(form);
const confirmationTextEl = form.querySelector('.step2-confirmationText');
confirmationTextEl.innerText = confirmationTextEl.innerText.replace('%%phone%%', formData.get('phone'));
form.querySelector('.step1-form').style.display = 'none';
confirmationTextEl.style.display = 'block';
form.reset();
} else if (this.status === 418) {
submitButton.disabled = false;
const validations = parseServerValidationError(this.responseText);
if (validations.length > 0) {
if (validations[0].fieldName) {
validations.forEach((validation) => {
const fields =
form.querySelectorAll(
`input[name="${validation.fieldName}"], textarea[name="${validation.fieldName}"]`
);
fields.forEach((field) => {
field.classList.add(fieldErrorClassName);
});
const fieldError =
form.querySelector(`#js-error-${validation.fieldName}`);
fieldError.innerText = validation.errorMessage;
});
} else {
setServerErrorMessage(form, validations[0].errorMessage);
}
} else {
setServerErrorMessage(form, 'Internal Error. Please, try later.');
}
} else {
submitButton.disabled = false;
setServerErrorMessage(form, 'Internal Error. Please, try later.');
}
}
function handleErrorForm(form) {
const submitButton = getSubmitButton(form);
submitButton.disabled = false;
setServerErrorMessage(form, 'Internal Error. Please, try later.');
}
function sendForm(form) {
const data = collectFormData(form);
const url = `${form.action}?r=${Date.now()}`;
const request = new XHR();
request.open(form.method, url);
request.onload = function () { handleLoadForm.call(this, form) };
request.onerror = function () { handleErrorForm.call(this, form) };
request.ontimeout = function () { handleErrorForm.call(this, form) };
try {
request.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');
} catch (_) { /* ignore if we can't set headers */
}
request.send(win.JSON.stringify(data));
}
function handleSubmitForm(event) {
event.preventDefault();
const form = event.target;
const submitButton = getSubmitButton(form);
try {
submitButton.disabled = true;
clearFormErrors(form);
if (!isTermsAgreedAccepted(form)) {
showTermsAgreedError(form);
} else {
sendForm(form);
}
} catch (e) {
console.error(e);
setServerErrorMessage(form, 'Internal Error. Please, try later.');
submitButton.disabled = false;
}
}
function formatPhone(value) {
const numbers = value.replace(/\D/g, '');
const firstPart = numbers.substring(0, 3);
const secondPart = numbers.substring(3, 6);
const thirdPart = numbers.substring(6, 10);
let result = '';
if (firstPart) {
result += `(${firstPart}`;
}
if (secondPart) {
result += `) ${secondPart}`;
}
if (thirdPart) {
result += `-${thirdPart}`;
}
return result;
}
function handleChangePhoneField(event) {
const field = event.currentTarget;
field.value = formatPhone(field.value);
}
function handleChangeDateField(event) {
const field = event.currentTarget;
const numbers = field.value.replace(/\D/g, '');
const month = numbers.substr(0, 2);
const day = numbers.substr(2, 2);
const year = numbers.substr(4, 4);
field.value = `${month}${day ? `/${day}` : ''}${year ? `/${year}` : ''}`;
}
function handleChangeZipCodeField(event) {
const field = event.currentTarget;
field.value = field.value.replace(/\D/g, '').substr(0, 5);
}
function handleChangePostalCodeField(event) {
const field = event.currentTarget;
const numbers = field.value.replace(/([^a-zA-Z0-9])/g, '');
const code1 = numbers.substr(0, 3);
const code2 = numbers.substr(3, 3);
field.value = `${code1}${code2 ? `-${code2}` : ''}`;
}
function handleChangeNumberField(event) {
const field = event.currentTarget;
field.value = field.value.replace(/[^0-9,.]/g, '');
}
function handleLoad() {
const forms = doc.querySelectorAll(`#st-join-web-form-${webFormId}`);
for(let i=0; i<forms.length; i++) {
const form = forms[i];
if (!form.hasAttribute('data-form-initialized')) {
form.setAttribute('data-form-initialized', true);
form.addEventListener('submit', handleSubmitForm);
const phoneFields = form.querySelectorAll('input[data-type="phone"]');
phoneFields.forEach(function (field) {
field.addEventListener('input', handleChangePhoneField);
});
const dateFields = form.querySelectorAll('input[data-type="date"]');
dateFields.forEach(function (field) {
field.addEventListener('input', handleChangeDateField);
});
const postalCodeFields = form.querySelectorAll('input[data-type="zipCode"][data-format="CA"]');
postalCodeFields.forEach(function (field) {
field.addEventListener('input', handleChangePostalCodeField);
});
const zipCodeFields = form.querySelectorAll('input[data-type="zipCode"][data-format="US"]');
zipCodeFields.forEach(function (field) {
field.addEventListener('input', handleChangeZipCodeField);
});
const numberFields = form.querySelectorAll('input[data-type="number"]');
numberFields.forEach(function (field) {
field.addEventListener('input', handleChangeNumberField);
});
const agreedFields = form.querySelector(`#terms-agreed-checkbox-${webFormId}`);
agreedFields.id += `-${i.toString(10)}`;
const agreedTerms = form.querySelector('.st-terms-and-conditions-text');
agreedTerms.setAttribute('for', agreedFields.id);
}
}
}
win.addEventListener('load', handleLoad);
}
)(
window, document, '67367df632e5863be71bfe4e', [{"name":"firstname","label":"Contact first name","placeholder":"John","type":"text","value":"","required":true},{"name":"lastname","label":"Contact last name","placeholder":"Smith","type":"text","value":"","required":true},{"name":"phone","label":"Phone","placeholder":"(XXX) XXX-XXXX","type":"phone","value":"","required":true},{"name":"birthday","label":"Birthday","placeholder":"mm/dd/yyyy (example: 11/14/2024)","type":"date","value":"","required":true},{"name":"list","options":[{"value":"67367c8b32e5863be71bb7af","label":"Club News"},{"value":"67367bf52920b2581759c28a","label":"Order Status"},{"value":"67367c4532e5863be71ba990","label":"Tasting Room Specials"},{"value":"67367cb432e5863be71bbfd4","label":"Upcoming Events"}],"label":"List","type":"select","value":"","required":true}],
'DuplicateContactEmailException', 'DuplicateContactPhoneException', 'CustomFieldsValidationException'
);
</script>
<div class="st-signupform">
<form
id="st-join-web-form-67367df632e5863be71bfe4e"
class="st-signupform-content"
action="https://app2.simpletexting.com/join/joinContact"
method="POST"
>
<div class="step1-form">
<div class="required">
<label class="st-signupform__label" for="firstname">
First Name
<span class="required-mark">
<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.84534 5.66669H1.00004C0.631851 5.66669 0.333374 5.36821 0.333374 5.00002C0.333374 4.63183 0.631851 4.33335 1.00004 4.33335H3.84534L2.42269 1.86925C2.2386 1.55039 2.34785 1.14266 2.66671 0.958568C2.98557 0.774473 3.3933 0.883724 3.57739 1.20259L5.00004 3.66669L6.42269 1.20259C6.60679 0.883724 7.01451 0.774473 7.33337 0.958568C7.65224 1.14266 7.76149 1.55039 7.57739 1.86925L6.15474 4.33335H9.00004C9.36823 4.33335 9.66671 4.63183 9.66671 5.00002C9.66671 5.36821 9.36823 5.66669 9.00004 5.66669H6.15474L7.57739 8.13079C7.76149 8.44965 7.65224 8.85738 7.33337 9.04147C7.01451 9.22557 6.60679 9.11632 6.42269 8.79745L5.00004 6.33335L3.57739 8.79745C3.3933 9.11632 2.98557 9.22557 2.66671 9.04147C2.34785 8.85738 2.2386 8.44965 2.42269 8.13079L3.84534 5.66669Z" fill="#E63655"/>
</svg>
</span>
</label>
<input
id="firstname"
name="firstname"
type="text"
placeholder="Taylor"
maxlength="1600"
data-type="text"
/>
</div>
<div id="js-error-firstname" class="st-error-message"></div>
<div class="required">
<label class="st-signupform__label" for="lastname">
Last Name
<span class="required-mark">
<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.84534 5.66669H1.00004C0.631851 5.66669 0.333374 5.36821 0.333374 5.00002C0.333374 4.63183 0.631851 4.33335 1.00004 4.33335H3.84534L2.42269 1.86925C2.2386 1.55039 2.34785 1.14266 2.66671 0.958568C2.98557 0.774473 3.3933 0.883724 3.57739 1.20259L5.00004 3.66669L6.42269 1.20259C6.60679 0.883724 7.01451 0.774473 7.33337 0.958568C7.65224 1.14266 7.76149 1.55039 7.57739 1.86925L6.15474 4.33335H9.00004C9.36823 4.33335 9.66671 4.63183 9.66671 5.00002C9.66671 5.36821 9.36823 5.66669 9.00004 5.66669H6.15474L7.57739 8.13079C7.76149 8.44965 7.65224 8.85738 7.33337 9.04147C7.01451 9.22557 6.60679 9.11632 6.42269 8.79745L5.00004 6.33335L3.57739 8.79745C3.3933 9.11632 2.98557 9.22557 2.66671 9.04147C2.34785 8.85738 2.2386 8.44965 2.42269 8.13079L3.84534 5.66669Z" fill="#E63655"/>
</svg>
</span>
</label>
<input
id="lastname"
name="lastname"
type="text"
placeholder="Smith"
maxlength="1600"
data-type="text"
/>
</div>
<div id="js-error-lastname" class="st-error-message"></div>
<div class="required">
<label class="st-signupform__label" for="phone">
Phone
<span class="required-mark">
<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.84534 5.66669H1.00004C0.631851 5.66669 0.333374 5.36821 0.333374 5.00002C0.333374 4.63183 0.631851 4.33335 1.00004 4.33335H3.84534L2.42269 1.86925C2.2386 1.55039 2.34785 1.14266 2.66671 0.958568C2.98557 0.774473 3.3933 0.883724 3.57739 1.20259L5.00004 3.66669L6.42269 1.20259C6.60679 0.883724 7.01451 0.774473 7.33337 0.958568C7.65224 1.14266 7.76149 1.55039 7.57739 1.86925L6.15474 4.33335H9.00004C9.36823 4.33335 9.66671 4.63183 9.66671 5.00002C9.66671 5.36821 9.36823 5.66669 9.00004 5.66669H6.15474L7.57739 8.13079C7.76149 8.44965 7.65224 8.85738 7.33337 9.04147C7.01451 9.22557 6.60679 9.11632 6.42269 8.79745L5.00004 6.33335L3.57739 8.79745C3.3933 9.11632 2.98557 9.22557 2.66671 9.04147C2.34785 8.85738 2.2386 8.44965 2.42269 8.13079L3.84534 5.66669Z" fill="#E63655"/>
</svg>
</span>
</label>
<input
id="phone"
name="phone"
type="text"
placeholder="(XXX) XXX-XXXX"
maxlength="1600"
data-type="phone"
/>
</div>
<div id="js-error-phone" class="st-error-message"></div>
<div class="required">
<label class="st-signupform__label" for="birthday">
Birthday
<span class="required-mark">
<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.84534 5.66669H1.00004C0.631851 5.66669 0.333374 5.36821 0.333374 5.00002C0.333374 4.63183 0.631851 4.33335 1.00004 4.33335H3.84534L2.42269 1.86925C2.2386 1.55039 2.34785 1.14266 2.66671 0.958568C2.98557 0.774473 3.3933 0.883724 3.57739 1.20259L5.00004 3.66669L6.42269 1.20259C6.60679 0.883724 7.01451 0.774473 7.33337 0.958568C7.65224 1.14266 7.76149 1.55039 7.57739 1.86925L6.15474 4.33335H9.00004C9.36823 4.33335 9.66671 4.63183 9.66671 5.00002C9.66671 5.36821 9.36823 5.66669 9.00004 5.66669H6.15474L7.57739 8.13079C7.76149 8.44965 7.65224 8.85738 7.33337 9.04147C7.01451 9.22557 6.60679 9.11632 6.42269 8.79745L5.00004 6.33335L3.57739 8.79745C3.3933 9.11632 2.98557 9.22557 2.66671 9.04147C2.34785 8.85738 2.2386 8.44965 2.42269 8.13079L3.84534 5.66669Z" fill="#E63655"/>
</svg>
</span>
</label>
<input
id="birthday"
name="birthday"
type="text"
placeholder="mm/dd/yyyy (example: 11/14/2024) - You must be over 21"
maxlength="1600"
data-type="date"
/>
</div>
<div id="js-error-birthday" class="st-error-message"></div>
<div class="required">
<label class="st-signupform__label" for="list">
Your Interests
<span class="required-mark">
<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.84534 5.66669H1.00004C0.631851 5.66669 0.333374 5.36821 0.333374 5.00002C0.333374 4.63183 0.631851 4.33335 1.00004 4.33335H3.84534L2.42269 1.86925C2.2386 1.55039 2.34785 1.14266 2.66671 0.958568C2.98557 0.774473 3.3933 0.883724 3.57739 1.20259L5.00004 3.66669L6.42269 1.20259C6.60679 0.883724 7.01451 0.774473 7.33337 0.958568C7.65224 1.14266 7.76149 1.55039 7.57739 1.86925L6.15474 4.33335H9.00004C9.36823 4.33335 9.66671 4.63183 9.66671 5.00002C9.66671 5.36821 9.36823 5.66669 9.00004 5.66669H6.15474L7.57739 8.13079C7.76149 8.44965 7.65224 8.85738 7.33337 9.04147C7.01451 9.22557 6.60679 9.11632 6.42269 8.79745L5.00004 6.33335L3.57739 8.79745C3.3933 9.11632 2.98557 9.22557 2.66671 9.04147C2.34785 8.85738 2.2386 8.44965 2.42269 8.13079L3.84534 5.66669Z" fill="#E63655"/>
</svg>
</span>
</label>
<div class="st-checkbox-list">
<div class="st-checkbox st-field-option">
<input
id="list-67367c8b32e5863be71bb7af"
name="list"
type="checkbox"
data-type="select"
value="67367c8b32e5863be71bb7af"
/>
<label
for="list-67367c8b32e5863be71bb7af"
title="Club News"
> Club News</label>
</div>
<div class="st-checkbox st-field-option">
<input
id="list-67367bf52920b2581759c28a"
name="list"
type="checkbox"
data-type="select"
value="67367bf52920b2581759c28a"
/>
<label
for="list-67367bf52920b2581759c28a"
title="Order Status"
> Order Status</label>
</div>
<div class="st-checkbox st-field-option">
<input
id="list-67367c4532e5863be71ba990"
name="list"
type="checkbox"
data-type="select"
value="67367c4532e5863be71ba990"
/>
<label
for="list-67367c4532e5863be71ba990"
title="Tasting Room Specials"
> Tasting Room Specials</label>
</div>
<div class="st-checkbox st-field-option">
<input
id="list-67367cb432e5863be71bbfd4"
name="list"
type="checkbox"
data-type="select"
value="67367cb432e5863be71bbfd4"
/>
<label
for="list-67367cb432e5863be71bbfd4"
title="Upcoming Events"
> Upcoming Events</label>
</div>
</div>
</div>
<div id="js-error-list" class="st-error-message"></div>
<div class="st-terms-and-conditions">
<div class="st-checkbox terms-checkbox">
<input id="terms-agreed-checkbox-67367df632e5863be71bfe4e" type="checkbox" name="terms-agreed" />
<label class="st-terms-and-conditions-text" for="terms-agreed-checkbox-67367df632e5863be71bfe4e">
Terms and conditions
</label>
</div>
<div class="st-terms-and-conditions-caption st-font-caption">
I'M OVER 21 YEARS OLD and agree to receive promotional messages sent via an autodialer. This agreement isn’t a condition of any purchase. I also agree to the
<a href="https://app2.simpletexting.com/web-forms/terms/67367df632e5863be71bfe4e" target="_blank">Terms of Service</a> and
<a href="https://app2.simpletexting.com/web-forms/privacy-policy/67367df632e5863be71bfe4e" target="_blank">Privacy Policy</a>
4 Msgs/Month. Msg & Data rates may apply.</br></br>
</div>
<div class="st-signupform-terms-agreed-error st-hidden">
You have to agree on terms in order to proceed to the subscription.
</div>
</div>
<div class="st-join-web-form-submit-button-box">
<button id="subscribeNow" type="submit">Subscribe now</button>
<p class="st-signupform-server-error-message st-color-red st-hidden"></p>
</div>
</div>
<div class="step2-confirmationText" style="display: none;">
<p>
Thank you for signing up! You will receive messages from Pope Valley Winery.
</p>
</div>
<footer>
SMS wine marketing powered by
<a href="https://www.vinteractive.com" title="SMS wine marketing - VinterActive.com">VinterActive LLC</a>
</footer>
</form>
</div>
</body>
</html>