Quản lý giao diện Template trong Topwebviet

26/05/2019 | Mai Đức Thạch | 44 xem

CHỨC NĂNG CỦA TEMPLATE

Trang Quản lý Giao diện Template: là nơi trình bày các mẫu nội dung HTML của toàn bộ nội dung của một trang web sử dụng các Modul và phần thân của trang.

Giao diện website thương hiệu gạo

Ví dụ trình bày các modul sử dụng trên giao diện trang chủ thuonghieugao.com

HƯỚNG DẪN QUẢN TRỊ

Trước khi tìm hiểu việc xây dựng các trang Template cho website, bạn nên tìm hiểu về quản lý Nội dung Sản phẩm và Tin tức, các Trang hệ thống, các trang Tiện ích và quản lý Giao diện Modul và Item.

Quản lý Giao diện Template trang web

Ví dụ minh họa việc trình bày Template trang chủ website đưa ra trong ví dụ bên trên.

Khi truy cập vào Trình đơn quản trị website: Giao diện -> Giao diện Template. Phần nội dung Quản lý Giao diện Template gồm các phần sau:

1. Phần Danh sách trang:

Phần Danh sách trang liệt kê danh sách tiêu đề các template đã tạo trong website.

2. Phần Thiết lập giao diện trang:

Phần Thiết lập giao diện trang cài đặt các thông tin cụ thể  cho phần thân của trang Template (tức là trình bày modul hệ thống {BODY} trong template của trang). Những cài đặt này được thể hiện trong những phần nhỏ hơn như sau:

Phần CÀI ĐẶT TIÊU ĐỀ: đặt tiêu đề cho trang Template hiện tại. Nên đặt tiêu đề định danh duy nhất và có ý nghĩa. Tiêu đề được liệt kê trong phần Danh sách trang ( ở mục 1 bên trên); trong phần lựa chọn Template hiển thị trang trong các trang quản lý từng Danh mục sản phẩm, Danh sách sản phẩm, Danh mục tin tức, Danh sách tin tức và các Trang hệ thống.

Phần THIẾT LẬP CHUNG: trong phần này có các trường như sau:

+ Trường Kiểu trang: kiểu quy định phần trình bày modul hệ thống {BODY} cho trang template.

Giá trị có thể nhận của nó có thể là Danh mục Sản phẩm, Danh mục tin tức, Danh mục Tin tức, Danh sách Sản phẩm tiêu đề các Trang Hệ thống.

Nó quy định giá trị có thể được lựa chọn ở trường chọn Trang áp dụng hiển thị trang trong các trang quản lý nội dung Sản phẩm, Tin tức và các Trang Hệ thống.

Do nó áp dụng cho từng kiểu trang cụ thể nên nó quy định danh sách danh sách Trường đại diện tùy chỉnh cấu hình phần THIẾT LẬP HIỂN THỊ TRANG để trình bày nội dung modul hệ thống {BODY} trong phần Thiết lập giao diện Template. Phần THIẾT LẬP HIỂN THỊ TRANGThiết lập giao diện Template sẽ được trình bày trong phần hướng dẫn sau của hướng dẫn này.

Trường này chỉ hiển thị khi Thêm mới Template để cho phép lựa chọn; khi sửa Template, trường này sẽ không hiển thị, nên bạn sẽ không thể chỉnh sửa được giá trị phần này.

+ Trường Template: lựa chọn template được sử dụng để trình bày nội dung trang. Giá trị của nó là danh sách tiêu đề phần Thiết lập giao diện Template đã được tạo ra trước đây. Để tạo mới template chọn giá trị “Không lựa chọn”.

+ Trường Thứ tự quy định trình tự ưu tiên lựa chọn trang template ưu tiên hiển thị cho các trang được tạo ra trong phần quản lý nội dung Sản phẩm, Tin tức và các trang hệ thống trong trường hợp các trang này chưa chọn được trang template áp dụng phù hợp.

Phần THIẾT LẬP SẢN PHẨM: lựa chọn các mục Sản phẩm trong trang quản lý giao diện Mục Sản phẩm – Tin tức để trình bày nội dung HTML của từng sản phẩm trong danh sách các sản phẩm được chọn ra. Trong đó:

+ Trường Danh mục sản phẩm phải được lựa chọn trong trường hợp áp dụng đồng thời:

  • Trường Kiểu trang trong phần THIẾT LẬP CHUNG nhận giá trị là một trong các giá trị sau: Danh mục sản phẩm, Tìm kiếm, Sản phẩm quan tâm hoặc Sản phẩm yêu thích.
  • Trường Trường hiển thị và trường Nội dung hiển thị trong phần THIẾT LẬP HIỂN THỊ TRANG có lựa chọn giá trị Trường Đại diện Tùy chỉnh {Danh sách Sản phẩm}.

+ Trường Sản phẩm liên quan phải được lựa chọn trong trường hợp áp dụng đồng thời:

  • Trường Kiểu trang trong phần THIẾT LẬP CHUNG nhận giá trị là một trong các giá trị sau: Danh mục sản phẩm, Danh sách Sản phẩm, Danh mục Tin tức, Danh sách Tin tức.
  • Trường Trường hiển thị và trường Nội dung hiển thị trong phần THIẾT LẬP HIỂN THỊ TRANG có lựa chọn giá trị Trường Đại diện Tùy chỉnh{Sản phẩm liên quan}.

