Hướng dẫn cách dùng google sheet làm database lưu dữ liệu cho website mới nhất 2021

Share Code

Chào anh em, khi làm một website thì trước tiên phải nghĩ là nên dùng mã nguồn nào làm site nhỉ. Tuỳ theo mục đích sử dụng có thể làm bằng Wordpres, Xenforo, Jooma, hoặc pro thì viết trên FW Laravel, Nodejs vân vân…

Với những mã nguồn hoặc FW mạnh mẽ như thế này thì không cần dùng đến google sheet để lưu data rồi, có thể dùng SQL lưu trực tiếp cơ sở dữ liệu cho nó lẹ  😀

Còn nếu site nhỏ hoặc làm đơn giản ví dụ như anh em thiết kế trên Blogspot hay mấy cái wapbuilder chẳng hạn, thì việc lưu custom data là hơi khó khăn, cho nên trong bài này tôi hướng dẫn anh em sử dụng google sheet làm database lưu dữ liệu cho website blogspot(blogger) hay wapbuilder.

Trước khi vào bài thì anh em cũng cần chuẩn bị một số kiến thức HTML, Javascript nhé, chứ trong xanh như trang giấy trắng là không làm được đâu   😆  à quên chuẩn bị 1 cái tài khoản google nữa nhé :v

Bắt đầu nào

Đầu tiên chúng ta vào Google form tạo một biển mẫu

Sau đó thì tạo các trường theo yêu cầu cơ sở dữ liệu của bạn ví dụ:

Sau đó ấn vào tab câu trả lời và tạo file excel từ form sau đó chọn tạo bảng tính mới.

Sau đó sẽ được 1 file excel bao gồm các trường dấu thời gian và các trường đã tạo.

Cái này tôi nói sơ qua thôi chứ tạo biển mẫu với GG nó đơn giản anh em tự tìm hiểu nhé.

Xong phần tạo thì ấn vào xem trước, cái biểu tượng con mắt ở trên góc màn hình  ấy.

link form sẽ có dạng như thế này:

https://docs.google.com/forms/d/e/1FAIpQLScZNCPbLQ105zN1y7y2bGskTpXrrgQLFfQDd1aAaDELlCfZLg/viewform

anh em tạo 1 file txt trên máy tính để lưu mấy cái cần thiết tí nữa làm cho thuận tiện. Đầu tiên lưu cái link bạn vừa tạo xoá phần /viewform trong link đi thay bằng /formResponse?

Nó sẽ có dạng như thế này:

https://docs.google.com/forms/d/e/1FAIpQLScZNCPbLQ105zN1y7y2bGskTpXrrgQLFfQDd1aAaDELlCfZLg/formResponse?

Quay lại trang xem trước để lấy thông tin các thường tí cho vào code form

Ở trang này anh em ấn chuột phải vào trường rồi chọn Inspect

Lưu lại dãy số sau cặp dấu [[ kia tí nữa điền vào code form. Làm tương tự với tất cả các trường còn lại.

Sau đó đến phần viết code HTML form, như ví dụ trong bài, tôi có code như sau:

 <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Hướng Dẫn - VNvip.Pro</title>
</head>
 <label>Thông tin VNvip</label>
 <form action="https://docs.google.com/forms/d/e/1FAIpQLScZNCPbLQ105zN1y7y2bGskTpXrrgQLFfQDd1aAaDELlCfZLg/formResponse?embedded=true" method="POST">

    <input name="entry.1335574100" placeholder="Tên của bạn" required="" title="" type="text" value="" />


    <input name="entry.1385233720" placeholder="Điện thoại" required="" title="" type="text" value="" />

    <input name="entry.441151155" placeholder="Địa chỉ" required="" title="" type="text" value="" />



    <button type="submit" name="submit">Gửi</button>

</form>
</html>

 

Ở đây action là link google chúng ta vừa copy, thêm đuôi embedded=true đằng cuối link, và sử dụng method là POST. Anh em thay id vừa lưu vào name trong input của anh em thì sẽ có dạng như thế này “entry.1335574100”, thay hết các id vừa copy ở link của anh em vào.

OK lưu lại và test xem nó đã gửi thông tin lên google sheet chưa nhé. Để cho đẹp và chuyên nghiệp hơn thì anh em kết hợp với css và jquery nữa nhé.

Chúc anh em cồng thanh!

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *