നിങ്ങളുടെ വെബ്സൈറ്റിൽ കോൺടാക്റ്റ് ഫോം ചേർക്കുന്നത് എങ്ങനെ (യഥാർത്ഥത്തിൽ നിങ്ങളിലേക്ക് എത്തുന്ന വിധം)

പ്രവർത്തിക്കുന്ന കോൺടാക്റ്റ് ഫോം ചേർക്കാൻ, ചെറിയ ഒരു ഫോം (പേര്, ഇമെയിൽ, സന്ദേശം) നിർമ്മിച്ച് അത് ഒരു സെർവർ റൂട്ടിലേക്ക് അയയ്ക്കുക. അവിടെ ഇൻപുട്ട് സാധൂകരിച്ച്, സന്ദേശം ഡേറ്റാബേസിൽ സേവ് ചെയ്യുക, തുടർന്ന് രഹസ്യ API കീ ഉപയോഗിച്ച് ഒരു ഇമെയിൽ ദാതാവ് വഴി നിങ്ങൾക്ക് അറിയിപ്പ് അയയ്ക്കുക. സ്പാം ഏറെക്കുറെ തടയാൻ ഒളിഞ്ഞിരിക്കുന്ന ഹണിപോട്ട് ഫീൽഡും റേറ്റ് ലിമിറ്റിംഗും ചേർക്കുക, വ്യക്തമായ വിജയ സന്ദേശം കാണിക്കുക, പ്രസിദ്ധീകരിച്ച സൈറ്റിൽ അവസാനം വരെ പരീക്ഷിക്കുക. സേവ് ചെയ്യുന്നത് ഇമെയിലിന് മുമ്പാണ് എന്നതാണ് പ്രധാനം: ഇമെയിൽ ഒരിക്കൽ പരാജയപ്പെട്ടാലും അന്വേഷണം നിങ്ങളുടെ കയ്യിലുണ്ടാകും.

നിങ്ങളുടെ ഓപ്ഷനുകൾ

ഓപ്ഷൻ	ഇത് എങ്ങനെ പ്രവർത്തിക്കുന്നു	ആർക്ക് അനുയോജ്യം	ട്രേഡ്-ഓഫുകൾ
Mailto ലിങ്ക്	“Email us” സന്ദർശകന്റെ മെയിൽ ആപ്പ് തുറക്കുന്നു	വ്യക്തിഗത സൈറ്റുകൾ	പല ഉപകരണങ്ങളിലും പരാജയപ്പെടുന്നു; നിങ്ങളുടെ വിലാസം ബോട്ടുകൾക്ക് വെളിപ്പെടുന്നു
ഹോസ്റ്റഡ് ഫോം സേവനം	ഫോം ഒരു മൂന്നാം കക്ഷി സേവനത്തിലേക്ക് പോകുന്നു, അത് നിങ്ങളെ ഇമെയിൽ ചെയ്യുന്നു	ബാക്കെൻഡ് ഇല്ലാത്ത സ്റ്റാറ്റിക് സൈറ്റുകൾ	മറ്റൊരു അക്കൗണ്ട്; സൗജന്യ പ്ലാനുകളിൽ പരിധികളും ബ്രാൻഡിംഗും
എംബഡ് ചെയ്ത ഫോം ടൂൾ	ഒരു ഫോം ബിൽഡറിന്റെ വിജറ്റ് നിങ്ങളുടെ പേജിൽ	സങ്കീർണ്ണമായ സർവേകൾ, വേഗത്തിലുള്ള സജ്ജീകരണം	നിങ്ങളുടെ ഡിസൈനുമായി യോജിക്കില്ല; ഡേറ്റ മറ്റെവിടെയോ
നിങ്ങളുടെ സ്വന്തം ഫോം + ഡേറ്റാബേസ് + ഇമെയിൽ	നിങ്ങളുടെ സെർവർ സേവ് ചെയ്ത് അറിയിക്കുന്നു	മിക്ക ആപ്പുകളും ബിസിനസ് സൈറ്റുകളും	ഒരു ഇമെയിൽ ദാതാവ് നിങ്ങൾ സജ്ജീകരിക്കണം

