Câu trả lời ngắn gọn
Bạn có thể thêm mã của riêng mình ở ba nơi trong trình thiết kế: mục Mã tùy chỉnh bên trong một trang, cài đặt CSS tùy chỉnh và cài đặt JavaScript tùy chỉnh. Không có ô nào để dán mã vào phần head của cửa hàng. Với các thẻ trong phần head, hãy dùng ứng dụng tương ứng (xem danh sách bên dưới).
Công cụ nào cho việc nào
- Xác minh cửa hàng với Google Search Console, hoặc thêm thẻ meta
google-site-verification: ứng dụng Domain Verifier. Nó cũng xử lý việc xác minh tên miền với Facebook (Meta), TikTok và Snapchat. - Google Analytics, thẻ Google Ads hoặc bất kỳ thẻ nào bạn quản lý trong Google Tag Manager: ứng dụng Google Tag Manager.
- Pixel Facebook, TikTok, Snapchat, ChatGPT, Pinterest, X hoặc Google Ads: xem Facebook, TikTok, Snapchat, ChatGPT, Pinterest và X, hoặc Chuyển đổi Google Ads.
- Nguồn cấp sản phẩm cho Google Merchant Center: xem Google Merchant Center. Dùng Domain Verifier cho Search Console.
- Bản đồ nhiệt và bản ghi phiên: xem Microsoft Clarity hoặc Contentsquare.
- Một tiện ích hoặc nội dung nhúng bên trong trang (biểu mẫu đặt lịch, video, bản đồ): mục Mã tùy chỉnh bên dưới.
- Kiểu cho toàn bộ cửa hàng hoặc một mục: xem CSS tùy chỉnh.
- Một script trên mọi trang: xem JavaScript tùy chỉnh.
Vì sao mã trong trình thiết kế không thể xác minh trang web
Google, Meta và các nền tảng khác tìm thẻ của họ trong phần head của trang khi xác minh. Mục Mã tùy chỉnh đặt mã của bạn bên trong phần thân trang, nơi mục đó nằm. JavaScript tùy chỉnh chạy trong trình duyệt của khách sau khi trang tải xong. Không cách nào đặt thẻ vào phần head theo cách các nền tảng này cần, nên việc xác minh thất bại. Domain Verifier thêm thẻ vào đúng chỗ giúp bạn.
Mục Mã tùy chỉnh
Một mục bạn có thể thêm vào bất kỳ trang nào, tối đa 2 mục mỗi trang. Mở tab Các mục, bấm Thêm mục mới và chọn Mã tùy chỉnh. Mục này có ba ô:
- HTML: mã HTML hiển thị bên trong mục này.
- CSS: kiểu chỉ áp dụng cho mục này, nên không thể làm hỏng phần còn lại của trang.
- JavaScript: chạy mỗi lần mục được hiển thị. Mã của bạn nhận mục dưới tên
container, vì vậy hãy dùngcontainer.querySelector(...)để truy cập mã HTML của bạn.
Bạn cũng đặt chiều rộng, bảng màu và khoảng đệm như mọi mục khác. Dùng Áp dụng cho tất cả trang để sao chép nó sang các trang khác đã có mục Mã tùy chỉnh.
Mẹo
- Kiểm tra mã trong bản xem trước của trình thiết kế, rồi xuất bản và thử cửa hàng trực tuyến trên điện thoại và máy tính.
- Nếu trang trông bị lỗi sau một thay đổi, hãy xóa mã, xuất bản, rồi thêm lại từng phần một.
- Script của bên thứ ba có thể làm chậm cửa hàng. Chỉ thêm những gì bạn cần.
- Trợ lý AI được kết nối với cửa hàng chỉ có thể thay đổi mã tùy chỉnh nếu chủ cửa hàng cho phép. Xem Quản lý quyền truy cập của trợ lý.