Turnier 2025
Jetzt anmelden & mitspielen
Melde dein Team für das Trossiner Biber Turnier an – ob Mixed oder reines Männerteam.
Anmeldung – 2er Mixed
Mixed-Doppel (1 Dame + 1 Herr)Bitte gebt die Daten beider Spieler/innen vollständig an.
1 Spielerin (Dame)
2 Spieler (Herr)
Anmeldung erfolgreich!
Euer Mixed-Team wurde angemeldet. Wir melden uns mit allen Turnierinfos.
Anmeldung – 2er Männer
Herren-Doppel (2 Herren)Bitte gebt die Daten beider Spieler vollständig an.
1 Spieler 1
2 Spieler 2
Anmeldung erfolgreich!
Euer Männer-Team wurde angemeldet. Wir melden uns mit allen Turnierinfos.
📋 So baust du das in WordPress ein
1
CSS in WordPress einfügen
Gehe zu Design → Customizer → Zusätzliches CSS und füge den kompletten CSS-Code ein (alles zwischen <style> und </style> aus dieser Datei).
2
Contact Form 7 – Formular „Mixed" anlegen
Neues CF7-Formular erstellen, Titel: Mixed Turnier. Diesen Code ins Formular-Feld einfügen:
<div class="player-block">
<div class="player-label"><span class="num">1</span> Spielerin (Dame)</div>
<div class="form-grid">
<p class="field"><label>Vorname <span class="req">*</span><br>[text* p1_vorname placeholder "Vorname" autocomplete:given-name]</label></p>
<p class="field"><label>Nachname <span class="req">*</span><br>[text* p1_nachname placeholder "Nachname" autocomplete:family-name]</label></p>
<p class="field"><label>E-Mail <span class="req">*</span><br>[email* p1_email placeholder "name@beispiel.de" autocomplete:email]</label></p>
<p class="field"><label>Telefon<br>[tel p1_tel placeholder "+49 123 456789" autocomplete:tel]</label></p>
<p class="field full"><label>Verein / Heimatort<br>[text p1_verein placeholder "z.B. SV Trossiner Biber"]</label></p>
</div>
</div>
<div class="player-block">
<div class="player-label"><span class="num">2</span> Spieler (Herr)</div>
<div class="form-grid">
<p class="field"><label>Vorname <span class="req">*</span><br>[text* p2_vorname placeholder "Vorname"]</label></p>
<p class="field"><label>Nachname <span class="req">*</span><br>[text* p2_nachname placeholder "Nachname"]</label></p>
<p class="field"><label>E-Mail <span class="req">*</span><br>[email* p2_email placeholder "name@beispiel.de"]</label></p>
<p class="field"><label>Telefon<br>[tel p2_tel placeholder "+49 123 456789"]</label></p>
<p class="field full"><label>Verein / Heimatort<br>[text p2_verein placeholder "z.B. SV Trossiner Biber"]</label></p>
</div>
</div>
<div class="divider"></div>
<div class="form-grid">
<p class="field full"><label>Teamname (optional)<br>[text teamname placeholder "z.B. Die Biberkinder"]</label></p>
<p class="field full"><label>Anmerkungen (optional)<br>[textarea hinweis placeholder "Besondere Hinweise..."]</label></p>
</div>
<div class="divider"></div>
<div class="checkbox-field">
[acceptance agb] <label>Ich bestätige die Richtigkeit der Angaben und stimme der Datenverarbeitung zu. *</label>
</div>
[submit "Jetzt für Mixed anmelden"]
3
Contact Form 7 – Formular „Männer" anlegen
Zweites CF7-Formular, Titel: Männer Turnier. Gleicher Aufbau, nur andere Bezeichnungen:
<div class="player-block">
<div class="player-label"><span class="num">1</span> Spieler 1</div>
<div class="form-grid">
<p class="field"><label>Vorname <span class="req">*</span><br>[text* p1_vorname placeholder "Vorname"]</label></p>
<p class="field"><label>Nachname <span class="req">*</span><br>[text* p1_nachname placeholder "Nachname"]</label></p>
<p class="field"><label>E-Mail <span class="req">*</span><br>[email* p1_email placeholder "name@beispiel.de"]</label></p>
<p class="field"><label>Telefon<br>[tel p1_tel placeholder "+49 123 456789"]</label></p>
<p class="field full"><label>Verein / Heimatort<br>[text p1_verein placeholder "z.B. SV Trossiner Biber"]</label></p>
</div>
</div>
<div class="player-block">
<div class="player-label"><span class="num">2</span> Spieler 2</div>
<div class="form-grid">
<p class="field"><label>Vorname <span class="req">*</span><br>[text* p2_vorname placeholder "Vorname"]</label></p>
<p class="field"><label>Nachname <span class="req">*</span><br>[text* p2_nachname placeholder "Nachname"]</label></p>
<p class="field"><label>E-Mail <span class="req">*</span><br>[email* p2_email placeholder "name@beispiel.de"]</label></p>
<p class="field"><label>Telefon<br>[tel p2_tel placeholder "+49 123 456789"]</label></p>
<p class="field full"><label>Verein / Heimatort<br>[text p2_verein placeholder "z.B. SV Trossiner Biber"]</label></p>
</div>
</div>
<div class="divider"></div>
<div class="form-grid">
<p class="field full"><label>Teamname (optional)<br>[text teamname placeholder "z.B. Team Nordsachsen"]</label></p>
<p class="field full"><label>Anmerkungen (optional)<br>[textarea hinweis placeholder "Besondere Hinweise..."]</label></p>
</div>
<div class="divider"></div>
<div class="checkbox-field">
[acceptance agb] <label>Ich bestätige die Richtigkeit der Angaben und stimme der Datenverarbeitung zu. *</label>
</div>
[submit "Jetzt für Männer anmelden"]
4
Seite anlegen mit Tab-Layout + Shortcodes
Neue WordPress-Seite erstellen → Benutzerdefiniertes HTML-Block einfügen. Die IDs der gerade erstellten CF7-Formulare eintragen:
<div class="page-hero">
<div class="badge">Turnier 2025</div>
<h1>Jetzt <span>anmelden</span> & mitspielen</h1>
<p>Melde dein Team an – ob Mixed oder Männerteam.</p>
</div>
<div class="tournament-tabs">
<button class="tab-btn active" data-tab="mixed">⚡ 2er Mixed</button>
<button class="tab-btn" data-tab="maenner">🏅 2er Männer</button>
</div>
<div class="form-panel active" id="panel-mixed">
<div class="form-card">
<div class="form-section-title">Anmeldung – 2er Mixed</div>
<div class="tournament-info">
<strong>Mixed-Doppel (1 Dame + 1 Herr)</strong>
Bitte gebt die Daten beider Spieler/innen an.
</div>
Fehler: Kontaktformular wurde nicht gefunden.
</div> </div> <div class="form-panel" id="panel-maenner"> <div class="form-card"> <div class="form-section-title">Anmeldung – 2er Männer</div> <div class="tournament-info"> <strong>Herren-Doppel (2 Herren)</strong> Bitte gebt die Daten beider Spieler an. </div>Fehler: Kontaktformular wurde nicht gefunden.
</div> </div> <script> document.querySelectorAll('.tab-btn').forEach(btn => { btn.addEventListener('click', () => { document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active')); document.querySelectorAll('.form-panel').forEach(p => p.classList.remove('active')); btn.classList.add('active'); document.getElementById('panel-' + btn.dataset.tab).classList.add('active'); }); }); </script>5
E-Mail-Benachrichtigung einrichten
In CF7 unter E-Mail-Tab die Empfänger-Adresse eintragen. Im Body alle Felder einfügen: [p1_vorname] [p1_nachname] [p1_email] etc. – so landen alle Anmeldungen direkt in deinem Postfach.