നിങ്ങളുടെ സൈറ്റിന് ഇതിനകം ബാക്കെൻഡും ഡേറ്റാബേസുമുണ്ടെങ്കിൽ — AI ആപ്പ് ബിൽഡറുകളിൽ നിർമ്മിച്ച ആപ്പുകൾക്ക് പലപ്പോഴും ഉണ്ടാകാറുണ്ട് — അവസാന ഓപ്ഷനാണ് ഏറ്റവും വിശ്വസനീയം, അന്വേഷണങ്ങൾ നിങ്ങൾക്ക് കാണാവുന്ന സ്ഥലത്ത് സൂക്ഷിക്കുകയും ചെയ്യും.

നല്ല കോൺടാക്റ്റ് ഫോമിൽ ഉൾപ്പെടേണ്ടത്

കഴിയുന്നത്ര കുറച്ച് ഫീൽഡുകൾ. പേര്, ഇമെയിൽ, സന്ദേശം. വിഷയ ഡ്രോപ്ഡൗൺ (“Sales”, “Support”, “Other”) നിങ്ങൾ അതനുസരിച്ച് റൂട്ട് ചെയ്യുന്നെങ്കിൽ മാത്രം ചേർക്കുക.
ഓരോ ഫീൽഡിനും മുകളിൽ വ്യക്തമായ ലേബലുകൾ, മങ്ങിപ്പോകുന്ന പ്ലെയ്‌സ്ഹോൾഡർ ടെക്സ്റ്റ് മാത്രമല്ല.
സഹായകരമായ സാധൂകരണം: “സാധുവായ ഇമെയിൽ വിലാസം നൽകുക” എന്ന് ഫീൽഡിന് അടുത്ത് കാണിക്കുക.
അടുത്തതായി എന്ത് സംഭവിക്കുമെന്ന് പറയുന്ന വിജയ അവസ്ഥ: “നന്ദി — ഒരു പ്രവൃത്തി ദിവസത്തിനുള്ളിൽ ഞങ്ങൾ മറുപടി നൽകും.”
സ്വകാര്യതാ കുറിപ്പ്, വിവരങ്ങൾ എങ്ങനെ ഉപയോഗിക്കുമെന്ന് പറയുന്നത്, നിങ്ങളുടെ സ്വകാര്യതാ നയത്തിലേക്ക് ലിങ്ക് ചെയ്തത്.
ഒരു ബദൽ, നിങ്ങളുടെ ഇമെയിൽ വിലാസമോ ഫോൺ നമ്പറോ പോലെ, ഫോൺ ഇഷ്ടപ്പെടുന്നവർക്ക്.

ഉദാഹരണ പ്രോംപ്റ്റുകൾ

അടിസ്ഥാന ഫോം:

Contact പേജിൽ പേര്, ഇമെയിൽ, സന്ദേശം (എല്ലാം നിർബന്ധം, സന്ദേശം 2,000 അക്ഷരം വരെ) ഉള്ള ഒരു കോൺടാക്റ്റ് ഫോം ചേർക്കുക. ഇൻപുട്ട് സാധൂകരിക്കുന്ന ഒരു സെർവർ റൂട്ടിലേക്ക് സമർപ്പിക്കുക, സമയത്തോടെ contact_messages ടേബിളിൽ സേവ് ചെയ്യുക, “നന്ദി, ഒരു പ്രവൃത്തി ദിവസത്തിനുള്ളിൽ ഞങ്ങൾ മറുപടി നൽകും” എന്ന വിജയ സന്ദേശം കാണിക്കുക. ഫീൽഡ് പിശകുകൾ ഉള്ളിൽ തന്നെ കാണിക്കുക. ഫോൺകളിൽ നന്നായി പ്രവർത്തിക്കണം.

ഇമെയിൽ അറിയിപ്പുകൾ:

ഒരു കോൺടാക്റ്റ് സന്ദേശം സേവ് ചെയ്യുമ്പോൾ, RESEND_API_KEY-യിലുള്ള കീ ഉപയോഗിച്ച് Resend വഴി hello@example.com-ലേക്ക് ഒരു അറിയിപ്പ് ഇമെയിൽ അയയ്ക്കുക. അയച്ചയാളുടെ ഇമെയിൽ reply-to ആയി സജ്ജീകരിക്കുക, അതുവഴി എനിക്ക് നേരിട്ട് മറുപടി നൽകാം. അയയ്ക്കൽ പരാജയപ്പെട്ടാൽ, സേവ് ചെയ്ത സന്ദേശം നിലനിർത്തി കീ വെളിപ്പെടുത്താതെ പിശക് ലോഗ് ചെയ്യുക.

