Chủ Nhật, 26 tháng 5, 2013

Hướng dẫn thêm form liên hệ Google Docs vào Blogger

Đã bao giờ bạn nghĩ "Làm sao để tạo một form liên lạc đỉnh vào các trang blogger"? Nếu bạn là một người dùng Google Docs, bạn sẽ dể dàng có lời giải với nó.

Nếu bạn là một fan của Blogger, bạn sẽ biết được Google đã ưu ái thế nào khi tạo cho Blogger một giao diện hết sức dễ dàng customize trở nên "không đụng hàng" với bất cứ ai.
blogger
Tạo form
Để bắt đầu, hãy đăng nhập vào Google Docs, tạo một form mới như hình dưới. Bạn có thể thêm tiêu đề vào form để dễ quản lý, bạn cũng có thể chừa trống với tên "Untitled". Để tạo một form liên lạc đúng cách, bạn nên cho phép người dùng sử dụng các câu hỏi dạng "paragraph text". Nó sẽ cho phép đủ khoảng trống để người dùng điền câu hỏi hay comment.
tạo form
contact
Chú ý rằng mặc định form sẽ tự động thêm vào hai câu hỏi đơn giản. Đảm bảo rằng xoá hai câu hỏi này, hoặc nó sẽ làm phiền nếu bạn không cần đến. Mặc dù vậy, nếu bạn muốn thêm câu hỏi mà dùng các câu trả lời có định dạng khác(như checkbox, multiple choice...) thì bạn cũng có thể hoàn toàn chủ động. Sau khi hoàn thành, hãy lưu lại tất cả.
form
Gắn form
Thường các form mẫu của Google sẽ không được phép thay đổi mẫu có sẵn để phù hợp với design của blog bạn. Chắc chắn, bạn có thể nhúng form bằng code iFrame, nhưng nó vẫn để nguyên định dạng như lúc trước khi thiết kế. Dù vậy, vẫn có giải pháp cho vấn đề này.
Sau khi đã tạo xong form, hãy quay lại Google Docs và mở spreadsheet mà bạn vừa tạo form. Bởi vì là một trình ghi chú, spreadsheet sẽ cho phép bạn thấy tất cả những thiết kế của bạn. Khi đã vào trang rồi, chọn "Form" ở menu và click "Go to live form".
tạo forum
form google
Trong khi xem form, bạn nên dùng các chức năng mà trình duyệt ho phép để xem source code. Nếu bạn dùng Chrome, bạn sẽ rất dễ thực hiện đều này bằng cách chọn đoạn text và chọn "View Page Source".
contact me
mã code
Tại đây, mọi thứ có thể sẽ rất chán nhưng hãy kiên nhẫn. Dùng chức năng tìm kiếm của web (ctrl F) tìm từ khoá "form action". Khi đã thấy rồi, bạn sẽ thấy code sau:
<div class="ss-form><form action="YOUR_FORM_URL" method="POST" id="ss-form">
Hãy ghi nhớ vị trí của nó, sau đó tìm tiếp đoạn code sau:
</script></div>
Copy tất cả lại. Bạn có thể copy vào notepad nếu bạn muốn. 
Cài đặt form
Sau khi đã thành công, bạn nên vào dashboard của Blogger. 
Đầu tiên, bạn nên tạo một trang mới và điền tiêu đề "Contact Me" hoặc những gì bạn thích. Sau đó hãy mở nó ra, vào phần chỉnh sửa HTML và paste đoạn code trong notepad vào.
tạo trang blog
Và giờ đây, bạn đã có một form liên lạc đơn giản của riêng bạn. Ngay lúc này, bạn sẽ thấy kết quả tương tự hình dưới. Tuy nhiên, nó có thể khác đôi chút tuỳ theo tuỳ chỉnh của bạn.
khug van ban
Chỉnh form
Nếu bạn có vấn đề về khoảng trống giữa tiêu đề và câu hỏi, hãy tìm tag br và xoá chúng. Tuy nhiên, nếu bạn có vấn đề về kích thước của khung trả lời, hãy tìm code sau:
<textarea name="entry.0.single" rows="8" cols="75" class="ss-q-long" id="entry_0">
Bằng cách chỉnh "cols", bạn có thể thay đổi bề rộng của hộp thoại. Ngoài ra, bạn còn có thể chỉnh font chữ bằng cách chỉnh trang. Nếu đã hoàn tất, sản phẩm của bạn có thể giống hình dưới.
me
Lời kết
Đây là hứa dẫn ngắn và hiệu quả để thay thế form của Google Docs vào Blogger của bạn, và hướng dẫn có thể áp dụng với bất kỳ blog hay website nào. Bạn có thể làm nhiều hơn bài viết trên nếu chịu khó kiên nhẫn tìm tòi đôi chút.

Không có nhận xét nào:

Đăng nhận xét