Oliver/ODOO4projects.com
Public Access
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf(bootcamp): fix CLS/LCP + a11y on EN/DE/ES; add the missing footer-form handler

Browse Source 
PageSpeed pass on /odoo-erp-automation-bootcamp/ (EN + DE + ES):

- CLS: /style.css was deferred via media="print" onload=... → unstyled first paint
  shifted BODY 0.31 (live CLS 0.326). Now a normal <link rel="stylesheet">; the two
  hero webp files are preloaded (fetchpriority=high) by viewport.
- a11y: footer <h4> → <h3> (heading-order), a lighter brass + underline for links
  inside on-dark notes (color-contrast, link-in-text-block), .fcopy 3.2:1 → 5.17:1.
- best-practices: the footer contact forms and the waiting-list form now post to the
  CRM webhook instead of action="mailto:", which Lighthouse flags as an insecure
  request (is-on-https 0 → 1). No Google Ads tag on these pages (no consent gate).
- regression fix: these pages do NOT load /script.js, so after the action change the
  footer form had no JS handler and a submit navigated the visitor to the webhook's raw
  JSON reply. static/bootcamp-waitlist.js now carries a footer-form handler mirroring
  /script.js one-for-one (same webhook, payload { email, requirements, area:'message' }
  in UTM.inject, success/failure behaviour); its two strings are read from the form's
  own data-ok / data-err attributes so each language keeps its own text. ENDPOINT
  hoisted to module scope so both handlers share it.
- no-JS path: a <noscript> footer line with support@ODOO4projects.com as a plain
  mailto link. Verified it does not re-trigger is-on-https (unlike a mailto FORM action).

Guards held: Buy forms still post product_id 17; exactly one [data-bc-seats];
waitlist still posts area:'message'; plausible snippet present; competitor QC exit 0.
This commit is contained in:
webmaster committed 2026-11-02 16:07:20 +00:00
1 parent bc942cdb7c
commit 2aa9b19c3c
4 files changed
+203 -32
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