സ്പാം സംരക്ഷണം:

ഒളിഞ്ഞിരിക്കുന്ന ഹണിപോട്ട് ഫീൽഡ് ചേർക്കുക (ശൂന്യമായി തുടരണം), സെർവറിൽ ഒരു IP-ക്ക് മണിക്കൂറിൽ 5 സമർപ്പണങ്ങൾ എന്ന പരിധി വെക്കുക, മൂന്നിൽ കൂടുതൽ ലിങ്കുള്ള സന്ദേശങ്ങൾ നിരസിക്കുക. ഹണിപോട്ട് സമർപ്പണങ്ങൾ ശബ്ദമില്ലാതെ ഒഴിവാക്കുക, എന്നാൽ വിജയം കാണിക്കുക.

ഒരു ഇൻബോക്സ്:

ഏറ്റവും പുതിയത് ആദ്യം എന്ന ക്രമത്തിൽ കോൺടാക്റ്റ് സന്ദേശങ്ങൾ ലിസ്റ്റ് ചെയ്യുന്ന, പാസ്‌വേഡ്-സംരക്ഷിത അഡ്മിൻ പേജ് ചേർക്കുക, “handled” ചെക്ക്ബോക്സും കൈകാര്യം ചെയ്യാത്തവയ്ക്ക് ഒരു ഫിൽറ്ററും സഹിതം.

ഘട്ടം ഘട്ടമായി

സന്ദേശങ്ങൾ എവിടെ പോകണമെന്ന് തീരുമാനിക്കുക: അറിയിപ്പ് ആര് സ്വീകരിക്കും, ആര് മറുപടി നൽകും.
ഫോം നിർമ്മിക്കുക, മുകളിൽ പറഞ്ഞ ഫീൽഡുകളോടും ആക്സസ് ചെയ്യാവുന്ന ലേബലുകളോടും മൊബൈൽ-സൗഹൃദ ഇൻപുട്ടുകളോടും (ഫോണുകളിൽ ശരിയായ കീബോർഡ് കിട്ടാൻ ഇമെയിൽ input type ഉപയോഗിക്കുക).
സെർവർ റൂട്ട് സൃഷ്ടിക്കുക. അത് ആവശ്യമായ ഫീൽഡുകൾ, ഇമെയിൽ ഫോർമാറ്റ്, നീളത്തിന്റെ പരിധികൾ എന്നിവ പരിശോധിക്കുന്നു. ബ്രൗസറിൽ മാത്രമുള്ള സാധൂകരണത്തെ ഒരിക്കലും വിശ്വസിക്കരുത്.
ആദ്യം ഡേറ്റാബേസിൽ സേവ് ചെയ്യുക. നിങ്ങളുടെ ആപ്പിൽ ഡേറ്റാബേസ് ചേർക്കുന്നത് എങ്ങനെ കാണുക.
ഒരു ഇമെയിൽ ദാതാവ് സജ്ജീകരിക്കുക. അക്കൗണ്ട് സൃഷ്ടിക്കുക, അയയ്ക്കുന്ന ഡൊമെയ്ൻ സ്ഥിരീകരിക്കുക, API കീ സീക്രട്ടായി സൂക്ഷിക്കുക. നിങ്ങളുടെ ആപ്പിൽ നിന്ന് ഇമെയിൽ അയയ്ക്കുന്നത് എങ്ങനെ ഡൊമെയ്ൻ സജ്ജീകരണം (SPF, DKIM) വിശദമായി വിവരിക്കുന്നു.
സേവ് ചെയ്ത ശേഷം സെർവറിൽ നിന്ന് അറിയിപ്പ് അയയ്ക്കുക. സ്ഥിരീകരിച്ച ഡൊമെയ്ൻ അയയ്ക്കുന്നയാളായി ഉപയോഗിക്കുക, സന്ദർശകന്റെ വിലാസം reply-to ആയി ഉപയോഗിക്കുക — സന്ദർശകന്റെ വിലാസത്തിൽ നിന്ന് “from” ആയി അയക്കരുത്, അത് വ്യാജമായി കണക്കാക്കി നിരസിക്കപ്പെടാൻ സാധ്യതയുണ്ട്.
സന്ദർശകന് ഓട്ടോ-റിപ്ലൈ ഓപ്ഷണലായി അയക്കാം, പക്ഷേ ചെറുതായി സൂക്ഷിക്കുക; സ്പാം വിലാസങ്ങളിലേക്കുള്ള ഓട്ടോ-റിപ്ലൈ നിങ്ങളുടെ അയയ്ക്കുന്നയാളുടെ പ്രശസ്തിയെ ബാധിക്കാം.
സ്പാം സംരക്ഷണം ചേർക്കുക: ഹണിപോട്ട്, റേറ്റ് ലിമിറ്റിംഗ്, ആവശ്യമെങ്കിൽ CAPTCHA-ശൈലിയിലുള്ള പരിശോധന.
പ്രസിദ്ധീകരിച്ച സൈറ്റിൽ പരിശോധിക്കുക: സമർപ്പിക്കുക, ഡേറ്റാബേസ് പരിശോധിക്കുക, ഇൻബോക്സും സ്പാം ഫോൾഡറും പരിശോധിക്കുക, reply ക്ലിക്ക് ചെയ്യുക.

