તમારી વેબસાઇટમાં કોન્ટેક્ટ ફોર્મ કેવી રીતે ઉમેરવું (જે ખરેખર તમારા સુધી પહોંચે)

કામ કરતું કોન્ટેક્ટ ફોર્મ બનાવવા માટે, એક ટૂંકું ફોર્મ બનાવો (નામ, ઈમેલ, સંદેશ), તેને એક સર્વર રૂટ પર મોકલો જે ઇનપુટ ચકાસે, સંદેશને ડેટાબેઝમાં સાચવો, અને પછી ગુપ્ત API કી વડે ઈમેલ પ્રોવાઇડર દ્વારા તમને સૂચના મોકલો. મોટાભાગના સ્પામ રોકવા છુપાયેલું હનીપોટ ફીલ્ડ અને રેટ લિમિટિંગ ઉમેરો, સ્પષ્ટ સફળતા સંદેશ બતાવો, અને પબ્લિશ થયેલી સાઇટ પર શરૂઆતથી અંત સુધી ટેસ્ટ કરો. ઈમેલ મોકલતા પહેલા સાચવવું એ મહત્વનો ભાગ છે: ઈમેલ ક્યારેય નિષ્ફળ જાય તો પણ તમારી પાસે પૂછપરછ હોય છે.

તમારા વિકલ્પો

જો તમારી સાઇટ પર પહેલેથી બેકએન્ડ અને ડેટાબેઝ હોય — જે AI એપ બિલ્ડર વડે બનેલી એપમાં ઘણીવાર હોય છે — તો છેલ્લો વિકલ્પ સૌથી વિશ્વસનીય છે અને પૂછપરછ એવી જગ્યાએ રાખે છે જ્યાં તમે જોઈ શકો.

સારા કોન્ટેક્ટ ફોર્મમાં શું હોય

• શક્ય તેટલા ઓછા ફીલ્ડ. નામ, ઈમેલ, સંદેશ. વિષયનો ડ્રોપડાઉન ("સેલ્સ", "સપોર્ટ", "અન્ય") ત્યારે જ ઉમેરો જો તમે તેના આધારે રૂટ કરવાના હો.
• દરેક ફીલ્ડની ઉપર સ્પષ્ટ લેબલ, માત્ર પ્લેસહોલ્ડર ટેક્સ્ટ નહીં જે ગાયબ થઈ જાય.
• ઉપયોગી ચકાસણી: "માન્ય ઈમેલ સરનામું દાખલ કરો", ફીલ્ડની બાજુમાં બતાવેલું.
• સફળતા સ્થિતિ જે કહે કે આગળ શું થશે: "આભાર — અમે એક કાર્યદિવસમાં જવાબ આપીશું."
• ગોપનીયતા નોંધ જે કહે કે વિગતો કેવી રીતે વપરાશે, તમારી ગોપનીયતા નીતિ સાથે લિંક સાથે.
• વિકલ્પ જેમ કે તમારું ઈમેલ સરનામું કે ફોન નંબર, જે તેને પસંદ કરે તેમના માટે.

ઉદાહરણ પ્રોમ્પ્ટ

મૂળભૂત ફોર્મ:

કોન્ટેક્ટ પેજ પર નામ, ઈમેલ અને સંદેશ સાથે કોન્ટેક્ટ ફોર્મ ઉમેરો (બધા જરૂરી, સંદેશ 2,000 અક્ષર સુધી). તેને સર્વર રૂટ પર સબમિટ કરો જે ઇનપુટ ચકાસે, contact_messages ટેબલમાં પ્રાપ્તિ સમય સાથે સાચવે, અને સફળતા સંદેશ બતાવે: "આભાર, અમે એક કાર્યદિવસમાં જવાબ આપીશું." ફીલ્ડની ભૂલો ઇનલાઇન બતાવો. ફોન પર સારી રીતે કામ કરે તેવું બનાવો.

ઈમેલ સૂચનાઓ:

જ્યારે કોન્ટેક્ટ સંદેશ સાચવાય, ત્યારે RESEND_API_KEY માંની કી વાપરીને Resend દ્વારા hello@example.com પર મને સૂચના ઈમેલ મોકલો. મોકલનારનો ઈમેલ reply-to તરીકે સેટ કરો જેથી હું સીધો જવાબ આપી શકું. મોકલવામાં નિષ્ફળતા આવે તો સાચવેલો સંદેશ રાખો અને કીને ખુલ્લી પાડ્યા વિના ભૂલ લોગ કરો.

