Với những bạn sử dụng Genesis Framework thì Genesis Simple Hook Guide là một plugin bạn không nên bỏ qua, với Genesis Simple Hook Guide bạn có thể dễ dàng trong việc tùy chỉnh theme, từ việc tìm ra các vị trí hook đến việc xác định cấu trúc của một website Genesis Framework là việc vô cùng dễ dàng.

Bài viết này mình sẽ hướng dẫn bạn 2 cách để xác định các hook trên một cấu trúc blog, từ đó bạn có thể nhận biết các hook và thuộc tính CSS tương ứng…

Hướng dẫn sử dụng Genesis Simple Hook

 

Cách 1: Cài đặt và kích hoạt plugin Genesis Simple Hook Guide.

https://vi.wordpress.org/plugins/genesis-visual-hook-guide/

Vậy Genesis Simple Hook Guide là gì?
Genesis Simple Hook Guide là một plugin của Christopher Cochran, plugin này giúp bạn xác định những vị trí hook trong site của mình, và tùy biến nó theo ý thích.

Sau khi kích hoạt, bạn sẽ không thấy phần quản lý của plugin này trong trang admin mà chỉ nhìn thấy thêm mục Genesis Hook Guide trên thanh menu admin ở bên trên cùng ngoài trang chủ blog của bạn.

Để xác định các hook, bạn chỉ cần click vào Genesis Hook Guide như bên trên, chọn Action Hooks hoặc Filter Hook, khi đó trang web của bạn sẽ trở thành như thế này:

Trong hình trên, các khoanh màu là các hook còn các khoanh màu vàng là cấu trúc trang web của bạn.

Genesis Hook Guid > Markup

Hiển thị các lớp CSS trong file style.css. Muốn tùy chỉnh thuộc tính của các vùng này, bạn chỉ cần tìm lớp css tương ứng để thay đổi.

Nếu bạn không muốn cài đặt plugin và muốn giới thiệu các hook trong chủ đề Genesis Sample, bạn có thể làm như vậy trên trang demo của Genesis Simple Hook Guide.

Cách 2: Truy cập trực tiếp vào trang web Genesis Simple Hook Guide.

Bạn có thể cick vào từng khu vực để tìm những hook tương xứng…

Đấy là 2 cách để bạn xác định các hook trong cấu trúc genesis framework là thế nào từ đó sẽ giúp bạn xây dựng trang web của mình tốt hơn, hoặc bạn có thể tự tay thiết kế cho mình một theme ưng ý, Tôi hy vọng bạn sẽ thích bài viết này!

Hướng dẫn sử dụng Genesis Simple Hook
Đánh giá bài viết!

LEAVE A REPLY

Please enter your comment!
Please enter your name here