സ്പാം തടയൽ

കോൺടാക്റ്റ് ഫോമുകൾ തത്സമയമായി ദിവസങ്ങൾക്കുള്ളിൽ ബോട്ടുകളെ ആകർഷിക്കുന്നു. ഏറ്റവും കുറച്ച് ഇടപെടുന്നതിൽ നിന്ന് ഏറ്റവും കൂടുതൽ ഇടപെടുന്നതിലേക്ക് പ്രതിരോധങ്ങൾ അടുക്കുക:

ഹണിപോട്ട് ഫീൽഡ്. മനുഷ്യർക്ക് മറഞ്ഞിരിക്കുന്ന ഒരു ഫീൽഡ്; ബോട്ടുകൾ അത് പൂരിപ്പിക്കുന്നു. യഥാർത്ഥ സന്ദർശകർക്ക് ഇതൊരു നഷ്ടവും വരുത്തുന്നില്ല.
സെർവറിലെ റേറ്റ് ലിമിറ്റിംഗ്. ഒരു വിലാസത്തിന് ഒരു കാലയളവിൽ എത്ര സന്ദേശം അയക്കാമെന്ന് പരിമിതപ്പെടുത്തുന്നു.
ഉള്ളടക്ക നിയമങ്ങൾ. ലിങ്കുകൾ നിറഞ്ഞ സന്ദേശങ്ങളോ ശൂന്യമായതോ അസാധാരണമായി നീളമുള്ളതോ ആയ സന്ദേശ ഫീൽഡുകളോ നിരസിക്കുക.
CAPTCHA-ശൈലിയിലുള്ള പരിശോധന, Cloudflare Turnstile അല്ലെങ്കിൽ Google reCAPTCHA പോലെ. ടോക്കൺ നിങ്ങളുടെ സെർവറിൽ സ്ഥിരീകരിക്കണം; ബ്രൗസറിൽ മാത്രം പ്രവർത്തിക്കുന്ന പരിശോധന ഒഴിവാക്കാൻ കഴിയും.

സാധാരണ തെറ്റുകൾ

