Skip to content

Commit e9cc00f

Browse files
AtlasNexusTechAtlasNexusTech
committed
feat: prefill AI offer contact form
1 parent 2dad419 commit e9cc00f

5 files changed

Lines changed: 114 additions & 23 deletions

File tree

‎en/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -243,7 +243,7 @@ <h3 class="text-2xl font-bold text-foreground mb-4 font-display">Web UI + Telegr
243243
<p class="text-slate-600 text-sm leading-relaxed mb-5"><strong>For:</strong> freelancers and small teams that want to test a concrete use case quickly.</p>
244244
<div class="offer-spacer"></div>
245245
<p class="offer-price text-xl font-extrabold text-foreground mb-6 font-display">€5 <span class="offer-quote text-sm font-semibold text-slate-500">free initial coaching</span></p>
246-
<div class="flex flex-col gap-2"><a href="/ia-agentique/en/" class="inline-flex agentic-accent font-semibold hover:text-primary-dark">Discover the offer →</a><a href="/ia-agentique/en/#contact" class="inline-flex text-slate-500 text-sm font-semibold hover:text-primary">Book free coaching</a></div>
246+
<div class="flex flex-col gap-2"><a href="/ia-agentique/en/" class="inline-flex agentic-accent font-semibold hover:text-primary-dark">Discover the offer →</a><a href="/ia-agentique/en/?offer=coaching#order-form" class="inline-flex text-slate-500 text-sm font-semibold hover:text-primary">Book free coaching</a></div>
247247
</article>
248248
<article class="reveal reveal-delay-3 framer-purple-card offer-card rounded-2xl p-12 border border-border bg-white">
249249
<p class="text-sm font-bold framer-accent mb-2">C. Animated UI</p>

‎ia-agentique/en/index.html‎

Lines changed: 27 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -116,7 +116,7 @@ <h1 class="text-6xl sm:text-7xl lg:text-8xl font-black tracking-tight leading-no
116116
</p>
117117
<div class="flex gap-4 flex-wrap">
118118
<a href="#pricing" class="bg-primary text-white px-8 py-4 rounded-full text-lg font-semibold hover:bg-primary-dark font-display">View offers</a>
119-
<a href="#contact" class="border-2 border-slate-300 text-slate-700 px-8 py-4 rounded-full text-lg font-semibold hover:border-primary hover:text-primary font-display">Free coaching</a>
119+
<a href="?offer=coaching#order-form" data-offer="coaching" class="border-2 border-slate-300 text-slate-700 px-8 py-4 rounded-full text-lg font-semibold hover:border-primary hover:text-primary font-display">Free coaching</a>
120120
</div>
121121
<div class="flex gap-6 mt-12 text-sm text-slate-400">
122122
<span>✓ 24-48h delivery</span>
@@ -180,7 +180,7 @@ <h3 class="text-2xl font-bold text-foreground mb-1 font-display">Web UI + Telegr
180180
<li class="flex gap-2"><span class="check-icon">✓</span> Visible code and documentation</li>
181181
<li class="flex gap-2"><span class="check-icon">✓</span> 1 revision included</li>
182182
</ul>
183-
<a href="#contact" class="block text-center bg-accent text-white py-3 rounded-full font-semibold hover:bg-accent-dark font-display transition-all">Request the agent — 5€</a>
183+
<a href="?offer=agent#order-form" data-offer="agent" class="block text-center bg-accent text-white py-3 rounded-full font-semibold hover:bg-accent-dark font-display transition-all">Request the agent — 5€</a>
184184
</div>
185185

186186
<!-- Coaching -->
@@ -196,7 +196,7 @@ <h3 class="text-2xl font-bold text-foreground mb-1 font-display">Agentic AI coac
196196
<li class="flex gap-2"><span class="check-icon">✓</span> First use case prioritization</li>
197197
<li class="flex gap-2"><span class="check-icon">✓</span> Concrete action plan</li>
198198
</ul>
199-
<a href="#contact" class="block text-center bg-primary text-white py-3 rounded-full font-semibold hover:bg-primary-dark font-display">Book free coaching</a>
199+
<a href="?offer=coaching#order-form" data-offer="coaching" class="block text-center bg-primary text-white py-3 rounded-full font-semibold hover:bg-primary-dark font-display">Book free coaching</a>
200200
</div>
201201
</div>
202202
</div>
@@ -279,7 +279,7 @@ <h2 class="section-title text-foreground mb-5 font-display">Start with free coac
279279
<p class="text-slate-600 text-lg mb-6 max-w-xl mx-auto">Describe your need in 2 sentences. I'll reply with a diagnosis and concrete action plan within 24h, with no commitment.</p>
280280

