[Hướng dẫn]Thay đổi giao diện mặc định của Yii sang AdminLTE

Dành cho bạn nào chưa biết!

Mình định dựng CMS riêng để phục vụ nhu cầu hẹp. CMS của mình bao gồm 1 backend, 1 frontend. Trong bài viết này mình sẽ hướng dẫn các bạn thay đổi backend sẵn có của Yii-advance, 1 vài bài sau sẽ hướng dẫn dựng nguyên cái cms quản lý frontend (nội dung là chính) luôn.

Chuẩn bị

Trước hết các bạn download những thứ sau:

Sau đó các bạn giải nén yii vào thư mục www (thư mục root của apache).

Nếu xài UwAmp thì các bạn phải giải nén UwAmp trước, sau đó giải nén Yii vào thư mục www trong Uwamp => Tiếp đó khởi động UwAmp.exe

Các bạn lưu ý: Cần phải bật config php short_open_tag = On nếu sử dụng project của mình, vì mình quen gõ <? chứ không gõ đầy đủ <?php 😀

Giải nén xong đổi tên thư mục advance => <tên project của bạn>. Ở đây mình đổi là cms

  • Bước tiếp theo các bạn phải cài đặt Yii theo hướng dẫn ở đây: https://github.com/yiisoft/yii2-app-advanced/blob/master/docs/guide/start-installation.md
  • Sau đó các bạn truy cập vào project theo url http://localhost/<tên project của bạn>/backend/web để test xem Yii đã chạy thành công chưa, nếu hiện lên form login tức là ok rồi đó. Không ok thì pm riêng mình hoặc comment để mình xử lý giúp
  • Để đăng nhập admin, các bạn cần vào frontend để đăng ký tài khoản trước (http://localhost/cms/frontend/web/index.php?r=site%2Fsignup), sau đó vào lại backend để đăng nhập tài khoản đã đăng ký đó
  • Tới đoạn này mà các bạn đăng nhập thành công thì chúng ta sẽ bắt đầu bước vào sửa code, không thì các bạn liên hệ với mình để hướng dẫn

Bắt tay vào code

  • Giải nén AdminLTE vào thư mục www\cms\backend\web, cứ giữ nguyên cả tên phiên bản cũng được để sau này có gì update theme cho dễ :D, các tài nguyên thừa cũng kệ nó, có đáng bao nhiêu đâu
  • Các bạn phải disable hết các bundles của Boostrap đi, mở file backend/config/main-local.php, sửa biến config

  • Sửa file backend/assets/AppAsset.php với nội dung như bên dưới
  • Mở file backend/web/AdminLTE-2.4.2/pages/examples/blank.html, copy toàn bộ phần body paste vô phần body của file backend/views/layouts/main.php
  • Đưa biến $content vào phần <!–Main content–>
  • Về cơ bản là xong, bạn có thể download code của mình về tham khảo cho rõ hơn

Source code: https://mega.nz/#!TRAyDBIB!y_G32UU2SJyEz3SbkAvh5x7Igq4g19cC6DK7LNsDmAQ

 

Leave a Reply

Your email address will not be published.