ഒന്നും അയക്കാതെ “Sent!” കാണിക്കുന്നത്. സെർവർ പ്രതികരണത്തിന് മുമ്പോ അതിന്റെ പരിഗണനയില്ലാതെയോ UI വിജയം പറയുന്നു. എപ്പോഴും സെർവർ സ്ഥിരീകരണത്തിനായി കാത്തിരിക്കുക.
ഇമെയിൽ മാത്രം, ഡേറ്റാബേസ് ഇല്ലാതെ. ഒരു തെറ്റായി സജ്ജീകരിച്ച കീ, ആരും ശ്രദ്ധിക്കാതെ ആഴ്ചകളോളം അന്വേഷണങ്ങൾ അപ്രത്യക്ഷമാക്കും.
API കീ ഫ്രണ്ടെൻഡ് കോഡിൽ. ആർക്കും അത് ഉപയോഗിച്ച് നിങ്ങളുടെ പേരിൽ ഇമെയിൽ അയക്കാം.
സ്ഥിരീകരിക്കാത്ത അയയ്ക്കുന്ന ഡൊമെയ്ൻ. അറിയിപ്പുകൾ സ്പാമിൽ പോകുകയോ ഒരിക്കലും എത്താതിരിക്കുകയോ ചെയ്യുന്നു.
സന്ദർശകന്റെ ഇമെയിലിൽ നിന്ന് “from” ആയി അയക്കുന്നത്. പകരം reply-to ഉപയോഗിക്കുക.
നീളത്തിന് പരിധികളില്ലാത്തത്. ബോട്ടുകൾ വലിയ ടെക്സ്റ്റ് ബ്ലോക്കുകൾ ഒട്ടിക്കുന്നു.
തത്സമയ സൈറ്റ് ഒരിക്കലും പരീക്ഷിക്കാത്തത്. പ്രിവ്യൂവും പ്രൊഡക്ഷനും തമ്മിൽ കീകളും ഡൊമെയ്‌നുകളും പലപ്പോഴും വ്യത്യസ്തമായിരിക്കും.

പരിശോധനാ പട്ടിക

ദൃശ്യമായ ലേബലുകളും വ്യക്തമായ പിശകുകളുമുള്ള ചെറിയ ഫോം
സെർവർ-സൈഡ് സാധൂകരണവും നീളത്തിന്റെ പരിധികളും
ഓരോ സന്ദേശവും ഡേറ്റാബേസിൽ സേവ് ചെയ്യുന്നു
സ്ഥിരീകരിച്ച ഡൊമെയ്‌നിൽ നിന്ന് അയച്ച അറിയിപ്പ് ഇമെയിൽ, reply-to സജ്ജീകരിച്ചത്
ഇമെയിൽ API കീ സെർവർ-സൈഡ് സീക്രട്ടുകളിൽ മാത്രം
ഹണിപോട്ടും റേറ്റ് ലിമിറ്റിംഗും നിലവിലുണ്ട്
സെർവർ സ്ഥിരീകരിച്ച ശേഷം മാത്രം വിജയ സന്ദേശം
സ്വകാര്യതാ കുറിപ്പ് നിങ്ങളുടെ സ്വകാര്യതാ നയത്തിലേക്ക് ലിങ്ക് ചെയ്യുന്നു
പ്രസിദ്ധീകരിച്ച സൈറ്റിൽ അവസാനം വരെ പരീക്ഷിച്ചു, സ്പാം ഫോൾഡറും ഉൾപ്പെടെ

Mythex-ൽ കോൺടാക്റ്റ് ഫോമുകൾ

Mythex-ൽ മുഴുവൻ കാര്യവും ചാറ്റിൽ നിന്ന് നിർമ്മിക്കാം. ഫോമും ഡേറ്റാബേസും ഒരേ പ്രോംപ്റ്റിൽ ആവശ്യപ്പെടുക (അല്ലെങ്കിൽ /database ടൈപ്പ് ചെയ്യുക), അങ്ങനെ സമർപ്പണങ്ങൾ നിലനിൽക്കും. Mythex-ന് ബിൽറ്റ്-ഇൻ ഇമെയിൽ അയയ്ക്കൽ ഉൽപ്പന്നമില്ല, അതിനാൽ അറിയിപ്പുകൾക്കായി Resend, SendGrid അല്ലെങ്കിൽ Postmark പോലെയുള്ള ഒരു ദാതാവിനെ കൊണ്ടുവരിക, അതിന്റെ കീ /secrets അല്ലെങ്കിൽ പ്രോജക്റ്റ് സെറ്റിംഗ്സ് വഴി ചേർക്കുക, സെർവറിൽ നിന്ന് അയയ്ക്കാൻ ഏജന്റിനോട് ആവശ്യപ്പെടുക — നിങ്ങളുടെ ആപ്പിൽ നിന്ന് ഇമെയിൽ അയയ്ക്കുക കാണുക. ആശ്രയിക്കുന്നതിന് മുമ്പ്, പ്രിവ്യൂവിൽ ഫോമിനെതിരെ App Testing (/test) പ്രവർത്തിപ്പിക്കുക, തുടർന്ന് പ്രസിദ്ധീകരിച്ച് തത്സമയ URL-ൽ പരീക്ഷിക്കുക.

