Bài thực hành 1.3: Thay đổi một chút giao diện cho Frontend

Bài thực hành này hướng dẫn một số thao tác cơ bản với giao diện như thay đổi giao diện hoặc chỉnh sửa một số thành phần giao diện trên website.

Ngoài chức năng hoạt động của web, thì giao diện là thứ được hầu hết mọi người làm web quan tâm. Thực tế thì trong công việc thiết kế web, phần giao diện chiếm một lượng lớn công việc trong dự án. Như vậy có thể thấy giao diện rất quan trọng. 

Joomla nổi tiếng vì khả năng hỗ trợ làm giao diện rất dữ dội, giúp cho những nhà thiết kế web dễ dàng và thuận lợi trong việc thiết kế. Nhưng có điều hơi ngược đời tí là, giao diện ban đầu có sẵn của joomla thì xấu hoắc, xấu ve kêu. Nhưng không sao, chúng ta sẽ từ từ có được những giao diện cực pro sau. Trước hết, bạn sẽ tìm hiểu một số thao tác thật cơ bản với giao diện joomla.

Truy cập quản lý giao diện

Menu Top >> Extensions > Templates

Template: tạm dịch là giao diện

 

 Click vào con mắt để xem trước

Mỗi template (giao diện) ngoài các style màu sắc, layout, còn có các layout với các Position - móc neo được bố trí trong các layout đó. Các template (giao diện) thường luôn có sẵn các Position - móc neo. Vì vậy khi xem template (giao diện) thì bạn cũng cần xem luôn các Position có trong giao diện đó.

Khi bấm vào con mắt trong danh sách, joomla cho phép bạn xem trước template (giao diện) cùng với các Position có trên template đó.

Click vào tên template để điều chỉnh

Mỗi giao diện cung cấp các chức năng hỗ trợ điều chỉnh lại giao diện như điều chỉnh màu sắc trang, thêm logo, điều chỉnh tên website, màu nền... Khi click vào tên template, bạn sẽ thấy các thông số để điều chỉnh cho giao diện.

Click vào dấu sao 

Trên danh sách template, bạn muốn sử dụng giao diện nào thì bấm vào dấu sao tương ứng để kích hoạt sử dụng template (giao diện) đó. Template đang được kích hoạt sử dụng sẽ có màu vàng.

 Xem Video hướng dẫn các thao tác với template

Video truy cập đến trang quản lý template

Video thay đổi các thành phần có trên template

 

Tác giả nội dung:

Nguyễn Tiến Dũng - XiroWeb