Cách thêm phần tử có chiều rộng đầy đủ bên trong tiêu đề Genesis

Trong cuộc trò chuyện Genesis Slack, một người dùng đã hỏi:

Đã bao giờ có cuộc nói chuyện về việc tạo một móc Genesis giữa một lớp vùng chứa và lớp bọc bên trong vùng chứa đó chưa? Ví dụ: một dấu móc chỉ sau dấu mở đầu cho <header> nhưng trước dấu . Điều này sẽ dễ dàng cho phép một div có chiều rộng đầy đủ (ví dụ: thanh công cụ) phía trên tiêu đề trang web nằm trong đánh dấu tiêu đề.<div class="wrap">

Một trong những cách có thể thực hiện điều này là bằng cách xóa phần bọc khỏi tiêu đề, sau đó thêm nó trở lại sau phần tử có chiều rộng đầy đủ mong muốn của chúng ta (thanh công cụ, trong trường hợp này) để phần tử nằm bên trong tiêu đề nhưng ở trên phần bọc (nhà ở khu vực tiêu đề và khu vực tiện ích con).

Mã sẽ được thêm vào functions.php của chủ đề con :

// Remove default header opening markup function
remove_action( 'genesis_header', 'genesis_header_markup_open', 5 );

// Add back header opening markup function w/o the structural wrap
add_action( 'genesis_header', 'sk_header_markup_open', 5 );
function sk_header_markup_open() {

genesis_markup( array(
'html5' => '<header %s>',
'xhtml' => '<div id="header">',
'context' => 'site-header',
) );

// genesis_structural_wrap( 'header' );

}

// Add toolbar inside header
add_action( 'genesis_header', 'sk_toolbar', 7 );
function sk_toolbar() {

echo "toolbar code comes here";

// Maybe add opening .wrap div tag with header context.
genesis_structural_wrap( 'header' );

}