Cài Đặt Mã Widget MGID trên Wix.com

Giới Thiệu

Mã widget MGID (Simple JS) là mã cài đặt MGID ở cấp độ website mà các nhà xuất bản sử dụng để tích hợp widget trên trang web. Khác với mã cài đặt tiêu chuẩn, thẻ Simple JS được thiết kế nhẹ và hiệu quả. Nó đảm bảo tác động tối thiểu đến hiệu suất của trang và tránh các bước phức tạp cho nhà xuất bản.


Mã cài đặt widget bao gồm hai phần:

  1. Head Script: Đây là preloader MGID cần được đặt bên trong phần <HEAD> của trang web.
  2. Body Container: Đây là thẻ div nơi widget MGID sẽ được hiển thị trong bài đăng blog.

Bạn cần tạo các đơn vị quảng cáo (widget) mong muốn trong bảng điều khiển và nhận mã widget.

1. Wix

Cách tích hợp mã widget MGID (Simple JS) trên Wix.com

Có hai phương án đáng tin cậy để cài đặt widget, nhưng chúng có một số hạn chế. Do giới hạn của nền tảng Wix, bất kỳ quảng cáo nào chúng tôi đặt trên các trang web Wix sẽ được hiển thị trong iframe. Điều này có nghĩa là bảng điều khiển sẽ có các thống kê giới hạn và không có chức năng cuộn vô hạn (infinite scroll) cho phương án đầu tiên.


Phương án 1 - Thêm một Phần với Mã Tùy Chỉnh

Phương án đầu tiên bao gồm việc tạo một phần mới trong phần “chỉnh sửa trang” cho loại trang mà bạn chọn. Kỹ thuật này có thể áp dụng cho bất kỳ loại trang nào cho phép bạn thêm các phần hoặc khối. Chúng ta sẽ sử dụng bài đăng blog làm ví dụ.

Mặc dù SimpleJS sử dụng mã trong <head> và <body>, Wix yêu cầu một cách tiếp cận khác. Chúng ta sẽ khám phá cách đạt được kết quả tương tự trên Wix.

Thực hiện theo các bước sau:

  1. Điều hướng đến bảng điều khiển trang web Wix của bạn, chọn Sites, và nhấp vào nút Edit Site.

2. Wix

2. Chọn loại trang mà bạn muốn đặt quảng cáo. Các thao tác có thể hơi khác nhau tùy vào loại trang web và chủ đề bạn đã chọn, nhưng phương pháp thực hiện vẫn tương tự. Trong trường hợp này, chúng ta sẽ chọn Post vì trang web của chúng ta là loại Blog.

3. Wix

3. Đặt quảng cáo dưới bài viết. Cuộn xuống cuối bài viết, đến phần các bài đăng gần đây và khối bình luận, sau đó nhấp vào Thêm Phần

4. Wix

4. Bạn có thể chọn bất kỳ loại phần nào ở đây; trong trường hợp này, chúng ta sẽ chọn Thêm một Phần Trống 

5. Wix

5. Đặt đơn vị quảng cáo vào phần mới tạo:

  • Nhấp vào phần vừa tạo, sau đó nhấp vào nút (+) ở góc trên bên trái để thêm Phần tử HTML vào phần này.

6. Wix

7. Wix

  • Sao chép các phần mã Head và Body từ bảng điều khiển MGID của bạn vào một tệp văn bản hoặc ứng dụng ghi chú.

8. Wix_GIF

  • Dán toàn bộ mã vào hộp văn bản mã và nhấp vào “Cập nhật”

9. Wix

  • Thay đổi kích thước của khối và phần sao cho đơn vị quảng cáo hiển thị vừa vặn

10. Wix

Bây giờ, hãy đảm bảo rằng đơn vị quảng cáo có thể hiển thị trên mọi chủ đề

6. Thêm nền sáng cho phần hoặc nền trắng cho đơn vị quảng cáo

  • Thêm màu sáng cho nền của phần: Nhấp vào phần, chọn Thay đổi Nền và chọn màu trắng.

11. Wix_GIF

  • Thêm màu trắng cho nền của đơn vị quảng cáo trong mã widget: Chỉnh sửa mã HTML và thêm đoạn mã sau:
style="background-color:white;"

Sau khi thêm mã, nhấp vào “Cập nhật”

12. Wix_GIF

Lựa chọn cài đặt này có một số hạn chế và không phải là lý tưởng. Ví dụ, bạn không thể đặt bất kỳ thứ gì bên trong nội dung hoặc bất kỳ khối nào.

Xem xét phương án thứ hai có thể là lựa chọn tốt hơn. Lưu ý rằng bạn có thể sử dụng cả hai phương án cùng lúc.


Phương án 2 - Mã Tùy Chỉnh Bên Trong Nội Dung

Chúng ta có thể nhúng khung HTML vào bất kỳ đâu trong nội dung của trang, nhưng phải làm thủ công cho mỗi bài viết hoặc bài đăng mới.

Thực hiện theo các bước sau:

  1. Điều hướng đến bảng điều khiển trang web Wix của bạn và chọn chỉnh sửa bất kỳ bài viết hoặc bài đăng nào của bạn.
13. Wix_GIF

2. Nhấp vào bất kỳ phần nào của nội dung nơi bạn muốn đặt đơn vị quảng cáo. Nhấp vào biểu tượng |+| xuất hiện ở bên trái nội dung và chọn HTML Code.

14. Wix_GIF

3. Nhấp vào Chỉnh sửa HTML, sao chép và dán cả hai phần của mã đơn vị quảng cáo vào hộp văn bản đã mở và điều chỉnh kích thước hộp theo ý thích của bạn. Nhớ rằng các đơn vị quảng cáo của chúng ta là đáp ứngvà có thể thay đổi theo kích thước khung.

15. Wix_GIF

4. Bây giờ, thêm dòng mã sau ngay sau phần <div

 <div style="background-color:white;" 

Điều này sẽ đảm bảo rằng nền của đơn vị quảng cáo luôn là màu trắng và tất cả các phần tử văn bản đều hiển thị rõ ràng.

16. Wix