കോൺടാക്റ്റ് ഫോം മിക്ക ചെറുകിട ബിസിനസ് വെബ്സൈറ്റുകളുടെയും ലാൻഡിംഗ് പേജുകളുടെയും പ്രധാന ഭാഗമാണ്. ലോഞ്ചിന് മുമ്പ് സുരക്ഷാ ചെക്ക്‌ലിസ്റ്റ് പരിശോധിക്കുക.

ചോദ്യങ്ങൾ

കോൺടാക്റ്റ് ഫോം എനിക്ക് ഇമെയിൽ അയയ്ക്കാൻ എങ്ങനെ ചെയ്യാം?

ഫോം ഒരു സെർവർ റൂട്ടിലേക്ക് പോകുന്നു, അത് സന്ദേശം സേവ് ചെയ്ത് Resend, SendGrid അല്ലെങ്കിൽ Postmark പോലെയുള്ള ഇമെയിൽ ദാതാവ് വഴി നിങ്ങൾക്ക് അറിയിപ്പ് അയയ്ക്കുന്നു. സെർവർ-സൈഡ് സീക്രട്ടായി സൂക്ഷിച്ച API കീ ഉപയോഗിച്ചാണിത്. ബ്രൗസർ മാത്രം വിശ്വസനീയമായി ഇമെയിൽ അയയ്ക്കില്ല.

കോൺടാക്റ്റ് ഫോം ഇമെയിലുകൾ എനിക്ക് കിട്ടാത്തത് എന്തുകൊണ്ട്?

സാധാരണ കാരണങ്ങൾ: API കീ ഇല്ലാതെയോ തെറ്റായോ ഇരിക്കുക, സ്ഥിരീകരിക്കാത്ത അയയ്ക്കുന്ന ഡൊമെയ്ൻ, സ്പാം ഫോൾഡറിൽ പോകുന്ന അറിയിപ്പുകൾ, സെർവർ കോൾ പ്രവർത്തിക്കാതെ വിജയം കാണിക്കുന്ന ഫോം. ഇമെയിൽ ശരിയാക്കുമ്പോൾ സന്ദേശം നഷ്ടപ്പെടാതിരിക്കാൻ, ഓരോ സമർപ്പണവും ആദ്യം ഡേറ്റാബേസിൽ സേവ് ചെയ്യുക.

കോൺടാക്റ്റ് ഫോം സ്പാം എങ്ങനെ തടയാം?

സെർവറിൽ ഒളിഞ്ഞിരിക്കുന്ന ഹണിപോട്ട് ഫീൽഡും റേറ്റ് ലിമിറ്റിംഗും ഉപയോഗിച്ച് തുടങ്ങുക. സ്പാം തുടർന്നാൽ, Cloudflare Turnstile അല്ലെങ്കിൽ Google reCAPTCHA പോലെ CAPTCHA-ശൈലിയിലുള്ള പരിശോധന ചേർക്കുക, അത് സെർവറിൽ സ്ഥിരീകരിക്കണം.

ഫോമിന് പകരം mailto ലിങ്ക് ഉപയോഗിക്കണോ?

mailto ലിങ്ക് ലളിതമാണ്, പക്ഷേ അത് സന്ദർശകന്റെ ഇമെയിൽ ആപ്പ് തുറക്കുന്നു. പങ്കിട്ട അല്ലെങ്കിൽ ജോലിസ്ഥലത്തെ കമ്പ്യൂട്ടറുകളിലുള്ള പലർക്കും ഇത് പ്രവർത്തിക്കില്ല, കൂടാതെ നിങ്ങളുടെ വിലാസം സ്പാം ബോട്ടുകൾക്ക് വെളിപ്പെടുത്തുന്നു. ഫോം സന്ദർശകർക്ക് കൂടുതൽ വിശ്വസനീയമാണ്, നിങ്ങൾക്ക് ലഭിക്കുന്ന ഫീൽഡുകൾ നിങ്ങൾക്ക് നിയന്ത്രിക്കാം.