સ્પામ સુરક્ષા:

કોન્ટેક્ટ ફોર્મમાં સ્પામ સુરક્ષા ઉમેરો: એક છુપાયેલું હનીપોટ ફીલ્ડ જે ખાલી રહેવું જોઈએ, સર્વર પર દર IP દીઠ કલાકમાં 5 સબમિશનની મર્યાદા, અને 3 થી વધુ લિંકવાળા સંદેશ નકારો. હનીપોટ સબમિશન ચૂપચાપ કાઢી નાખો પરંતુ સફળતા બતાવો.

ઇનબોક્સ:

પાસવર્ડ-સુરક્ષિત એડમિન પેજ ઉમેરો જે કોન્ટેક્ટ સંદેશ સૌથી નવા પહેલા બતાવે, "handled" ચેકબોક્સ સાથે, અને હજુ ન સંભાળેલા સંદેશનો ફિલ્ટર.

પગલા દર પગલા

1. નક્કી કરો સંદેશ ક્યાં જાય: સૂચના કોને મળે, અને જવાબ કોણ આપે.
2. ફોર્મ બનાવો ઉપરના ફીલ્ડ, સુલભ લેબલ અને મોબાઇલ-ફ્રેન્ડલી ઇનપુટ સાથે (ફોન સાચો કીબોર્ડ બતાવે તે માટે email ઇનપુટ ટાઇપ વાપરો).
3. સર્વર રૂટ બનાવો. તે જરૂરી ફીલ્ડ, ઈમેલ ફોર્મેટ અને લંબાઈ મર્યાદા ચકાસે. ફક્ત બ્રાઉઝરમાં થતી ચકાસણી પર ક્યારેય ભરોસો ન કરો.
4. પહેલા ડેટાબેઝમાં સાચવો. જુઓ તમારી એપમાં ડેટાબેઝ કેવી રીતે ઉમેરવો.
5. ઈમેલ પ્રોવાઇડર સેટ કરો. એકાઉન્ટ બનાવો, તમારું મોકલવાનું ડોમેન ચકાસો, અને API કી સિક્રેટ તરીકે સંગ્રહિત કરો. તમારી એપમાંથી ઈમેલ કેવી રીતે મોકલવા માં SPF, DKIM સાથે ડોમેન સેટઅપ વિગતવાર છે.
6. સાચવ્યા પછી સર્વરથી સૂચના મોકલો. મોકલનાર તરીકે તમારું ચકાસાયેલું ડોમેન અને reply-to તરીકે મુલાકાતીનું સરનામું વાપરો — મુલાકાતીના સરનામા પરથી "from" ન મોકલો, નહીં તો તે સ્પૂફિંગ તરીકે નકારાઈ શકે છે.
7. વૈકલ્પિક રીતે મુલાકાતીને ઓટો-રિપ્લાય આપો, પણ ટૂંકો રાખો; સ્પામ સરનામાંને ઓટો-રિપ્લાય તમારી મોકલનાર પ્રતિષ્ઠાને નુકસાન કરી શકે.
8. સ્પામ સુરક્ષા ઉમેરો: હનીપોટ, રેટ લિમિટિંગ, પછી જરૂર હોય તો CAPTCHA-શૈલીની ચકાસણી.
9. પબ્લિશ થયેલી સાઇટ પર ટેસ્ટ કરો: સબમિટ કરો, ડેટાબેઝ તપાસો, તમારું ઇનબોક્સ અને સ્પામ ફોલ્ડર તપાસો, reply પર ક્લિક કરો.

સ્પામ રોકવું

લાઇવ થયાના થોડા દિવસોમાં કોન્ટેક્ટ ફોર્મ બોટ આકર્ષે છે. ઓછામાં ઓછી દખલગીરીથી વધુ સુધી બચાવના સ્તરો લગાવો:

1. હનીપોટ ફીલ્ડ. માણસોથી છુપાયેલું ફીલ્ડ; બોટ તે ભરે છે. વાસ્તવિક મુલાકાતીઓને તેની કોઈ કિંમત નથી.
2. સર્વર-સાઇડ રેટ લિમિટિંગ. એક સરનામું એક સમયગાળામાં કેટલા સંદેશ મોકલી શકે તે મર્યાદિત કરે છે.
3. સામગ્રી નિયમો. લિંકથી ભરેલા સંદેશ, અથવા ખાલી કે અતિશય લાંબા સંદેશ ફીલ્ડવાળા નકારો.
4. CAPTCHA-શૈલીની ચકાસણી, જેમ કે Cloudflare Turnstile અથવા Google reCAPTCHA. ટોકન તમારા સર્વર પર ચકાસવું જોઈએ; ફક્ત બ્રાઉઝરમાં ચાલતી ચકાસણી છોડી શકાય.

