Email: info@frontaalmedia.nl

Geboortedatum veld in Contact Form 7

No Comment
Geboortedatum veld in Contact Form 7
0 Flares 0 Flares ×

Bijna alle WordPress websites die ik tegen kom maken gebruik van Contactform 7. Negen van de tien keer wordt Contactform7 alleen gebruikt voor een simpel contactformulier, maar je kan er natuurlijk veel meer mee maken, zoals een bestelformulier of inschrijfformulier. In sommige gevallen zal je bij zo’n formulier ook om de geboortedatum willen vragen, dit kan natuurlijk (vanaf Contact Form 7 versie 3.4) met het ingebouwde ‘Date Field‘.

Je krijgt hierbij een popup met een kalender waar ook de dagen van de week in worden weergegeven. Voor een boekingsformulier van bijvoorbeeld een hotel is dit natuurlijk handig, voor het invoeren van een geboortedatum is het wat overkill, en daar komt nog bij dat het nou ook weer niet heel gebruiksvriendelijk werkt.

Je kan natuurlijk ook gewoon de oldskool dropdown menu’s gebruiken voor geboortedatum, persoonlijk vind ik dit altijd nog het prettigste, en snelste werken. Het nadeel, je moet van alle dagen, maanden en jaren handmatig invoeren. Gelukkig heb ik dit al gedaan en kunnen jullie het gewoon kopiëren ;).

In de eerst code hieronder zie je de verschillende menu’s, deze zijn verplicht (vanwege het *) en hebben een id,’geboortedatum’. Deze kan je gebruiken om aanpassingen in CSS te maken, dit mag je natuurlijk ook weglaten. Ook kan je natuurlijk de maanden vervangen door nummers en of breaks toevoegen tussen de regels. En vergeet natuurlijk ook niet om de velden terug te laten komen in de ‘berichttekst’.

<p>Geboortedatum*<br/>
[select*  menu-dag id:geboortedatum-menu first_as_label "dag" "01" "02" "03" "04" "05" "06" "07" "08" "09" "10" "11" "12" "13" "14" "15" "16" "17" "18" "19" "20" "21" "22" "23" "24" "25" "26" "27" "28" "29" "30" "31"]
[select*  menu-maand id:geboortedatum-menu first_as_label "maand" "jan" "feb" "mrt" "apr" "mei" "jun" "jul" "aug" "sep" "okt" "nov" "dec"]
[select*  menu-jaar id:geboortedatum-menu first_as_label "jaar" "2010" "2009" "2008" "2007" "2006" "2005" "2004" "2003" "2002" "2001" "2000" "1999" "1998" "1997" "1996" "1995" "1994" "1993" "1992" "1991" "1990" "1989" "1988" "1987" "1986" "1985" "1984" "1983" "1982" "1981" "1980" "1979" "1978" "1977" "1976" "1975" "1974" "1973" "1972" "1971" "1970" "1969" "1968" "1967" "1966" "1965" "1964" "1963" "1962" "1961" "1960" "1959" "1958" "1957" "1956" "1955" "1954" "1953" "1952" "1951" "1950" "1949" "1948" "1947" "1946" "1945" "1944" "1943" "1942" "1941" "1940" "1939" "1938" "1937" "1936" "1935" "1934" "1933" "1932" "1931" "1930" "1929" "1928" "1927" "1926" "1925" "1924" "1923" "1922" "1921" "1920" "1919" "1918" "1917" "1916" "1915" "1914" "1913" "1912" "1911" "1910" "1909" "1908" "1907" "1906" "1905" "1904" "1903" "1902" "1901"]
</p>

 

0 Flares Twitter 0 Facebook 0 Google+ 0 Reddit 0 LinkedIn 0 StumbleUpon 0 0 Flares ×

Leave Your Comment

Your Name*
Your Webpage

Your Comment*

De volgende HTML tags en attributen zijn toegestaan: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>