Trong bài viết trước Đông đã đề cập đến những Snippets chỉnh sửa – tùy biến Site Header trong Genesis Framework. Ở bài viết ấy, bạn Thắng đã có thắc mắc như sau:
Nếu mình muốn hiển thị logo trên cả chiều rộng của khung header thì cần phải làm những gì à bạn. giúp mình nhé
Trong bài viết này, Đông sẽ hướng dẫn các bạn thêm Header Image Logo hiển thị full cả chiều rộng của Header trong Genesis Theme nếu child theme ấy chưa hỗ trợ hoặc đã hỗ trợ nhưng bạn muốn thay đổi kích thước của Header Image Logo.
Cách thức – các bước thực hiện thêm Header Image Logo vào Genesis Theme như sau:
Bắt tay thực hiện thôi nào:
Bật Header sử dụng Logo
Đầu tiên bạn phải vào WordPress Dashboard ở phần Genesis > Theme Settings > Header settings bạn phải chọn là Image Logo thay vì Text nha.
Tùy biến – thay đổi class của Header Image
Do yêu cầu của bạn Thắng muốn hiển thị Full Width Header Image Logo luôn thế nên mình sẽ cho em Header Image Logo vào phần wrap của class Header.
Để thực hiện, bạn copy đoạn css bên dưới thêm vào tập tin style.css ở Genesis child theme mà bạn đang sử dụng:
https://gist.github.com/nhatdongnguyen/cc2f6381409a1a72a4cc
Để điều chỉnh chiều cao – height của Header Image Logo theo ý muốn, bạn có thể điều chỉnh giá trị min-height để phù hợp nha.
Thế là xong, hưởng thành quả của hướng dẫn bên trên nào 🙂
Chúc bạn thành công nha!
Nếu có thắc mắc hay ý kiến góp ý, bạn vui lòng comment hen!
Leave a Reply