Button Boardgame Admin

Đăng nhập để quản lý nội dung website

Demo: mật khẩu là admin123

Trang chủ

Chỉnh tiêu đề, mô tả và nút kêu gọi hành động

✓ Đã lưu
Tiêu đề chính (Hero)
Gõ đúng từ xuất hiện trong một trong 3 dòng trên
Nút kêu gọi hành động
Xem trước

Lịch chơi

Quản lý các buổi chơi trong tuần

✓ Đã lưu

Board Game

Quản lý thư viện board game của quán

✓ Đã lưu

Game Master

Quản lý đội ngũ dẫn chơi

✓ Đã lưu

Phòng chơi

Quản lý các phòng chơi, sức chứa và điều kiện Block phòng

✓ Đã lưu

Thuê GM sự kiện

Quản lý các gói thuê Game Master cho team building & sự kiện

✓ Đã lưu

Liên hệ & Nút

Cập nhật số điện thoại và link Messenger hiển thị trên website

✓ Đã lưu
📞 Nút Gọi Đặt Bàn Ngay
Nhập số có dấu cách hoặc không — hiển thị trên nút và gọi trực tiếp khi bấm
💬 Nút Messenger
Vào Facebook Page → About → tìm mục "Messenger link" để lấy link chính xác

SEO & Tracking

Tối ưu công cụ tìm kiếm, gắn Google Tag Manager và xác minh Google Search Console

✓ Đã lưu
🔎 Thẻ SEO cơ bản
0 ký tự — nên trong khoảng 50–60 ký tự. Hiển thị trên tab trình duyệt & kết quả tìm kiếm Google. Để trống sẽ dùng tiêu đề mặc định có sẵn.
0 ký tự — nên trong khoảng 150–160 ký tự. Hiển thị dưới tiêu đề trên kết quả tìm kiếm Google. Để trống sẽ dùng mô tả mặc định có sẵn.
Không còn nhiều tác dụng xếp hạng với Google hiện nay nhưng một số công cụ tìm kiếm khác vẫn đọc
📝 Tiêu đề các khu vực (H2 & mô tả)
Mỗi khu vực trên trang chính có 1 nhãn nhỏ, 1 tiêu đề H2 và 1 câu mô tả ngắn — chỉnh trực tiếp ở đây thay vì sửa code. Dùng nút gạt để ẩn hẳn khu vực đó khỏi website (kể cả link menu) mà không cần xoá dữ liệu.
📅 Khu vực Lịch chơi
🎫 Khu vực Menu
🎲 Khu vực Board Game
👤 Khu vực Game Master
🚪 Khu vực Phòng chơi
🎉 Khu vực Thuê GM sự kiện
🛎️ Khu vực Gọi món tại bàn
📢 Chia sẻ mạng xã hội (Open Graph)
Ảnh hiển thị khi link được share lên Facebook/Zalo/Messenger — nên dùng tỉ lệ 1.91:1 (ví dụ 1200×630px)
⚠️ Lưu ý kỹ thuật: Facebook/Zalo lấy ảnh & tiêu đề chia sẻ từ mã nguồn HTML gốc, không chạy JavaScript. Vì website này tải dữ liệu qua JavaScript, ảnh/tiêu đề chia sẻ ở đây hiển thị đúng cho người dùng dùng trình duyệt thật và Google, nhưng để chắc chắn 100% đúng khi share Facebook/Zalo, hãy nhắn tôi để nhúng cứng ảnh/tiêu đề này thẳng vào mã nguồn index.html.
📊 Google Tag Manager
ID hiện đang chạy trên site là GTM-W27LTB95 (đã nhúng cứng sẵn trong index.html theo đúng hướng dẫn của Google — chạy nhanh nhất, hoạt động cả khi trình duyệt tắt JavaScript). Ô này chỉ cần dùng khi sau này bạn tạo GTM ID mới — dán ID mới vào đây và Lưu, site sẽ tự tải thêm container mới ngay lập tức (không cần sửa code, không cần nhờ ai) mà không cần đợi tôi cập nhật lại mã nguồn.
⚠️ Lưu ý: cách này vẫn theo dõi đầy đủ người dùng thật (trình duyệt có JavaScript — tức gần như 100% khách truy cập, vì bản thân website cũng cần JavaScript mới hiển thị được nội dung). Chỉ khác là container mới sẽ chạy trễ khoảng 1-2 giây so với container đã nhúng cứng, và không có phần dự phòng cho trình duyệt tắt JavaScript. Nếu muốn ID mới cũng được nhúng cứng 100% chuẩn như ID hiện tại, nhắn ID đó cho tôi bất cứ lúc nào.
✅ Google Search Console
Vào search.google.com/search-console → Thêm property (chọn "Tiền tố URL") → chọn phương thức xác minh "Thẻ HTML" → copy phần content="..." (chỉ đoạn chữ bên trong dấu ngoặc kép) dán vào đây, rồi quay lại Search Console bấm Xác minh. Để trống nếu chưa cần.

Kết nối Cloud

Đồng bộ dữ liệu admin lên tất cả thiết bị qua JSONBin.io (miễn phí)

✓ Đã lưu
☁️
Tại sao cần kết nối Cloud?
Không có cloud, thay đổi từ admin chỉ lưu trên máy này — khách xem website trên điện thoại sẽ không thấy. Sau khi cài, mọi thay đổi tự động đồng bộ cho tất cả.
Hướng dẫn lấy JSONBin miễn phí (3 bước):
1. Vào jsonbin.io → Đăng ký tài khoản miễn phí
2. Vào API Keys → copy Secret Key (bắt đầu bằng $2b$...)
3. Vào Bins → Create Bin → đặt tên → copy BIN ID (dãy số/chữ)
Dán vào 2 ô bên dưới rồi bấm Lưu & Đồng bộ lần đầu.

⚠️ Quan trọng để mọi thiết bị thấy dữ liệu:
Sau khi lưu xong, copy BIN ID dán vào file index.html dòng:
const CLOUD_BIN_ID = 'DÁN_BIN_ID_VÀO_ĐÂY';
Rồi upload lại index.html lên Netlify — khách trên mọi thiết bị sẽ thấy cùng dữ liệu.
📁 Cấu trúc thư mục ảnh trên Netlify
📁 buttonboardgame/
   ├── index.html
   ├── admin.html
   └── 📁 images/
         ├── 📁 schedule/   ← ảnh buổi chơi
         ├── 📁 gm/         ← ảnh game master
         └── 📁 rooms/      ← ảnh phòng chơi

Upload cả thư mục buttonboardgame lên Netlify → dùng link dạng buttonboardgame.com/images/schedule/ten-anh.jpg dán vào ô URL trong admin.

Lấy từ trang Bins → tên bin → URL hoặc mục Details
Lấy từ Account → API Keys. Chỉ lưu trên máy này, không gửi đi đâu ngoài JSONBin.

Thư viện ảnh

Upload lên Cloudinary → copy link → dán vào ô hình ảnh

✓ Đã upload
☁️
Cài đặt Cloudinary (miễn phí)

Upload không giới hạn, lấy link dùng ngay.

3 bước cài một lần duy nhất:
1. Vào cloudinary.com → Đăng ký miễn phí (25GB)
2. Settings → Upload → Add upload preset → Signing Mode: Unsigned → Save
3. Copy Cloud Name (Dashboard) + Upload Preset Name dán vào ô dưới