સામાન્ય ભૂલો

• "મોકલાયું!" બતાવવું જ્યારે કંઈ મોકલાયું નથી. UI સર્વર પ્રતિસાદ પહેલાં કે તેની પરવા કર્યા વગર સફળતા બતાવે છે. હંમેશા સર્વરની રાહ જુઓ.
• ફક્ત ઈમેલ, ડેટાબેઝ નહીં. એક ખોટી ગોઠવાયેલી કી અને પૂછપરછ અઠવાડિયાઓ સુધી કોઈના ધ્યાનમાં આવ્યા વિના ગાયબ થઈ શકે.
• ફ્રન્ટએન્ડ કોડમાં API કી. કોઈપણ તેનો ઉપયોગ કરીને તમારા નામે ઈમેલ મોકલી શકે.
• ચકાસ્યા વગરનું મોકલવાનું ડોમેન. સૂચનાઓ સ્પામમાં જાય અથવા ક્યારેય ન પહોંચે.
• મુલાકાતીના ઈમેલ પરથી "from" મોકલવું. તેના બદલે reply-to વાપરો.
• લંબાઈ મર્યાદા નહીં. બોટ મોટા લખાણના બ્લોક પેસ્ટ કરે છે.
• લાઇવ સાઇટ ક્યારેય ટેસ્ટ ન કરવી. પ્રિવ્યૂ અને પ્રોડક્શન વચ્ચે કી અને ડોમેન ઘણીવાર અલગ હોય છે.

ચેકલિસ્ટ

• દૃશ્યમાન લેબલ અને સ્પષ્ટ ભૂલો સાથે ટૂંકું ફોર્મ
• સર્વર-સાઇડ ચકાસણી અને લંબાઈ મર્યાદા
• દરેક સંદેશ ડેટાબેઝમાં સાચવાય છે
• સૂચના ઈમેલ ચકાસાયેલા ડોમેન પરથી, reply-to સેટ સાથે મોકલાય છે
• ઈમેલ API કી ફક્ત સર્વર-સાઇડ સિક્રેટમાં સંગ્રહિત
• હનીપોટ અને રેટ લિમિટિંગ લાગુ
• સફળતા સંદેશ ફક્ત સર્વર પુષ્ટિ પછી જ દેખાય
• ગોપનીયતા નોંધ તમારી ગોપનીયતા નીતિ સાથે લિંક
• પબ્લિશ થયેલી સાઇટ પર શરૂઆતથી અંત સુધી ટેસ્ટ, સ્પામ ફોલ્ડર સહિત

Mythex માં કોન્ટેક્ટ ફોર્મ

Mythex માં તમે ચેટમાંથી આખું બનાવી શકો છો. ફોર્મ અને ડેટાબેઝ એક જ પ્રોમ્પ્ટમાં માંગો (અથવા /database ટાઇપ કરો) જેથી સબમિશન સચવાય. Mythex પાસે બિલ્ટ-ઇન ઈમેલ મોકલવાનું પ્રોડક્ટ નથી, તેથી સૂચનાઓ માટે તમે Resend, SendGrid અથવા Postmark જેવો પ્રોવાઇડર લાવો, તેની કી /secrets અથવા પ્રોજેક્ટ સેટિંગમાં ઉમેરો, અને એજન્ટને સર્વર પરથી મોકલવા કહો — જુઓ તમારી એપમાંથી ઈમેલ મોકલો. તેના પર આધાર રાખતા પહેલા, Preview માં ફોર્મ સામે App Testing (/test) ચલાવો, પછી પબ્લિશ કરો અને લાઇવ URL પર ટેસ્ટ કરો.

કોન્ટેક્ટ ફોર્મ મોટાભાગની નાના બિઝનેસ વેબસાઇટ અને લેન્ડિંગ પેજ નો મુખ્ય ભાગ છે. લોન્ચ પહેલાં સુરક્ષા ચેકલિસ્ટ તપાસો.

પ્રશ્નો