[Lập trình theme WordPress] Viết CSS cho theme – Phần cuối

[Lập trình theme WordPress] Viết CSS cho theme – Phần cuối

Bước cuối cùng trong việc viết CSS cho theme để nó hiển thị tốt, bước này chúng ta sẽ tiến hành viết CSS cho thành phần sidebar và widget. Mời các bạn xem tại đây!

Phần này chúng ta sẽ cùng nhau thêm một số đoạn CSS để cho việc hiển thị các widget trên sidebar được thân thiện hơn, hầu hết các widget đều có các cấu trúc HTML giống nhau và mang một class chung tên là .widget nên chúng ta sẽ tiến hành viết CSS cho class này để nó được áp dụng trên toàn bộ các widget.

Trước tiên, chúng ta nên reset lại các style có sẵn trên sidebar bằng đoạn sau:

Tiếp đến là thêm CSS cho class .widget :

Thế nhưng widget tên Calendar có thể sẽ nhìn hơi xấu một chút do ta chưa viết CSS cho thẻ table, do vậy chúng ta nên thêm một chút CSS cho thẻ table của widget Calendar để nó hiển thị tốt hơn:

và đây là kết quả:

laptrinhtheme-finish-widgetcss
Ảnh. Hiển thị hình ảnh viết CSS cho theme phần cuối

Lời kết

Như vậy là kết thúc bài này, cũng là lúc chúng ta đã kết thúc việc viết CSS cho theme này vì qua vài bài thì chúng ta cũng đã viết CSS xong một số thành phần quan trọng trong một theme WordPress rồi. Tiếp tục ở bài sau, mình sẽ hướng dẫn các bạn làm một công việc mới đó là cách tạo file ngôn ngữ cho theme mà chúng ta đã làm từ đầu serie tới giờ. Dưới đây là file đính kèm mã nguồn theme mà chúng ta đã làm để bạn có thể tham khảo:

Các bài viết liên quan:

WordPress FAQ  » Học WordPress > Lập trình WordPress > Lập trình Themes


 WordPress FAQ   |   Hoc WordPress   |   Su dung WordPress   |   Lap trinh WordPress |   Plugin WordPress  |  Thuat ngu WordPress    |  Theme WordPress  |  Lap trinh Themes |  Lap trinh plugin

Ảnh. [Lập trình theme WordPress] Viết CSS cho theme – Phần cuối
Ảnh. [Lập trình theme WordPress] Viết CSS cho theme – Phần cuối

Chia sẻ bài viết

Bình luận