Public Access
feat(bootcamp): waiting-list form for another timezone or language
Three bootcamp pages (EN/DE/ES) get a small waiting-list block below the Buy button, in the Price and booking section next to the live seat count. - two required fields: email + comment; framed as "another timezone or language?" and worded around the January cohort's own schedule - posts to the same n8n CRM webhook as the site's other forms, with the footer-message payload shape copied exactly: area:'message', requirements carries the comment, no name field, wrapped in UTM.inject() - success hides the form and shows a confirmation; a failure restores the button and shows a retryable error (never stuck on "sending") - Plausible event 'Bootcamp Waitlist' on success only (cookieless); no Google Ads tag and no conversion, as on the rest of these pages - new page-local /static/bootcamp-waitlist.js carries the verbatim UTM helpers from script.js (this page does not load script.js) - buying is untouched: no markup change to the three product-17 forms Verified: exact posted body per language captured on the wire, success and error states in a real browser, 375 px no overflow, verify-html 0, JS syntax 0, competitor QC 0 new, impeccable detect byte-identical (zero new findings).
This commit is contained in:
1 parent
812571b177
commit
8f72652ada
4 files changed
+393
No files matched your search
@@ -452,6 +452,77 @@
|
||||
.btn-brass:focus-visible {
|
||||
outline-color: #fff;
|
||||
}
|
||||
/* Waiting list — for someone who cannot attend the January cohort.
|
||||
Deliberately quieter than the Buy button: outline button, smaller type, no brass fill. */
|
||||
.bc-waitlist {
|
||||
/* Component-scoped error colour: the site has no shared token for it. */
|
||||
--wl-error: #b02a37;
|
||||
max-width: 720px;
|
||||
margin: 2.5rem auto 0;
|
||||
padding: 1.5rem;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--radius);
|
||||
background: var(--ivory);
|
||||
text-align: left;
|
||||
}
|
||||
.bc-wl-title {
|
||||
margin: 0 0 0.5rem;
|
||||
font-size: 1.1rem;
|
||||
color: var(--ink);
|
||||
}
|
||||
.bc-wl-lead {
|
||||
margin: 0 0 1.1rem;
|
||||
font-size: 0.88rem;
|
||||
line-height: 1.6;
|
||||
color: rgba(23, 28, 38, 0.78); /* the page's own .bc-note value, on the same cream */
|
||||
}
|
||||
.bc-wl-form input,
|
||||
.bc-wl-form textarea {
|
||||
display: block;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 0.6rem;
|
||||
padding: 0.6rem 0.75rem;
|
||||
font-family: Inter, sans-serif;
|
||||
font-size: 0.9rem;
|
||||
color: var(--ink);
|
||||
background: #fff;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--radius);
|
||||
}
|
||||
.bc-wl-form textarea {
|
||||
min-height: 3.4rem;
|
||||
resize: vertical;
|
||||
}
|
||||
.bc-wl-btn {
|
||||
padding: 0.6rem 1.5rem;
|
||||
font-size: 0.8rem;
|
||||
background: transparent;
|
||||
color: var(--ink);
|
||||
border-color: rgba(23, 28, 38, 0.35);
|
||||
}
|
||||
.bc-wl-btn:hover {
|
||||
border-color: var(--brass);
|
||||
background: rgba(201, 162, 39, 0.12);
|
||||
transform: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.bc-wl-btn:disabled {
|
||||
opacity: 0.6;
|
||||
cursor: default;
|
||||
}
|
||||
.bc-wl-success {
|
||||
margin: 0;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
color: var(--success);
|
||||
}
|
||||
.bc-wl-error {
|
||||
margin: 0;
|
||||
font-size: 0.9rem;
|
||||
color: var(--wl-error);
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
@@ -783,6 +854,24 @@
|
||||
<button type="submit" class="btn btn-brass btn-lg">Für 595.00 USD kaufen</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- Waiting list: for a visitor who cannot attend the January cohort.
|
||||
Secondary to the Buy button above. Same CRM webhook and same payload shape as the
|
||||
site's footer contact form (area:'message'); the copy lives here, in the page's
|
||||
language, and /static/bootcamp-waitlist.js carries no strings. -->
|
||||
<div class="bc-waitlist">
|
||||
<h3 class="bc-wl-title">Andere Zeitzone oder andere Sprache?</h3>
|
||||
<p class="bc-wl-lead">Der Januar-Kurs läuft donnerstags 18:00–19:00 US-Zentralzeit, auf Englisch. Wenn Sie eine andere Uhrzeit oder eine andere Sprache brauchen, tragen Sie sich in die Warteliste ein. Wir schreiben Ihnen, sobald ein passender Kurs startet.</p>
|
||||
<form id="bcWaitlistForm" class="bc-wl-form" action="mailto:hello@odoo4projects.com" method="post" enctype="text/plain">
|
||||
<label class="bc-sr-only" for="bcWaitlistEmail">Ihre E-Mail-Adresse</label>
|
||||
<input type="email" id="bcWaitlistEmail" name="email" placeholder="Ihre E-Mail-Adresse" required />
|
||||
<label class="bc-sr-only" for="bcWaitlistComment">Welche Zeitzone oder Sprache Sie brauchen</label>
|
||||
<textarea id="bcWaitlistComment" name="comment" rows="2" placeholder="Welche Zeitzone oder Sprache brauchen Sie?" required></textarea>
|
||||
<button type="submit" class="btn bc-wl-btn" data-sending="Wird eingetragen…">In die Warteliste eintragen</button>
|
||||
</form>
|
||||
<p class="bc-wl-success" id="bcWaitlistSuccess" role="status" style="display:none">Sie stehen auf der Warteliste. Wir schreiben Ihnen, sobald ein Kurs in Ihrer Zeitzone oder Sprache angekündigt wird.</p>
|
||||
<p class="bc-wl-error" id="bcWaitlistError" role="alert" style="display:none">Etwas ist schiefgelaufen. Bitte versuchen Sie es erneut.</p>
|
||||
</div>
|
||||
<ul class="bc-related">
|
||||
<li><a href="/de/support.html#contact">Fragen vor der Buchung? Sprechen Sie zuerst mit uns</a></li>
|
||||
<li><a href="/de/odoo-hosting-2027.html">Wie das Hosting nach Ihrem Jahr bei uns aussieht</a></li>
|
||||
@@ -881,6 +970,7 @@
|
||||
</footer>
|
||||
<script defer src="/static/buy.js"></script>
|
||||
<script defer src="/static/bootcamp-availability.js"></script>
|
||||
<script defer src="/static/bootcamp-waitlist.js"></script>
|
||||
<script defer src="/static/lang.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in new issue
Block a user