Thêm vài cách tạo form liên lạc “Contact us”

Thêm vài cách tạo form liên lạc Contact usGần đây tôi nhận được nhiều yêu cầu trợ giúp để tạo một trang liên lạc cho blog hoặc website, dạng như trang Contact Us trên blog-của-tui vậy á. Đầu năm ngoái, tôi giới thiệu dịch vụ Jotform và hiện tại tôi vẫn đang sử dụng nó cho blog.

Nhưng tôi nghĩ cần phải có thêm một vài lựa chọn nữa để bạn có thể tự tìm được dịch vụ ưng ý. Mấy ngày trước, tôi có dịp tải về một bộ form contact us được tặng miễn phí, bình thường nó có giá khoảng $5. Hôm nay, tôi đã cài thử nó nhưng thấy thất vọng quá. Nó chạy trên database riêng và có trang quản lý riêng nhưng đáng tiếc là nó không hỗ trợ Unicode và phần quản lý còn nhiều lỗi khó chịu. Vì vậy tôi quyết định giới thiệu đến các bạn thêm 2 cách để tạo form liên lạc là sử dụng bộ mã nguồn có sẵn hoặc sử dụng dịch vụ EmailMeForm (tương tự như JotForm).

1. Sử dụng bộ mã nguồn miễn phí Contact form free :

Bạn truy cập vào địa chỉ : Contact form free . Bạn sẽ thấy giao diện mẫu hiện ra, khá là đơn giản nhưng hiệu quả. Giờ hãy tải về bộ mã nguồn từ trang trên hoặc tải trực tiếp tại đây , dung lượng chỉ có 6Kb.

Sau khi tải về bạn giải nén ra, sử dụng Notepad để mở tập tin “free_settings.php” và chỉnh sửa lại như sau :

Thêm vài cách tạo form liên lạc Contact us

Trong đó “email_to” bạn sẽ gõ địa chỉ email mà bạn muốn nhận được thông báo nếu có người liên lạc với bạn. Và “thankyou” là trang hiển thị sau khi người dùng bấm nút Submit để gửi mail.

Khi truy cập vào trang trên, bạn sẽ thấy giao diện của Contact Form Free được thiết kế sẵn là tiếng Anh, bạn có thể thay đổi nó sang tiếng Việt bằng cách mở tập tin “contactform.htm” và tiến hành chỉnh sửa lại tiều đề tiếng Anh theo ý thích :

Tập tin gốc :
Thêm vài cách tạo form liên lạc Contact us

Sửa thành :
Thêm vài cách tạo form liên lạc Contact us

Bạn có thể chỉnh lại kích thước cho form ở chỗ tôi đánh dấu số 1 hình bên trên. Sau khi hoàn tất, bạn upload nó lên server. Bạn có thể chạy trực tiếp bằng đường dẫn đến tập tin “contactform.htm” hoặc bạn có thể nhúng nó vào một trang nào đó trên blog. Tôi ví dụ, tôi nhúng trực tiếp vào bài viết này như sau :



Trang liên hệ


Những trường có đánh dấu * là bắc buộc nhập.


Tất cả những gì bạn cần làm là copy toàn bộ nội dung tập tin “contactform.htm” và dán vào nơi bạn cần hiển thị là xong. Nhưng để chạy được, bạn phải chỉnh lại đường dẫn ở chỗ tôi đánh dấu số 2 trong cái hình bên trên, chính là đường dẫn tập tin “free_process.php” mà bạn đã chép lên server.

Theo quan sát, phải mất khoảng 3 phút sau khi người dùng bấm nút “Submit” thì bạn mới nhận được email, trông nó sẽ như thế này :

Thêm vài cách tạo form liên lạc Contact us

Tạm thời là vậy. Tôi sẽ cập nhật tiếp phần còn lại vào tối nay.

14 Comments
  1. có cách nào tạo form trông chuyên nghiệp ko anh hàng xóm !! hồi xưa em xài plugin contac form 7 nhưng nó ko hoạt động !!

  2. Jotform có send đính kèm cách trên có đính kèm dc k a.

  3. @trungtamgiasu : Đứng trong hàng ngũ miễn phí thì Jotform là thuộc dạng chuyên nghiệp rồi rồi đó 🙂

    @hnguyen : cách bên trên ko gửi được file đính kèm 🙂

  4. e lam như a chỉ trên web nhưng sao khi nhấn submit nó không chạy được , e đã up file free_process.php lên host nhưng vẫn không được ạ

  5. cái jotform sao e làm nó đứng hoài vậy a. nó chạy được 1 lúc . xong rùi e nháy chữ Submit nó ra Form Disabled nè. giúp dùm e vs…

    • Em gửi mail cho anh thông tin đăng nhập Jotform, anh sẽ kiểm tra và test thử có được hay không. Chứ em nói vậy a không biết đường nào mà lần cả 🙂 . Xong việc thì anh sẽ báo để em đổi lại password.

  6. upload lên server là sao a. sever nào e không bt a oy.
    còn sữa action free_process.php j đó thành a vậy a :d

  7. e mun lam Y kien phan hoi nhu Web cua a vay gio e phai lam sao vay a.neu lam ben Contact form free thi co hien len truc tiep len web khong vay

  8. e cung lam ma sao khong ve mail vay a

  9. anh ơi cho em hỏi là em tạo form ở jotform nhưng mà lâu lâu nó tự nhiên nó hiện ra dòng này, không biết sao

    This form has exceeded its allocated quota.

    có thể lấy mã nguồn về làm như bài trên đc kg anh

  10. Anh ơi cho em hỏi là thêm 1 trường vào cái form này thêm làm sao anh

Trả lời anhhangxom Huỷ phản hồi