theme.bwt có thể được coi là template chính, tất cả các template đều được hiển thị trong theme.bwt. Tất cả các đối tượng được lặp lại trong giao diện như menu, đầu trang, chân trang,... nên được đặt trong theme.bwt
Có 2 đối tượng Liquid bắt buộc phải có trong theme.bwt là:
-
Biến {{ content_for_header }} bắt buộc phải đặt trước khi đóng thẻ . Nó sẽ được dùng để đặt các mã cần thiết của hệ thống Sapo vào trước thẻ như các mã Google Analytics, Sapo Analytics hay mã khác dùng cho Sapo app,...
-
ContentPlaceHolder
Khối {% block "ContentPlaceHolder" %} {% endblock %}
bắt buộc phải được đặt trong thẻ . Nó sẽ được sử dụng để hiển thị nội dung từ các template khác của giao diện
Nếu không có 2 đối tượng trên trong file theme.bwt, hệ thống sẽ báo lỗi và giao diện của bạn sẽ không thể hiển thị.
Bạn có thể dễ dàng thêm vào thẻ các class đặc biệt để có thể hiện thị các giao diện khác nhau. Chú ý rằng bạn phải loại bỏ đuôi .bwt của template để tránh việc gây ra lỗi khi hiển thị. Ví dụ sau sẽ sử dụng bộ lọcreplace
để thay dấu chấm bằng khoảng cách sau đó dùng bộ lọc truncatewords
để lấy ra tên của template để làm class cho thẻ
<body class="{{ template | replace: '.', ' ' | truncatewords: 1, '' }}" id="{{ page_title | alias }}"> .... </body>
Trong theme.bwt bạn có thể muốn hiển thị thêm các nội dung từ các đối tượng đặc biệt như đặt nội dung của trang Giới thiệu.
Nếu bạn muốn gửi giao diện của bạn lên hệ thống của Sapo, theme.bwt sẽ phải đáp ứng đủ các điều kiện sau
- Logo hoặc store.name phải có trên đầu trang và được đặt đường dẫn về trang chủ.
- Menu chính phải được sử dụng dữ liệu từ menu "Main menu".
- Menu ở chân trang phải được sử dụng dữ liệu từ menu "Footer".
- Ô tìm kiếm hoặc liên kết đến trang tìm kiếm phải được đặt ở đầu trang hoặc chân trang.