Share Code Web - Chia sẻ niềm đam mê bất tận > Lập trình > Web Design > Wordpress Tips > Hướng dẫn chỉnh sửa WordPress Admin : Trang login
Hướng dẫn chỉnh sửa WordPress Admin : Trang login
Nguyễn Trung Hiếu
Share Code Web Company 2013

Hướng dẫn chỉnh sửa WordPress Admin : Trang login

Ngày hôm nay, sharecodeweb sẽ mang đến cho các bạn loạt bài về cách customize trang admin của wordpress. Hy vọng nó cũng sẽ giúp bạn nắm được một vài kiến thức để tham gia thiết kế theme cho wordpress nhé. Bài ngày hôm nay chúng ta sẽ cùng tìm hiểu về cách customize trang login.

Xem trước demo

Các bạn xem trước demo sau khi chúng ta hoàn thành bài học để giúp bạn có cái nhìn hình dung sau cả quá trình học.
customize the wordpress admin login screen
Trong bài ngày hôm nay, sharecodeweb sẽ hướng dẫn bạn cách thay đổi logo của wordpress thành logo của bạn, và style một số link, button sao cho hợp ý bạn nhất thông qua cách tạo riêng một plugin giúp chúng ta làm việc này.

Nguyên liệu cần cho bài học

Cũng giống như nấu ăn, chúng ta cần có “nguyên liệu” như sau:

  • Bộ cài wordpress
  • Có quyền truy cập vào folder của site cũng như quyền thêm một số plugin
  • Có text editor để tạo plugin

Cài đặt một plugin mới

Chúng ta thêm đoạn sau vào phần đầu tiên của file plugin. Đây là những thông tin khai báo cho wordpress biết là file này là file plugin. Cũng như thông tin khai báo khi bạn thiết kế theme cho wordpress vậy.

  • Đầu tiên, tạo folder plugin tên media bên trong folder plugin của bạn, và upload logo lên đó.
  • Trong file plugin (hoặc file function) chúng ta thêm hàm login_enqueue_scripts vào hook

Theo đoạn code trên, bạn có thể thêm các thuộc tính để quy định kích thước, vị trí của logo như height, width, cũng như margin hay padding vào bên trong thẻ style như sau:

Style button and Links

Tương tự như vậy, bạn có thể vận dụng khả năng css của mình để style trong hàm trên là ok. Như mẫu bên dưới minh style như sau:

OK, lúc này bạn thử vào trang login và refresh lại xem sự thay đổi ra sao nhé.

Download Code

Việc style trang login mà không cần động vào core của wordpress giúp chúng ta gặp ít lỗi hơn, linh động hơn, và đối với một số người không chuyên về code của wordpress thì sẽ dễ dàng tiếp cận hơn rất nhiều.
Các bạn có thể download code bên dưới về tham khảo nếu như học theo bài không thành công.

Related Posts

Tác giả: Nguyễn Trung Hiếu

Một blogger ... cùi bắp! Đơn giản: tôi muốn ghi lại những gì xảy ra xung quanh, cả công việc lẫn cuộc sống và chia sẻ với các bạn đọc. Nếu bạn cảm thấy bài viết có nhiều điểm không chính xác, hãy comment và chia sẻ để tôi còn được học hỏi từ những góp ý của bạn. Email: hieunt.dcn@gmail.com

http://sharecodeweb.net/?s={search_term_string}