web-dev-qa-db-ja.com

14の子テーマのデフォルトのヘッダー画像の大きさを変更するにはどうすればいいですか?

私は 20 に基づいて子テーマを作成していて、カスタムヘッダー画像の寸法を変更したいと思います。カスタムヘッダーページには、次のように記載されています。

画像の幅は少なくとも1260ピクセルにする必要があります。推奨幅は1260ピクセルです。推奨される高さは240ピクセルです。

これは/inc/custom-header.phpで設定されたデフォルトから来ているようです:

function twentyfourteen_custom_header_setup() {
    add_theme_support( 'custom-header', apply_filters( 'twentyfourteen_custom_header_args', array(
        'default-text-color'     => 'fff',
        'width'                  => 1260,
        'height'                 => 240,
        'flex-height'            => true,
        'wp-head-callback'       => 'twentyfourteen_header_style',
        'admin-head-callback'    => 'twentyfourteen_admin_header_style',
        'admin-preview-callback' => 'twentyfourteen_admin_header_image',
    ) ) );
}
add_action( 'after_setup_theme', 'twentyfourteen_custom_header_setup' );

このファイルはtwentyfourteen/functions.phpに含まれています。

require get_template_directory() . '/inc/custom-header.php';

この行はget_template_directory()ではなくget_stylesheet_directory()を使っているので、私のバージョンのcustom-header.phpで上書きすることはできません。

私の子供のテーマで要求された寸法を変えることができる方法はありますか?

2
Alex Angas

これは、14のテーマのカスタムヘッダー機能へのフィルタです。あなたはあなたの新しいサイズを加えるためにそれを使うことができます。これが私がデフォルトサイズを変更するために使うものです。

function wpse_custom_header_setup() {
    add_theme_support( 'custom-header', apply_filters( 'wpse_header_args', array(
        'width'                  => 1460,
        'height'                 => 220,
    ) ) );
}
add_action( 'after_setup_theme', 'wpse_custom_header_setup' );

_編集_

847行目から853行目にあるサイトヘッダーの最大幅も適宜設定してください。

.site-header {
    max-width: 1460px;
}
1
Pieter Goosen

このコードを子テーマの関数ファイルに追加して、幅と高さの値を変更するだけです。

テーマによっては、スタイルシートの値をさまざまなヘッダー要素に合わせて変更する必要があるかもしれませんが、私のテストによると、これは24個の子テーマを使用する場合は不要です。

add_theme_support( 'custom-header', array(
'header_image'    => '',
'header-selector' => '.site-title a',
'header-text'     => false,
'height'          => 90,
'width'           => 300,
) );

上記の方法はカスタムヘッダ機能のみに影響します この機能を使用して画像を追加する場合は外観>ヘッダの下でのみ有効です。これにより、これらの寸法にトリミングする必要があります。 。そのためには、あなたの#site-header画像に影響を与えるCSSコードを修正する必要があります。

theme_mod_header_imageフィルタを使うこともできます

注: /ヘッダーセレクタクラスはテーマごとに異なります。

2
Brad Dalton