Contact

Chúng tớ rất muốn nhận được phản hồi từ bạn! Nếu bạn có thắc mắc, góp ý hay chỉ đơn giản là muốn nói lời chào, đừng ngại gửi tin nhắn qua form bên dưới nhé. Ý kiến và câu hỏi của các bạn đều rất quan trọng với chúng tớ, nên chúng tớ sẽ cố gắng phản hồi nhanh chóng. Chỉ cần điền form và bọn mình sẽ liên hệ lại sớm nhất có thể nhé!

Xin vui lòng đừng lạm dụng form này nhé!

Name

Email

Message

Form này hoạt động như thế nào?

Phiên bản gốc của form này đã sử dụng biểu mẫu liên hệ mặc định của Blogger, tuy nhiên vì tớ sử dụng CloudFlare để quản lý DNS, nên đã gặp vấn đề về CORS. Và vì lợi ích mà CloudFare mang lại là quá lớn, nên tớ không định sử dụng biễu mẫu mặc định nữa.
Vậy phải làm như thế nào? Chẳng lẽ tạo một hosting hoặc build một server riêng chỉ để viết một API cho việc submit contact form?

Đừng lo, hãy đọc bài viết này, tớ sẽ hướng dẫn chi tiết cách tạo một "API" trên CloudFlare Worker để dùng làm submit contact form cho Plus UI nói riêng, và bất kì trang web nói chung nào khác nhé!

Tại sao tôi gặp lỗi khi submit form?

Thông thường sẽ có loại lý do sau:

1. Lý do mà tớ biết: Là do đã đạt đến giới hạn miễn phí của CloudFlare là 100.000 request 1 ngày. Tuy nhiên điều này khá khó xảy ra. Nhưng tớ cũng sẽ rất vui nếu nó xảy ra ::))
2. Lý do mà tớ không biết: Nghĩa trên mặt chữ, tớ không biết =))))

Tuy nhiên, dù vì lý do gì đi chăng nữa, nếu bạn gặp trục trặc trong quá trình gửi form, thì đừng quên là chúng ta vẫn có Comment form ở ngay dưới này nha. Và cũng hãy chia sẻ với tớ biết là bạn gặp lỗi gì nhé.

To add contact form to a page, follow these steps:

1. In page editor view, click icon at the bottom right of the title.
2. Two options will appear: HTML view and Writing view.
3. Select 'HTML View'.
4. Copy and paste one of the following code.
   <!--[ Blogger contact form (Style 1) ]-->
   <form class='blogger-contact-form'>
     <div class='inF'>
       <input type='text' name='name' id='cf-a-name' placeholder=' '/>
       <label for='cf-a-name'>Name</label>
     </div>
     <div class='inF' data-message='A valid email address is required.'>
       <input type='email' name='email' id='cf-a-email' placeholder=' ' required=''/>
       <label for='cf-a-email'>Email</label>
     </div>
     <div class='inF' data-message='Message field cannot be empty.'>
       <textarea name='message' id='cf-a-message' placeholder=' ' required=''></textarea>
       <label for='cf-a-message'>Message</label>
     </div>
     <button id='cf-a-submit' class='ciB' type='submit'>Submit</button>
     <button id='cf-a-reset' class='ciB' type='reset'>Reset</button>
   </form>

   <!--[ Blogger contact form (Style 2) ]-->
   <form class='blogger-contact-form'>
     <div class='ciF'>
       <input type='text' name='name' id='cf-b-name' placeholder=' '/>
       <label for='cf-b-name'>Name</label>
     </div>
     <div class='ciF' data-message='A valid email address is required.'>
       <input type='email' name='email' id='cf-b-email' placeholder=' ' required=''/>
       <label for='cf-b-email'>Email</label>
     </div>
     <div class='ciF' data-message='Message field cannot be empty.'>
       <textarea name='message' id='cf-b-message' placeholder=' ' required=''></textarea>
       <label for='cf-b-message'>Message</label>
     </div>
     <button id='cf-b-submit' class='ciB' type='submit'>Submit</button>
     <button id='cf-b-submit' class='ciB' type='reset'>Reset</button>
   </form>

5. It is recommended to add a page description paragraph above the form.