de/odoo-erp-automation-bootcamp/index.html
+46 -10
View File
@@ -31,8 +31,9 @@
onload="this.media='all'" onload="this.media='all'"
/> />
<noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Marcellus&display=swap" /></noscript> <noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Marcellus&display=swap" /></noscript>
<link rel="stylesheet" href="/style.css" media="print" onload="this.media='all'" /> <link rel="preload" as="image" href="/images/hero/bootcamp-hero-mobile-900.webp" media="(max-width: 640px)" fetchpriority="high" />
<noscript><link rel="stylesheet" href="/style.css" /></noscript> <link rel="preload" as="image" href="/images/hero/bootcamp-hero-desktop-1920.webp" media="(min-width: 641px)" fetchpriority="high" />
<link rel="stylesheet" href="/style.css" />
<style> <style>
/* ---- ODOO ERP Automation Bootcamp landing page (page-scoped; additive) ---- */ /* ---- ODOO ERP Automation Bootcamp landing page (page-scoped; additive) ---- */
.bc-sr-only { .bc-sr-only {
@@ -231,7 +232,7 @@
border-radius: var(--radius-lg); border-radius: var(--radius-lg);
box-shadow: var(--shadow-rest); box-shadow: var(--shadow-rest);
padding: 1.4rem 1.4rem 1.4rem 3.4rem; padding: 1.4rem 1.4rem 1.4rem 3.4rem;
transition: box-shadow 0.25s, transform 0.25s; transition: transform 0.25s; /* box-shadow kept, not transitioned (non-composited) */
} }
.bc-lessons li:hover { .bc-lessons li:hover {
box-shadow: var(--shadow-hover); box-shadow: var(--shadow-hover);
@@ -321,7 +322,7 @@
.bc-schedule dt { .bc-schedule dt {
font-family: Marcellus, Georgia, serif; font-family: Marcellus, Georgia, serif;
font-size: 0.92rem; font-size: 0.92rem;
color: var(--brass-deep); color: #876c1e; /* 4.68:1 on --ivory (was --brass-deep 4.49:1) */
} }
.bc-schedule dd { .bc-schedule dd {
margin: 0; margin: 0;
@@ -531,6 +532,38 @@
color: var(--wl-error); color: var(--wl-error);
} }
/* --- 2026-11-02 PageSpeed pass (page-scoped, additive) ---------------------
1. The footer <h4>s became <h3>s so the heading order descends after the last
section h2 (a11y "heading-order"); these rules keep their look identical to
the shared .footer h4 in /style.css.
2. A link inside an on-dark note is the lighter brass (7.15:1 on midnight,
A11y "color-contrast") and underlined, so it is distinguishable without
colour (A11y "link-in-text-block"). */
.footer h3 {
font-family: Marcellus, Georgia, serif;
color: #fff;
margin-bottom: 0.8rem;
font-size: 1rem;
letter-spacing: 0.03em;
}
.bc-note.on-dark a {
color: var(--brass);
text-decoration: underline;
}
/* the footer copyright line at .35 alpha was 3.2:1 on midnight */
.footer .fcopy {
color: rgba(255, 255, 255, 0.5); /* 5.17:1 */
}
/* no-JS footer fallback (rendered only when JavaScript is off) */
.footer .bc-noscript {
margin-top: 0.6rem;
font-size: 0.85rem;
}
.footer .bc-noscript a {
color: var(--brass);
text-decoration: underline;
}
</style> </style>
<script type="application/ld+json"> <script type="application/ld+json">
{ {
@@ -655,6 +688,7 @@
</div> </div>
<!-- Hero --> <!-- Hero -->
<main>
<section class="hero bc-hero"> <section class="hero bc-hero">
<div class="container"> <div class="container">
<p class="hero-kicker">Q1 2027 &middot; 10 LIVE-SESSIONS &middot; OLIVER ARNOLD</p> <p class="hero-kicker">Q1 2027 &middot; 10 LIVE-SESSIONS &middot; OLIVER ARNOLD</p>
@@ -876,7 +910,7 @@
<div class="bc-waitlist"> <div class="bc-waitlist">
<h3 class="bc-wl-title">Andere Zeitzone oder andere Sprache?</h3> <h3 class="bc-wl-title">Andere Zeitzone oder andere Sprache?</h3>
<p class="bc-wl-lead">Der Januar-Kurs läuft donnerstags 18:00&ndash;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> <p class="bc-wl-lead">Der Januar-Kurs läuft donnerstags 18:00&ndash;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"> <form id="bcWaitlistForm" class="bc-wl-form" action="https://n8n.odoo4projects.com/webhook/ODOO4projects/crm" method="post" enctype="text/plain">
<label class="bc-sr-only" for="bcWaitlistEmail">Ihre E-Mail-Adresse</label> <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 /> <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> <label class="bc-sr-only" for="bcWaitlistComment">Welche Zeitzone oder Sprache Sie brauchen</label>
@@ -933,6 +967,7 @@
</div> </div>
</div> </div>
</section> </section>
</main>
<!-- Footer (copied from index.html; icon-font glyphs replaced with inline SVG so the page <!-- Footer (copied from index.html; icon-font glyphs replaced with inline SVG so the page
carries no external icon dependency) --> carries no external icon dependency) -->
@@ -940,7 +975,7 @@
<div class="container"> <div class="container">
<div class="fgrid"> <div class="fgrid">
<div> <div>
<h4>Nützliche Links</h4> <h3>Nützliche Links</h3>
<ul> <ul>
<li><a href="/de/odoo-erp-automation-bootcamp/">ODOO Bootcamp</a></li> <li><a href="/de/odoo-erp-automation-bootcamp/">ODOO Bootcamp</a></li>
<li><a href="/de/odoo-hosting-2027.html">ODOO Hosting in 2027</a></li> <li><a href="/de/odoo-hosting-2027.html">ODOO Hosting in 2027</a></li>
@@ -949,7 +984,7 @@
</ul> </ul>
</div> </div>
<div> <div>
<h4>Partner</h4> <h3>Partner</h3>
<div class="partner-list"> <div class="partner-list">
<a href="https://oc-guy.com" target="_blank" rel="noopener" class="partner-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#c9a227" stroke-width="2" aria-hidden="true"><path d="M20 7h-9M14 17H5M20 7l-4-4M20 7l-4 4M4 17l4 4M4 17l4-4" /></svg> OC Guy</a> <a href="https://oc-guy.com" target="_blank" rel="noopener" class="partner-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#c9a227" stroke-width="2" aria-hidden="true"><path d="M20 7h-9M14 17H5M20 7l-4-4M20 7l-4 4M4 17l4 4M4 17l4-4" /></svg> OC Guy</a>
<a href="https://oca-py.org" target="_blank" rel="noopener" class="partner-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#c9a227" stroke-width="2" aria-hidden="true"><path d="M20 7h-9M14 17H5M20 7l-4-4M20 7l-4 4M4 17l4 4M4 17l4-4" /></svg> OCA Paraguay</a> <a href="https://oca-py.org" target="_blank" rel="noopener" class="partner-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#c9a227" stroke-width="2" aria-hidden="true"><path d="M20 7h-9M14 17H5M20 7l-4-4M20 7l-4 4M4 17l4 4M4 17l4-4" /></svg> OCA Paraguay</a>
@@ -957,17 +992,17 @@
</div> </div>
</div> </div>
<div class="fcol-desc"> <div class="fcol-desc">
<h4>Über uns</h4> <h3>Über uns</h3>
<p>Wir bauen clevere, skalierbare Geschäftslösungen: die <strong>Stabilität</strong> von Odoo ERP trifft auf die <strong>Kraft</strong> von KI-Agenten und N8N-Automatisierungen.</p> <p>Wir bauen clevere, skalierbare Geschäftslösungen: die <strong>Stabilität</strong> von Odoo ERP trifft auf die <strong>Kraft</strong> von KI-Agenten und N8N-Automatisierungen.</p>
<p>Von schlanken Vertriebsprozessen bis zum globalen Rollout: Unser <strong>schlanker, umweltfreundlicher</strong> Ansatz senkt Kosten, steigert die Effizienz und lässt Unternehmen ohne Grenzen wachsen.</p> <p>Von schlanken Vertriebsprozessen bis zum globalen Rollout: Unser <strong>schlanker, umweltfreundlicher</strong> Ansatz senkt Kosten, steigert die Effizienz und lässt Unternehmen ohne Grenzen wachsen.</p>
</div> </div>
<div> <div>
<h4>Folgen Sie uns</h4> <h3>Folgen Sie uns</h3>
<div class="social"> <div class="social">
<a href="https://www.linkedin.com/company/odoo4projects/" target="_blank" aria-label="LinkedIn"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M4.98 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-.95 1.83-1.95 3.76-1.95 4.02 0 4.76 2.5 4.76 5.75V21h-4v-5.5c0-1.31-.02-3-1.9-3-1.9 0-2.19 1.42-2.19 2.9V21H9z" /></svg></a> <a href="https://www.linkedin.com/company/odoo4projects/" target="_blank" aria-label="LinkedIn"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M4.98 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-.95 1.83-1.95 3.76-1.95 4.02 0 4.76 2.5 4.76 5.75V21h-4v-5.5c0-1.31-.02-3-1.9-3-1.9 0-2.19 1.42-2.19 2.9V21H9z" /></svg></a>
<a href="https://www.youtube.com/@ODOO4projects" target="_blank" aria-label="YouTube"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M23 12s0-3.2-.41-4.73a2.5 2.5 0 0 0-1.76-1.77C19.3 5.1 12 5.1 12 5.1s-7.3 0-8.83.4A2.5 2.5 0 0 0 1.4 7.27C1 8.8 1 12 1 12s0 3.2.41 4.73a2.5 2.5 0 0 0 1.76 1.77c1.53.4 8.83.4 8.83.4s7.3 0 8.83-.4a2.5 2.5 0 0 0 1.76-1.77C23 15.2 23 12 23 12zM9.75 15.02V8.98L15.5 12z" /></svg></a> <a href="https://www.youtube.com/@ODOO4projects" target="_blank" aria-label="YouTube"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M23 12s0-3.2-.41-4.73a2.5 2.5 0 0 0-1.76-1.77C19.3 5.1 12 5.1 12 5.1s-7.3 0-8.83.4A2.5 2.5 0 0 0 1.4 7.27C1 8.8 1 12 1 12s0 3.2.41 4.73a2.5 2.5 0 0 0 1.76 1.77c1.53.4 8.83.4 8.83.4s7.3 0 8.83-.4a2.5 2.5 0 0 0 1.76-1.77C23 15.2 23 12 23 12zM9.75 15.02V8.98L15.5 12z" /></svg></a>
</div> </div>
<form class="footer-contact-form" id="footerContactForm" action="mailto:hello@odoo4projects.com" method="post" enctype="text/plain"> <form class="footer-contact-form" id="footerContactForm" action="https://n8n.odoo4projects.com/webhook/ODOO4projects/crm" method="post" enctype="text/plain" data-ok="Danke! Wir melden uns in Kürze bei Ihnen." data-err="Etwas ist schiefgelaufen. Bitte versuchen Sie es erneut.">
<label class="bc-sr-only" for="footerContactEmail">Ihre E-Mail-Adresse</label> <label class="bc-sr-only" for="footerContactEmail">Ihre E-Mail-Adresse</label>
<input type="email" id="footerContactEmail" name="email" placeholder="Ihre E-Mail-Adresse" required /> <input type="email" id="footerContactEmail" name="email" placeholder="Ihre E-Mail-Adresse" required />
<div class="footer-textarea-wrap"> <div class="footer-textarea-wrap">
@@ -977,6 +1012,7 @@
</div> </div>
<div class="footer-form-status" id="footerFormStatus" role="status"></div> <div class="footer-form-status" id="footerFormStatus" role="status"></div>
</form> </form>
<noscript><p class="bc-noscript">JavaScript ist deaktiviert. Schreiben Sie uns direkt an <a href="mailto:support@ODOO4projects.com">support@ODOO4projects.com</a>.</p></noscript>
</div> </div>
</div> </div>
<div class="fcopy">Copyright &copy; ODOO4projects LLC</div> <div class="fcopy">Copyright &copy; ODOO4projects LLC</div>
es/odoo-erp-automation-bootcamp/index.html
+46 -10
View File
@@ -31,8 +31,9 @@
onload="this.media='all'" onload="this.media='all'"
/> />
<noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Marcellus&display=swap" /></noscript> <noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Marcellus&display=swap" /></noscript>
<link rel="stylesheet" href="/style.css" media="print" onload="this.media='all'" /> <link rel="preload" as="image" href="/images/hero/bootcamp-hero-mobile-900.webp" media="(max-width: 640px)" fetchpriority="high" />
<noscript><link rel="stylesheet" href="/style.css" /></noscript> <link rel="preload" as="image" href="/images/hero/bootcamp-hero-desktop-1920.webp" media="(min-width: 641px)" fetchpriority="high" />
<link rel="stylesheet" href="/style.css" />
<style> <style>
/* ---- ODOO ERP Automation Bootcamp landing page (page-scoped; additive) ---- */ /* ---- ODOO ERP Automation Bootcamp landing page (page-scoped; additive) ---- */
.bc-sr-only { .bc-sr-only {
@@ -231,7 +232,7 @@
border-radius: var(--radius-lg); border-radius: var(--radius-lg);
box-shadow: var(--shadow-rest); box-shadow: var(--shadow-rest);
padding: 1.4rem 1.4rem 1.4rem 3.4rem; padding: 1.4rem 1.4rem 1.4rem 3.4rem;
transition: box-shadow 0.25s, transform 0.25s; transition: transform 0.25s; /* box-shadow kept, not transitioned (non-composited) */
} }
.bc-lessons li:hover { .bc-lessons li:hover {
box-shadow: var(--shadow-hover); box-shadow: var(--shadow-hover);
@@ -321,7 +322,7 @@
.bc-schedule dt { .bc-schedule dt {
font-family: Marcellus, Georgia, serif; font-family: Marcellus, Georgia, serif;
font-size: 0.92rem; font-size: 0.92rem;
color: var(--brass-deep); color: #876c1e; /* 4.68:1 on --ivory (was --brass-deep 4.49:1) */
} }
.bc-schedule dd { .bc-schedule dd {
margin: 0; margin: 0;
@@ -531,6 +532,38 @@
color: var(--wl-error); color: var(--wl-error);
} }
/* --- 2026-11-02 PageSpeed pass (page-scoped, additive) ---------------------
1. The footer <h4>s became <h3>s so the heading order descends after the last
section h2 (a11y "heading-order"); these rules keep their look identical to
the shared .footer h4 in /style.css.
2. A link inside an on-dark note is the lighter brass (7.15:1 on midnight,
A11y "color-contrast") and underlined, so it is distinguishable without
colour (A11y "link-in-text-block"). */
.footer h3 {
font-family: Marcellus, Georgia, serif;
color: #fff;
margin-bottom: 0.8rem;
font-size: 1rem;
letter-spacing: 0.03em;
}
.bc-note.on-dark a {
color: var(--brass);
text-decoration: underline;
}
/* the footer copyright line at .35 alpha was 3.2:1 on midnight */
.footer .fcopy {
color: rgba(255, 255, 255, 0.5); /* 5.17:1 */
}
/* no-JS footer fallback (rendered only when JavaScript is off) */
.footer .bc-noscript {
margin-top: 0.6rem;
font-size: 0.85rem;
}
.footer .bc-noscript a {
color: var(--brass);
text-decoration: underline;
}
</style> </style>
<script type="application/ld+json"> <script type="application/ld+json">
{ {
@@ -655,6 +688,7 @@
</div> </div>
<!-- Hero --> <!-- Hero -->
<main>
<section class="hero bc-hero"> <section class="hero bc-hero">
<div class="container"> <div class="container">
<p class="hero-kicker">Q1 2027 &middot; 10 SESIONES EN DIRECTO &middot; OLIVER ARNOLD</p> <p class="hero-kicker">Q1 2027 &middot; 10 SESIONES EN DIRECTO &middot; OLIVER ARNOLD</p>
@@ -876,7 +910,7 @@
<div class="bc-waitlist"> <div class="bc-waitlist">
<h3 class="bc-wl-title">&iquest;Otra zona horaria u otro idioma?</h3> <h3 class="bc-wl-title">&iquest;Otra zona horaria u otro idioma?</h3>
<p class="bc-wl-lead">El grupo de enero se reúne los jueves, 18:00&ndash;19:00, hora del centro de EE. UU., en inglés. Si necesita otro horario u otro idioma, apúntese a la lista de espera y le escribiremos cuando se abra un grupo que le encaje.</p> <p class="bc-wl-lead">El grupo de enero se reúne los jueves, 18:00&ndash;19:00, hora del centro de EE. UU., en inglés. Si necesita otro horario u otro idioma, apúntese a la lista de espera y le escribiremos cuando se abra un grupo que le encaje.</p>
<form id="bcWaitlistForm" class="bc-wl-form" action="mailto:hello@odoo4projects.com" method="post" enctype="text/plain"> <form id="bcWaitlistForm" class="bc-wl-form" action="https://n8n.odoo4projects.com/webhook/ODOO4projects/crm" method="post" enctype="text/plain">
<label class="bc-sr-only" for="bcWaitlistEmail">Su dirección de correo electrónico</label> <label class="bc-sr-only" for="bcWaitlistEmail">Su dirección de correo electrónico</label>
<input type="email" id="bcWaitlistEmail" name="email" placeholder="Su dirección de correo electrónico" required /> <input type="email" id="bcWaitlistEmail" name="email" placeholder="Su dirección de correo electrónico" required />
<label class="bc-sr-only" for="bcWaitlistComment">Qu&eacute; zona horaria o idioma necesita</label> <label class="bc-sr-only" for="bcWaitlistComment">Qu&eacute; zona horaria o idioma necesita</label>
@@ -933,6 +967,7 @@
</div> </div>
</div> </div>
</section> </section>
</main>
<!-- Footer (copied from index.html; icon-font glyphs replaced with inline SVG so the page <!-- Footer (copied from index.html; icon-font glyphs replaced with inline SVG so the page
carries no external icon dependency) --> carries no external icon dependency) -->
@@ -940,7 +975,7 @@
<div class="container"> <div class="container">
<div class="fgrid"> <div class="fgrid">
<div> <div>
<h4>Enlaces útiles</h4> <h3>Enlaces útiles</h3>
<ul> <ul>
<li><a href="/es/odoo-erp-automation-bootcamp/">ODOO Bootcamp</a></li> <li><a href="/es/odoo-erp-automation-bootcamp/">ODOO Bootcamp</a></li>
<li><a href="/es/odoo-hosting-2027.html">ODOO Hosting en 2027</a></li> <li><a href="/es/odoo-hosting-2027.html">ODOO Hosting en 2027</a></li>
@@ -949,7 +984,7 @@
</ul> </ul>
</div> </div>
<div> <div>
<h4>Socios</h4> <h3>Socios</h3>
<div class="partner-list"> <div class="partner-list">
<a href="https://oc-guy.com" target="_blank" rel="noopener" class="partner-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#c9a227" stroke-width="2" aria-hidden="true"><path d="M20 7h-9M14 17H5M20 7l-4-4M20 7l-4 4M4 17l4 4M4 17l4-4" /></svg> OC Guy</a> <a href="https://oc-guy.com" target="_blank" rel="noopener" class="partner-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#c9a227" stroke-width="2" aria-hidden="true"><path d="M20 7h-9M14 17H5M20 7l-4-4M20 7l-4 4M4 17l4 4M4 17l4-4" /></svg> OC Guy</a>
<a href="https://oca-py.org" target="_blank" rel="noopener" class="partner-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#c9a227" stroke-width="2" aria-hidden="true"><path d="M20 7h-9M14 17H5M20 7l-4-4M20 7l-4 4M4 17l4 4M4 17l4-4" /></svg> OCA Paraguay</a> <a href="https://oca-py.org" target="_blank" rel="noopener" class="partner-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#c9a227" stroke-width="2" aria-hidden="true"><path d="M20 7h-9M14 17H5M20 7l-4-4M20 7l-4 4M4 17l4 4M4 17l4-4" /></svg> OCA Paraguay</a>
@@ -957,17 +992,17 @@
</div> </div>
</div> </div>
<div class="fcol-desc"> <div class="fcol-desc">
<h4>Sobre nosotros</h4> <h3>Sobre nosotros</h3>
<p>Creamos soluciones de negocio inteligentes y escalables combinando la <strong>estabilidad</strong> de Odoo ERP con la <strong>potencia</strong> de los agentes de IA y las automatizaciones N8N.</p> <p>Creamos soluciones de negocio inteligentes y escalables combinando la <strong>estabilidad</strong> de Odoo ERP con la <strong>potencia</strong> de los agentes de IA y las automatizaciones N8N.</p>
<p>Desde unas ventas ágiles hasta despliegues globales, nuestro <strong>lean y ecológico</strong> enfoque ayuda a las empresas a reducir costes, ganar eficiencia y crecer sin límites.</p> <p>Desde unas ventas ágiles hasta despliegues globales, nuestro <strong>lean y ecológico</strong> enfoque ayuda a las empresas a reducir costes, ganar eficiencia y crecer sin límites.</p>
</div> </div>
<div> <div>
<h4>Síganos</h4> <h3>Síganos</h3>
<div class="social"> <div class="social">
<a href="https://www.linkedin.com/company/odoo4projects/" target="_blank" aria-label="LinkedIn"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M4.98 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-.95 1.83-1.95 3.76-1.95 4.02 0 4.76 2.5 4.76 5.75V21h-4v-5.5c0-1.31-.02-3-1.9-3-1.9 0-2.19 1.42-2.19 2.9V21H9z" /></svg></a> <a href="https://www.linkedin.com/company/odoo4projects/" target="_blank" aria-label="LinkedIn"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M4.98 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-.95 1.83-1.95 3.76-1.95 4.02 0 4.76 2.5 4.76 5.75V21h-4v-5.5c0-1.31-.02-3-1.9-3-1.9 0-2.19 1.42-2.19 2.9V21H9z" /></svg></a>
<a href="https://www.youtube.com/@ODOO4projects" target="_blank" aria-label="YouTube"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M23 12s0-3.2-.41-4.73a2.5 2.5 0 0 0-1.76-1.77C19.3 5.1 12 5.1 12 5.1s-7.3 0-8.83.4A2.5 2.5 0 0 0 1.4 7.27C1 8.8 1 12 1 12s0 3.2.41 4.73a2.5 2.5 0 0 0 1.76 1.77c1.53.4 8.83.4 8.83.4s7.3 0 8.83-.4a2.5 2.5 0 0 0 1.76-1.77C23 15.2 23 12 23 12zM9.75 15.02V8.98L15.5 12z" /></svg></a> <a href="https://www.youtube.com/@ODOO4projects" target="_blank" aria-label="YouTube"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M23 12s0-3.2-.41-4.73a2.5 2.5 0 0 0-1.76-1.77C19.3 5.1 12 5.1 12 5.1s-7.3 0-8.83.4A2.5 2.5 0 0 0 1.4 7.27C1 8.8 1 12 1 12s0 3.2.41 4.73a2.5 2.5 0 0 0 1.76 1.77c1.53.4 8.83.4 8.83.4s7.3 0 8.83-.4a2.5 2.5 0 0 0 1.76-1.77C23 15.2 23 12 23 12zM9.75 15.02V8.98L15.5 12z" /></svg></a>
</div> </div>
<form class="footer-contact-form" id="footerContactForm" action="mailto:hello@odoo4projects.com" method="post" enctype="text/plain"> <form class="footer-contact-form" id="footerContactForm" action="https://n8n.odoo4projects.com/webhook/ODOO4projects/crm" method="post" enctype="text/plain" data-ok="¡Gracias! Le responderemos en breve." data-err="Algo ha fallado. Inténtelo de nuevo.">
<label class="bc-sr-only" for="footerContactEmail">Su dirección de correo</label> <label class="bc-sr-only" for="footerContactEmail">Su dirección de correo</label>
<input type="email" id="footerContactEmail" name="email" placeholder="Su dirección de correo" required /> <input type="email" id="footerContactEmail" name="email" placeholder="Su dirección de correo" required />
<div class="footer-textarea-wrap"> <div class="footer-textarea-wrap">
@@ -977,6 +1012,7 @@
</div> </div>
<div class="footer-form-status" id="footerFormStatus" role="status"></div> <div class="footer-form-status" id="footerFormStatus" role="status"></div>
</form> </form>
<noscript><p class="bc-noscript">JavaScript está desactivado. Escríbanos directamente a <a href="mailto:support@ODOO4projects.com">support@ODOO4projects.com</a>.</p></noscript>
</div> </div>
</div> </div>
<div class="fcopy">Copyright &copy; ODOO4projects LLC</div> <div class="fcopy">Copyright &copy; ODOO4projects LLC</div>
odoo-erp-automation-bootcamp/index.html
+46 -10
View File
@@ -31,8 +31,9 @@
onload="this.media='all'" onload="this.media='all'"
/> />
<noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Marcellus&display=swap" /></noscript> <noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Marcellus&display=swap" /></noscript>
<link rel="stylesheet" href="/style.css" media="print" onload="this.media='all'" /> <link rel="preload" as="image" href="/images/hero/bootcamp-hero-mobile-900.webp" media="(max-width: 640px)" fetchpriority="high" />
<noscript><link rel="stylesheet" href="/style.css" /></noscript> <link rel="preload" as="image" href="/images/hero/bootcamp-hero-desktop-1920.webp" media="(min-width: 641px)" fetchpriority="high" />
<link rel="stylesheet" href="/style.css" />
<style> <style>
/* ---- ODOO ERP Automation Bootcamp landing page (page-scoped; additive) ---- */ /* ---- ODOO ERP Automation Bootcamp landing page (page-scoped; additive) ---- */
.bc-sr-only { .bc-sr-only {
@@ -231,7 +232,7 @@
border-radius: var(--radius-lg); border-radius: var(--radius-lg);
box-shadow: var(--shadow-rest); box-shadow: var(--shadow-rest);
padding: 1.4rem 1.4rem 1.4rem 3.4rem; padding: 1.4rem 1.4rem 1.4rem 3.4rem;
transition: box-shadow 0.25s, transform 0.25s; transition: transform 0.25s; /* box-shadow kept, not transitioned (non-composited) */
} }
.bc-lessons li:hover { .bc-lessons li:hover {
box-shadow: var(--shadow-hover); box-shadow: var(--shadow-hover);
@@ -321,7 +322,7 @@
.bc-schedule dt { .bc-schedule dt {
font-family: Marcellus, Georgia, serif; font-family: Marcellus, Georgia, serif;
font-size: 0.92rem; font-size: 0.92rem;
color: var(--brass-deep); color: #876c1e; /* 4.68:1 on --ivory (was --brass-deep 4.49:1) */
} }
.bc-schedule dd { .bc-schedule dd {
margin: 0; margin: 0;
@@ -531,6 +532,38 @@
color: var(--wl-error); color: var(--wl-error);
} }
/* --- 2026-11-02 PageSpeed pass (page-scoped, additive) ---------------------
1. The footer <h4>s became <h3>s so the heading order descends after the last
section h2 (a11y "heading-order"); these rules keep their look identical to
the shared .footer h4 in /style.css.
2. A link inside an on-dark note is the lighter brass (7.15:1 on midnight,
A11y "color-contrast") and underlined, so it is distinguishable without
colour (A11y "link-in-text-block"). */
.footer h3 {
font-family: Marcellus, Georgia, serif;
color: #fff;
margin-bottom: 0.8rem;
font-size: 1rem;
letter-spacing: 0.03em;
}
.bc-note.on-dark a {
color: var(--brass);
text-decoration: underline;
}
/* the footer copyright line at .35 alpha was 3.2:1 on midnight */
.footer .fcopy {
color: rgba(255, 255, 255, 0.5); /* 5.17:1 */
}
/* no-JS footer fallback (rendered only when JavaScript is off) */
.footer .bc-noscript {
margin-top: 0.6rem;
font-size: 0.85rem;
}
.footer .bc-noscript a {
color: var(--brass);
text-decoration: underline;
}
</style> </style>
<script type="application/ld+json"> <script type="application/ld+json">
{ {
@@ -655,6 +688,7 @@
</div> </div>
<!-- Hero --> <!-- Hero -->
<main>
<section class="hero bc-hero"> <section class="hero bc-hero">
<div class="container"> <div class="container">
<p class="hero-kicker">Q1 2027 &middot; 10 LIVE SESSIONS &middot; OLIVER ARNOLD</p> <p class="hero-kicker">Q1 2027 &middot; 10 LIVE SESSIONS &middot; OLIVER ARNOLD</p>
@@ -894,7 +928,7 @@
<div class="bc-waitlist"> <div class="bc-waitlist">
<h3 class="bc-wl-title">Another timezone or language?</h3> <h3 class="bc-wl-title">Another timezone or language?</h3>
<p class="bc-wl-lead">The January cohort runs Thursdays 18:00&ndash;19:00 Central Time, in English. If you need a different time or another language, join the waiting list and we will write to you when a cohort that fits opens.</p> <p class="bc-wl-lead">The January cohort runs Thursdays 18:00&ndash;19:00 Central Time, in English. If you need a different time or another language, join the waiting list and we will write to you when a cohort that fits opens.</p>
<form id="bcWaitlistForm" class="bc-wl-form" action="mailto:hello@odoo4projects.com" method="post" enctype="text/plain"> <form id="bcWaitlistForm" class="bc-wl-form" action="https://n8n.odoo4projects.com/webhook/ODOO4projects/crm" method="post" enctype="text/plain">
<label class="bc-sr-only" for="bcWaitlistEmail">Your email address</label> <label class="bc-sr-only" for="bcWaitlistEmail">Your email address</label>
<input type="email" id="bcWaitlistEmail" name="email" placeholder="Your email address" required /> <input type="email" id="bcWaitlistEmail" name="email" placeholder="Your email address" required />
<label class="bc-sr-only" for="bcWaitlistComment">Which timezone or language you need</label> <label class="bc-sr-only" for="bcWaitlistComment">Which timezone or language you need</label>
@@ -953,6 +987,7 @@
</div> </div>
</div> </div>
</section> </section>
</main>
<!-- Footer (copied from index.html; icon-font glyphs replaced with inline SVG so the page <!-- Footer (copied from index.html; icon-font glyphs replaced with inline SVG so the page
carries no external icon dependency) --> carries no external icon dependency) -->
@@ -960,7 +995,7 @@
<div class="container"> <div class="container">
<div class="fgrid"> <div class="fgrid">
<div> <div>
<h4>Useful Links</h4> <h3>Useful Links</h3>
<ul> <ul>
<li><a href="/odoo-erp-automation-bootcamp/">ODOO Bootcamp</a></li> <li><a href="/odoo-erp-automation-bootcamp/">ODOO Bootcamp</a></li>
<li><a href="/odoo-hosting-2027.html">ODOO Hosting in 2027</a></li> <li><a href="/odoo-hosting-2027.html">ODOO Hosting in 2027</a></li>
@@ -969,7 +1004,7 @@
</ul> </ul>
</div> </div>
<div> <div>
<h4>Partners</h4> <h3>Partners</h3>
<div class="partner-list"> <div class="partner-list">
<a href="https://oc-guy.com" target="_blank" rel="noopener" class="partner-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#c9a227" stroke-width="2" aria-hidden="true"><path d="M20 7h-9M14 17H5M20 7l-4-4M20 7l-4 4M4 17l4 4M4 17l4-4" /></svg> OC Guy</a> <a href="https://oc-guy.com" target="_blank" rel="noopener" class="partner-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#c9a227" stroke-width="2" aria-hidden="true"><path d="M20 7h-9M14 17H5M20 7l-4-4M20 7l-4 4M4 17l4 4M4 17l4-4" /></svg> OC Guy</a>
<a href="https://oca-py.org" target="_blank" rel="noopener" class="partner-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#c9a227" stroke-width="2" aria-hidden="true"><path d="M20 7h-9M14 17H5M20 7l-4-4M20 7l-4 4M4 17l4 4M4 17l4-4" /></svg> OCA Paraguay</a> <a href="https://oca-py.org" target="_blank" rel="noopener" class="partner-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#c9a227" stroke-width="2" aria-hidden="true"><path d="M20 7h-9M14 17H5M20 7l-4-4M20 7l-4 4M4 17l4 4M4 17l4-4" /></svg> OCA Paraguay</a>
@@ -977,17 +1012,17 @@
</div> </div>
</div> </div>
<div class="fcol-desc"> <div class="fcol-desc">
<h4>About us</h4> <h3>About us</h3>
<p>We build smart, scalable business solutions by combining the <strong>stability</strong> of Odoo ERP with the <strong>power</strong> of AI Agents and N8N automations.</p> <p>We build smart, scalable business solutions by combining the <strong>stability</strong> of Odoo ERP with the <strong>power</strong> of AI Agents and N8N automations.</p>
<p>From streamlined sales to global rollouts, our <strong>lean, eco-friendly</strong> approach helps businesses cut costs, boost efficiency, and grow without limits.</p> <p>From streamlined sales to global rollouts, our <strong>lean, eco-friendly</strong> approach helps businesses cut costs, boost efficiency, and grow without limits.</p>
</div> </div>
<div> <div>
<h4>Follow us on</h4> <h3>Follow us on</h3>
<div class="social"> <div class="social">
<a href="https://www.linkedin.com/company/odoo4projects/" target="_blank" aria-label="LinkedIn"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M4.98 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-.95 1.83-1.95 3.76-1.95 4.02 0 4.76 2.5 4.76 5.75V21h-4v-5.5c0-1.31-.02-3-1.9-3-1.9 0-2.19 1.42-2.19 2.9V21H9z" /></svg></a> <a href="https://www.linkedin.com/company/odoo4projects/" target="_blank" aria-label="LinkedIn"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M4.98 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-.95 1.83-1.95 3.76-1.95 4.02 0 4.76 2.5 4.76 5.75V21h-4v-5.5c0-1.31-.02-3-1.9-3-1.9 0-2.19 1.42-2.19 2.9V21H9z" /></svg></a>
<a href="https://www.youtube.com/@ODOO4projects" target="_blank" aria-label="YouTube"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M23 12s0-3.2-.41-4.73a2.5 2.5 0 0 0-1.76-1.77C19.3 5.1 12 5.1 12 5.1s-7.3 0-8.83.4A2.5 2.5 0 0 0 1.4 7.27C1 8.8 1 12 1 12s0 3.2.41 4.73a2.5 2.5 0 0 0 1.76 1.77c1.53.4 8.83.4 8.83.4s7.3 0 8.83-.4a2.5 2.5 0 0 0 1.76-1.77C23 15.2 23 12 23 12zM9.75 15.02V8.98L15.5 12z" /></svg></a> <a href="https://www.youtube.com/@ODOO4projects" target="_blank" aria-label="YouTube"><svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M23 12s0-3.2-.41-4.73a2.5 2.5 0 0 0-1.76-1.77C19.3 5.1 12 5.1 12 5.1s-7.3 0-8.83.4A2.5 2.5 0 0 0 1.4 7.27C1 8.8 1 12 1 12s0 3.2.41 4.73a2.5 2.5 0 0 0 1.76 1.77c1.53.4 8.83.4 8.83.4s7.3 0 8.83-.4a2.5 2.5 0 0 0 1.76-1.77C23 15.2 23 12 23 12zM9.75 15.02V8.98L15.5 12z" /></svg></a>
</div> </div>
<form class="footer-contact-form" id="footerContactForm" action="mailto:hello@odoo4projects.com" method="post" enctype="text/plain"> <form class="footer-contact-form" id="footerContactForm" action="https://n8n.odoo4projects.com/webhook/ODOO4projects/crm" method="post" enctype="text/plain" data-ok="Thanks! We'll get back to you shortly." data-err="Something went wrong. Please try again.">
<label class="bc-sr-only" for="footerContactEmail">Your email address</label> <label class="bc-sr-only" for="footerContactEmail">Your email address</label>
<input type="email" id="footerContactEmail" name="email" placeholder="Your email address" required /> <input type="email" id="footerContactEmail" name="email" placeholder="Your email address" required />
<div class="footer-textarea-wrap"> <div class="footer-textarea-wrap">
@@ -997,6 +1032,7 @@
</div> </div>
<div class="footer-form-status" id="footerFormStatus" role="status"></div> <div class="footer-form-status" id="footerFormStatus" role="status"></div>
</form> </form>
<noscript><p class="bc-noscript">JavaScript is off. Email us directly at <a href="mailto:support@ODOO4projects.com">support@ODOO4projects.com</a>.</p></noscript>
</div> </div>
</div> </div>
<div class="fcopy">Copyright &copy; ODOO4projects LLC</div> <div class="fcopy">Copyright &copy; ODOO4projects LLC</div>
static/bootcamp-waitlist.js
+65 -2
View File
@@ -14,6 +14,8 @@
* A 200 from the webhook means the workflow accepted the request, not that a CRM record * A 200 from the webhook means the workflow accepted the request, not that a CRM record
* exists (the workflow answers before it runs) — same as the site's other forms. * exists (the workflow answers before it runs) — same as the site's other forms.
*/ */
var ENDPOINT = 'https://n8n.odoo4projects.com/webhook/ODOO4projects/crm';
(function () { (function () {
'use strict'; 'use strict';
@@ -71,8 +73,6 @@
window.UTM.parse(); window.UTM.parse();
/* ---- Waiting list ---- */ /* ---- Waiting list ---- */
var ENDPOINT = 'https://n8n.odoo4projects.com/webhook/ODOO4projects/crm';
function run() { function run() {
var form = document.getElementById('bcWaitlistForm'); var form = document.getElementById('bcWaitlistForm');
if (!form) return; if (!form) return;
@@ -121,3 +121,66 @@
run(); run();
} }
})(); })();
/* ---- Footer contact form ------------------------------------------------------------
* These pages do NOT load /script.js, so its footer-form handler does not run here. This
* mirrors /script.js's handler one-for-one — same webhook, same payload shape
* ({ email, requirements, area:'message' } wrapped in UTM.inject), same success/failure
* behaviour — but reads its two strings from the form's own data-ok / data-err attributes
* so the message is in the page's language. Without it a submit would navigate the visitor
* to the webhook's raw JSON reply.
*/
(function () {
'use strict';
function runFooter() {
var form = document.getElementById('footerContactForm');
if (!form) return;
var emailInput = document.getElementById('footerContactEmail');
var textInput = document.getElementById('footerContactText');
var submitBtn = form.querySelector('.footer-send-btn');
var status = document.getElementById('footerFormStatus');
var okText = form.getAttribute('data-ok') || "Thanks! We'll get back to you shortly.";
var errText = form.getAttribute('data-err') || 'Something went wrong. Please try again.';
function showStatus(message, isError) {
status.textContent = message;
status.classList.toggle('error', !!isError);
status.classList.add('visible');
}
form.addEventListener('submit', function (e) {
e.preventDefault();
var email = emailInput.value.trim();
var text = textInput.value.trim();
if (!email || !text) return;
submitBtn.disabled = true;
status.classList.remove('visible');
fetch(ENDPOINT, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(window.UTM.inject({
email: email,
requirements: text,
area: 'message'
}))
}).then(function (r) {
if (!r.ok) throw new Error('bad status ' + r.status);
form.reset();
submitBtn.disabled = false;
showStatus(okText, false);
}).catch(function () {
submitBtn.disabled = false;
showStatus(errText, true);
});
});
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', runFooter);
} else {
runFooter();
}
})();