281281
<!-- Order form -->
282-
<div class="agentic-card bg-white rounded-2xl p-8 border border-border mb-10 max-w-xl mx-auto text-left">
282+
<div id="order-form" class="agentic-card bg-white rounded-2xl p-8 border border-border mb-10 max-w-xl mx-auto text-left" style="scroll-margin-top: 6rem;">
283283
<h3 class="font-bold text-xl mb-6 font-display text-center">Choose the agent or free coaching</h3>
284284
<form action="mailto:laslyalexandre@gmail.com" method="POST" enctype="text/plain" class="space-y-4">
285285
<div>
@@ -295,12 +295,13 @@ <h3 class="font-bold text-xl mb-6 font-display text-center">Choose the agent or
295295
<input type="text" name="entreprise" class="w-full px-4 py-3 rounded-xl border border-border bg-white text-foreground focus:border-primary focus:ring-2 focus:ring-blue-500/20 outline-none transition-all">
296296
</div>
297297
<div>
298-
<label class="block text-sm font-semibold text-foreground mb-1">Selected offer *</label>
299-
<select name="offre" required class="w-full px-4 py-3 rounded-xl border border-border bg-white text-foreground focus:border-primary focus:ring-2 focus:ring-blue-500/20 outline-none transition-all">
298+
<label for="offer-select" class="block text-sm font-semibold text-foreground mb-1">Selected offer *</label>
299+
<select id="offer-select" name="offre" required class="w-full px-4 py-3 rounded-xl border border-border bg-white text-foreground focus:border-primary focus:ring-2 focus:ring-blue-500/20 outline-none transition-all">
300300
<option value="">-- Choose --</option>
301301
<option value="Web UI + Telegram Agent 5€">Web UI + Telegram Agent (5€)</option>
302302
<option value="Free coaching">Free coaching</option>
303303
</select>
304+
<p id="offer-prefill-status" class="mt-2 text-sm font-semibold text-primary" aria-live="polite"></p>
304305
</div>
305306
<div>
306307
<label class="block text-sm font-semibold text-foreground mb-1">Describe your need *</label>
@@ -320,13 +321,13 @@ <h3 class="font-bold text-xl mb-6 font-display text-center">Choose the agent or
320321
Send request
321322
</button>
322323
</form>
323-
<p class="text-slate-400 text-xs text-center mt-4">Secure form. Response within 24h.</p>
324+
<p class="text-slate-400 text-xs text-center mt-4">Your email app will open to send the request. No form data is stored on this site.</p>
324325
</div>
325326

326327
<!-- Quick access to offers -->
327328
<div class="grid sm:grid-cols-2 gap-4 max-w-lg mx-auto mb-8">
328-
<a href="#contact" class="bg-accent text-white py-3 px-4 rounded-full font-semibold hover:bg-accent-dark font-display text-sm transition-all">Web UI + Telegram Agent — 5€</a>
329-
<a href="#contact" class="bg-primary text-white py-3 px-4 rounded-full font-semibold hover:bg-primary-dark font-display text-sm transition-all">Free coaching</a>
329+
<a href="?offer=agent#order-form" data-offer="agent" class="bg-accent text-white py-3 px-4 rounded-full font-semibold hover:bg-accent-dark font-display text-sm transition-all">Web UI + Telegram Agent — 5€</a>
330+
<a href="?offer=coaching#order-form" data-offer="coaching" class="bg-primary text-white py-3 px-4 rounded-full font-semibold hover:bg-primary-dark font-display text-sm transition-all">Free coaching</a>
330331
</div>
331332

332333
<div class="flex flex-col gap-3 items-center">
@@ -350,6 +351,23 @@ <h3 class="font-bold text-xl mb-6 font-display text-center">Choose the agent or
350351
</div>
351352
</footer>
352353