+ Trường Sản phẩm cùng danh mục phải được lựa chọn trong trường hợp áp dụng đồng thời:

  • Trường Kiểu trang trong phần THIẾT LẬP CHUNG nhận giá trị là Danh sách Sản phẩm.
  • Trường Trường hiển thị và trường Nội dung hiển thị trong phần THIẾT LẬP HIỂN THỊ TRANG có lựa chọn giá trị Trường Đại diện Tùy chỉnh {Cùng danh mục}.

Phần THIẾT LẬP TIN TỨC: lựa chọn các mục Tin tức trong trang quản lý giao diện Mục Sản phẩm – Tin tức để trình bày nội dung HTML của từng tin tức trong danh sách các tin tức được chọn ra. Trong đó:

+ Trường Danh mục tin tức phải được lựa chọn trong trường hợp áp dụng đồng thời:

  • Trường Kiểu trang trong phần THIẾT LẬP CHUNG nhận giá trị là Danh mục Tin tức.
  • Trường Trường hiển thị và trường Nội dung hiển thị trong phần THIẾT LẬP HIỂN THỊ TRANG có lựa chọn giá trị Trường Đại diện Tùy chỉnh{Danh sách}.

+ Trường Tin tức liên quan phải được lựa chọn trong trường hợp áp dụng đồng thời:

  • Trường Kiểu trang trong phần THIẾT LẬP CHUNG nhận giá trị là một trong các giá trị sau: Danh mục sản phẩm, Danh sách Sản phẩm, Danh mục Tin tức, Danh sách Tin tức.
  • Trường Trường hiển thị và trường Nội dung hiển thị trong phần THIẾT LẬP HIỂN THỊ TRANG có lựa chọn giá trị Trường Đại diện Tùy chỉnh{Tin tức liên quan}.

+ Trường Tin tức cùng danh mục phải được lựa chọn trong trường hợp áp dụng đồng thời:

  • Trường Kiểu trang trong phần THIẾT LẬP CHUNG nhận giá trị là Danh sách Tin tức.
  • Trường Trường hiển thị và trường Nội dung hiển thị trong phần THIẾT LẬP HIỂN THỊ TRANG có lựa chọn giá trị Trường Đại diện Tùy chỉnh{Cùng danh mục}.

Phần THIẾT LẬP HIỂN THỊ TRANG dùng để trình bày phần nội dung modul hệ thống {BODY} của template phần THIẾT LẬP GIAO DIỆN TEMPLATE. Trước khi thiết lập cho phần này, bắt buộc bạn phải tiến hành các thiết lập đã được nêu ra bên trên để có thể lấy ra và sử dụng các Trường Đại diện Tùy chỉnh.

+ Trường Trường hiển thị là nơi lựa chọn các Trường Đại diện Tùy chỉnh tương ứng với từng Kiểu trang trong phần CÀI ĐẶT TIÊU ĐỀChi tiết Danh sách các trường Tùy chỉnh này bạn có thể tham khảo trong phần Hướng dẫn Quản lý Nội dung Danh mục Sản phẩm, Danh mục Tin tức, Danh sách Sản phẩm, Danh sách Tin tức, Trang Hệ thống.

+ Trường Nội dung Hiển thị là nơi viết Nội dung mã HTML cùng với giá trị Trường hiển thị (nêu ra bên trên) của trang, các trường thông số tùy chỉnh (cài đặt trong Quản lý nội dung Thông số Tùy chỉnh) của trang và các trường dữ liệu Tùy chỉnh (cài đặt trong Quản lý Nội dung Cấu hình Website)  cho modul hệ thống {BODY}.

3. Phần Thiết lập Giao diện Template:

Phần Thiết lập Giao diện Template cấu hình trình bày nội dung HTML cùng với danh sách các Modul và các trường dữ liệu Tùy chỉnh để từ đó các trang Quản lý Nội dung áp dụng để thiết lập nên giao diện đồ họa front-end.

Trường Tiêu đề để chỉ định tiêu đề của trang Template. Danh sách các tiêu đề trang Template sẽ được liệt kê trong trường Template của phần CÀI ĐẶT TIÊU ĐỀ (đã được trình bày ở mục 2 bên trên).

Trường Hiển thị để lựa chọn danh sách các Modul đã được tạo trong trang Quản lý Giao diện Modul để trình bày trong trường Nội dung hiển thị của phần Thiết lập Giao diện Template.

Trường Nội dung hiển thị để trình bày nội dung HTML cùng với danh sách các Modul (được lựa chọn trong trường Trường hiển thị bên trên) và các trường dữ liệu Tùy chỉnh (cài đặt trong Quản lý Nội dung Cấu hình Website) để từ đó các trang Quản lý Nội dung áp dụng để thiết lập nên giao diện đồ họa front-end. Trong Template có 3 modul hệ thống không được liệt kê trong Quản lý Giao diện Modul:

+ {HEADER} : trình bày những phần tử title, meta, và thư viện style.css (nội dung viết trong Quản lý Giao diện Thiết lập chung), thư viện jquery.js. Modul này được đặt sau thẻ head mở của template HTML.

+ {BODY} : trình bày phần thân của trang template HTML. Xem phần 2 trình bày ở trên.

+ {FOOTER} : trình bày nội dung tập tin Jquery sử dụng bởi hệ thống. Modul này được đặt trong trước thẻ body đóng của template HTML.

Sau khi xây dựng xong danh sách các Template, bước tiếp theo là tạo các trang trong Quản lý Nội dung Website (Sản phẩm -> Danh mục Sản phẩm, Sản phẩm -> Danh sách Sản phẩm, Tin tức -> Danh mục Tin tức, Tin tức -> Danh sách Tin tức, Trang hệ thống) lựa chọn áp dụng Trang Template đã tạo theo hướng dẫn này.