354+
<!-- Offer prefill -->
355+
<script>
356+
(function() {
357+
const params = new URLSearchParams(window.location.search);
358+
const selectedOffer = params.get('offer');
359+
const offerSelect = document.getElementById('offer-select');
360+
const status = document.getElementById('offer-prefill-status');
361+
const offers = {
362+
agent: 'Web UI + Telegram Agent 5€',
363+
coaching: 'Free coaching'
364+
};
365+
if (!offerSelect || !status || !Object.prototype.hasOwnProperty.call(offers, selectedOffer)) return;
366+
offerSelect.value = offers[selectedOffer];
367+
status.textContent = `Preselected offer: ${offerSelect.options[offerSelect.selectedIndex].text}`;
368+
})();
369+
</script>
370+
353371
<!-- Scroll Reveal -->
354372
<script>
355373
(function() {

‎ia-agentique/index.html‎

Lines changed: 27 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ <h1 class="text-6xl sm:text-7xl lg:text-8xl font-black tracking-tight leading-no
133133
</p>
134134
<div class="flex gap-4 flex-wrap">
135135
<a href="#pricing" class="bg-primary text-white px-8 py-4 rounded-full text-lg font-semibold hover:bg-primary-dark font-display">Voir les offres</a>
136-
<a href="#contact" class="border-2 border-slate-300 text-slate-700 px-8 py-4 rounded-full text-lg font-semibold hover:border-primary hover:text-primary font-display">Coaching gratuit</a>
136+
<a href="?offer=coaching#order-form" data-offer="coaching" class="border-2 border-slate-300 text-slate-700 px-8 py-4 rounded-full text-lg font-semibold hover:border-primary hover:text-primary font-display">Coaching gratuit</a>
137137
</div>
138138
<div class="flex gap-6 mt-12 text-sm text-slate-400">
139139
<span>✓ Livraison 24-48h</span>
@@ -197,7 +197,7 @@ <h3 class="text-2xl font-bold text-foreground mb-1 font-display">Agent Web UI +
197197
<li class="flex gap-2"><span class="check-icon">✓</span> Code visible et documentation</li>
198198
<li class="flex gap-2"><span class="check-icon">✓</span> 1 révision incluse</li>
199199
</ul>
200-
<a href="#contact" class="block text-center bg-accent text-white py-3 rounded-full font-semibold hover:bg-accent-dark font-display transition-all">Demander l'agent — 5€</a>
200+
<a href="?offer=agent#order-form" data-offer="agent" class="block text-center bg-accent text-white py-3 rounded-full font-semibold hover:bg-accent-dark font-display transition-all">Demander l'agent — 5€</a>
201201
</div>
202202

203203
<!-- Coaching -->
@@ -213,7 +213,7 @@ <h3 class="text-2xl font-bold text-foreground mb-1 font-display">Coaching IA age
213213
<li class="flex gap-2"><span class="check-icon">✓</span> Priorisation du premier cas d'usage</li>
214214
<li class="flex gap-2"><span class="check-icon">✓</span> Plan d'action concret</li>
215215
</ul>
216-
<a href="#contact" class="block text-center bg-primary text-white py-3 rounded-full font-semibold hover:bg-primary-dark font-display">Réserver le coaching gratuit</a>
216+
<a href="?offer=coaching#order-form" data-offer="coaching" class="block text-center bg-primary text-white py-3 rounded-full font-semibold hover:bg-primary-dark font-display">Réserver le coaching gratuit</a>
217217
</div>
218218
</div>
219219
</div>
@@ -296,7 +296,7 @@ <h2 class="section-title text-foreground mb-5 font-display">Commencez par un coa
296296
<p class="text-slate-600 text-lg mb-6 max-w-xl mx-auto">Décrivez votre besoin en 2 phrases : je vous réponds avec un diagnostic et un plan d'action concret sous 24h, sans engagement.</p>
297297

298298
<!-- Formulaire de commande -->
299-
<div class="agentic-card bg-white rounded-2xl p-8 border border-border mb-10 max-w-xl mx-auto text-left">
299+
<div id="order-form" class="agentic-card bg-white rounded-2xl p-8 border border-border mb-10 max-w-xl mx-auto text-left" style="scroll-margin-top: 6rem;">
300300
<h3 class="font-bold text-xl mb-6 font-display text-center">Choisir l'agent ou le coaching gratuit</h3>
301301
<form action="mailto:laslyalexandre@gmail.com" method="POST" enctype="text/plain" class="space-y-4">
302302
<div>
@@ -312,12 +312,13 @@ <h3 class="font-bold text-xl mb-6 font-display text-center">Choisir l'agent ou l
312312
<input type="text" name="entreprise" class="w-full px-4 py-3 rounded-xl border border-border bg-white text-foreground focus:border-primary focus:ring-2 focus:ring-blue-500/20 outline-none transition-all">
313313
</div>
314314
<div>
315-
<label class="block text-sm font-semibold text-foreground mb-1">Offre souhaitée *</label>
316-
<select name="offre" required class="w-full px-4 py-3 rounded-xl border border-border bg-white text-foreground focus:border-primary focus:ring-2 focus:ring-blue-500/20 outline-none transition-all">
315+
<label for="offer-select" class="block text-sm font-semibold text-foreground mb-1">Offre souhaitée *</label>
316+
<select id="offer-select" name="offre" required class="w-full px-4 py-3 rounded-xl border border-border bg-white text-foreground focus:border-primary focus:ring-2 focus:ring-blue-500/20 outline-none transition-all">
317317
<option value="">-- Choisir --</option>
318318
<option value="Agent Web UI + Telegram 5€">Agent Web UI + Telegram (5€)</option>
319319
<option value="Coaching gratuit">Coaching gratuit</option>
320320
</select>
321+
<p id="offer-prefill-status" class="mt-2 text-sm font-semibold text-primary" aria-live="polite"></p>
321322
</div>
322323
<div>
323324
<label class="block text-sm font-semibold text-foreground mb-1">Décrivez votre besoin *</label>
@@ -337,13 +338,13 @@ <h3 class="font-bold text-xl mb-6 font-display text-center">Choisir l'agent ou l
337338
Envoyer la demande
338339
</button>
339340
</form>
340-
<p class="text-slate-400 text-xs text-center mt-4">Formulaire sécurisé. Réponse sous 24h.</p>
341+
<p class="text-slate-400 text-xs text-center mt-4">Votre messagerie s'ouvrira pour envoyer la demande. Aucune donnée n'est stockée sur ce site.</p>
341342
</div>
342343

343344
<!-- Accès rapide aux offres -->
344345
<div class="grid sm:grid-cols-2 gap-4 max-w-lg mx-auto mb-8">
345-
<a href="#contact" class="bg-accent text-white py-3 px-4 rounded-full font-semibold hover:bg-accent-dark font-display text-sm transition-all">Agent Web UI + Telegram — 5€</a>
346-
<a href="#contact" class="bg-primary text-white py-3 px-4 rounded-full font-semibold hover:bg-primary-dark font-display text-sm transition-all">Coaching gratuit</a>
346+
<a href="?offer=agent#order-form" data-offer="agent" class="bg-accent text-white py-3 px-4 rounded-full font-semibold hover:bg-accent-dark font-display text-sm transition-all">Agent Web UI + Telegram — 5€</a>
347+
<a href="?offer=coaching#order-form" data-offer="coaching" class="bg-primary text-white py-3 px-4 rounded-full font-semibold hover:bg-primary-dark font-display text-sm transition-all">Coaching gratuit</a>
347348
</div>
348349

349350
<div class="flex flex-col gap-3 items-center">
@@ -367,6 +368,23 @@ <h3 class="font-bold text-xl mb-6 font-display text-center">Choisir l'agent ou l
367368
</div>
368369
</footer>
369370

371+
<!-- Offer prefill -->
372+
<script>
373+
(function() {
374+
const params = new URLSearchParams(window.location.search);
375+
const selectedOffer = params.get('offer');
376+
const offerSelect = document.getElementById('offer-select');
377+
const status = document.getElementById('offer-prefill-status');
378+
const offers = {
379+
agent: 'Agent Web UI + Telegram 5€',
380+
coaching: 'Coaching gratuit'
381+
};
382+
if (!offerSelect || !status || !Object.prototype.hasOwnProperty.call(offers, selectedOffer)) return;
383+
offerSelect.value = offers[selectedOffer];
384+
status.textContent = `Offre présélectionnée : ${offerSelect.options[offerSelect.selectedIndex].text}`;
385+
})();
386+
</script>
387+
370388
<!-- Scroll Reveal -->
371389
<script>
372390
(function() {

‎index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -404,7 +404,7 @@ <h3 class="text-2xl font-bold text-foreground mb-4 font-display">Agent Web UI +
404404
<p class="text-slate-600 text-sm leading-relaxed mb-5"><strong>Pour :</strong> indépendants et petites équipes qui veulent tester rapidement un usage concret.</p>
405405
<div class="offer-spacer"></div>
406406
<p class="offer-price text-xl font-extrabold text-foreground mb-6 font-display">5€ <span class="offer-quote text-sm font-semibold text-slate-500">coaching initial gratuit</span></p>
407-
<div class="flex flex-col gap-2"><a href="/ia-agentique/" class="inline-flex agentic-accent font-semibold hover:text-primary-dark">Découvrir l'offre →</a><a href="/ia-agentique/#contact" class="inline-flex text-slate-500 text-sm font-semibold hover:text-primary">Réserver le coaching gratuit</a></div>
407+
<div class="flex flex-col gap-2"><a href="/ia-agentique/" class="inline-flex agentic-accent font-semibold hover:text-primary-dark">Découvrir l'offre →</a><a href="/ia-agentique/?offer=coaching#order-form" class="inline-flex text-slate-500 text-sm font-semibold hover:text-primary">Réserver le coaching gratuit</a></div>
408408
</article>
409409
<article class="reveal reveal-delay-3 framer-purple-card offer-card rounded-2xl p-12 border border-border bg-white">
410410
<p class="text-sm font-bold framer-accent mb-2">C. UI Animée</p>

‎tests/test_ia_agentique_pricing.py‎

Lines changed: 58 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ def test_ia_agentique_has_one_five_euro_agent_and_free_coaching(
6666

6767
assert agent_option in html
6868
assert coaching_option in html
69-
assert html.count('href="#contact"') >= 6
69+
assert html.count('href="#contact"') == 2
7070
assert 'href="/#contact"' not in html
7171

7272
for obsolete in (
@@ -131,7 +131,7 @@ def _article_with_heading(container, heading):
131131
"Agent Web UI + Telegram",
132132
"Découvrir l'offre →",
133133
"Réserver le coaching gratuit",
134-
"/ia-agentique/#contact",
134+
"/ia-agentique/?offer=coaching#order-form",
135135
"5€",
136136
),
137137
(
@@ -142,7 +142,7 @@ def _article_with_heading(container, heading):
142142
"Web UI + Telegram Agent",
143143
"Discover the offer →",
144144
"Book free coaching",
145-
"/ia-agentique/en/#contact",
145+
"/ia-agentique/en/?offer=coaching#order-form",
146146
"€5",
147147
),
148148
],
@@ -208,3 +208,58 @@ def test_homepage_mobile_sticky_cta_targets_the_fixed_price_offer(
208208
assert sticky is not None
209209
assert sticky.group(1) == offer_path
210210
assert sticky.group(2).strip() == sticky_label
211+
212+
213+
@pytest.mark.parametrize(
214+
("relative_path", "agent_value", "coaching_value", "status_copy"),
215+
[
216+
(
217+
"ia-agentique/index.html",
218+
"Agent Web UI + Telegram 5€",
219+
"Coaching gratuit",
220+
"Offre présélectionnée :",
221+
),
222+
(
223+
"ia-agentique/en/index.html",
224+
"Web UI + Telegram Agent 5€",
225+
"Free coaching",
226+
"Preselected offer:",
227+
),
228+
],
229+
)
230+
def test_offer_links_prefill_the_matching_form_option(
231+
relative_path, agent_value, coaching_value, status_copy
232+
):
233+
html = (ROOT / relative_path).read_text(encoding="utf-8")
234+
235+
offer_links = [
236+
attributes
237+
for attributes in re.findall(r"<a\s+([^>]*)>", html)
238+
if 'data-offer="' in attributes
239+
]
240+
assert len(offer_links) == 5
241+
assert sum('data-offer="agent"' in attributes for attributes in offer_links) == 2
242+
assert sum('data-offer="coaching"' in attributes for attributes in offer_links) == 3
243+
for attributes in offer_links:
244+
offer_match = re.search(r'data-offer="(agent|coaching)"', attributes)
245+
assert offer_match is not None
246+
offer = offer_match.group(1)
247+
assert f'href="?offer={offer}#order-form"' in attributes
248+
249+
assert 'id="offer-select"' in html
250+
assert 'for="offer-select"' in html
251+
assert f'<option value="{agent_value}">' in html
252+
assert f'<option value="{coaching_value}">' in html
253+
assert 'id="offer-prefill-status"' in html
254+
assert 'aria-live="polite"' in html
255+
256+
assert "new URLSearchParams(window.location.search)" in html
257+
assert "params.get('offer')" in html
258+
assert f"agent: '{agent_value}'" in html
259+
assert f"coaching: '{coaching_value}'" in html
260+
assert "Object.prototype.hasOwnProperty.call(offers, selectedOffer)" in html
261+
assert "offerSelect.value = offers[selectedOffer]" in html
262+
assert status_copy in html
263+
264+
assert "Formulaire sécurisé" not in html
265+
assert "Secure form" not in html

0 commit comments

Comments
 (0)