テーマ開発者としての役割として、Webパフォーマンスを考慮してテーマを構築することが標準であるという事実をつまずいたことがあるかもしれません。
また、WordPress の HTML 画像属性 srcset の機能を利用することも、画像を出力する際に wp_get_attachment_image() 機能を使用する理由のひとつです。 テーマ開発者としては、次のどちらかを指定するようにしたいものです。 (a) デフォルトの投稿サムネイル サイズのいずれか、または (b) 独自のカスタム投稿サムネイル サイズを作成する。
カスタム投稿サムネイル サイズを使用する必要がない場合もあります。 しかし、代わりに、あなたの要件に完全に対応するデフォルトの投稿サムネイル サイズを使用することができます。
使用できるデフォルトのサムネイル サイズは次のとおりです。
-
thumbnail(150px × 150px を使用) -
medium(300px × 300px を使用) -
medium_large(768px × 0px を使用) -
large(サイズ 1024px × 1024px を使用)
これらの場合、これらのデフォルトサムネイルサイズのいずれかに使用する同様のサイズがあれば、簡単に指定することができます。 the_post_thumbnail() 関数の $size パラメータで上記の文字列のいずれかを使用するだけです。
これらのデフォルトの投稿サムネイル サイズは、ほとんどすべて正方形に切り取られた画像であることに気づかれるでしょう。 これは、画像を出力できる最大スペースが正方形であるためと思われます。
When to Use a Custom Post Thumbnail Size
しかし、正方形ではない画像を出力する必要がある場合があります。 例えば、ブログの単一記事の上に、the_post_thumbnail()という関数を使って特集画像を追加しなければならない場合です。
以下のコードを使用すると、1024px × 768pxのサイズの記事のフィーチャー画像が出力されます：
add_image_size( 'single-feature', 1024, 768, true );
そしてこれがどういうことか、平たく言うと
- add_image_size() – カスタム投稿サムネイルサイズを作成
- ‘singlefeature’ – パラメータ
$name, カスタム投稿サムネイルサイズの名前だけ - 1024 – パラメータ
$width.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX, カスタム投稿サムネイルサイズの幅 - 768 – パラメータ
$height, カスタム投稿サムネイルサイズの高さ - true – パラメータ
$crop, (a) ハードクロップ、または (b) サムネイルサイズに画像を縮小するかどうかを意味する. 詳細は WP Dev docs
As additional info: 例から、指定された幅と高さは、特集画像に使用する一般的なサイズである (1024 × 768) が選択されています。 しかし、これは他のサイズを使用できないことを意味するものではありません。 7709>
How to Update Custom Post Thumbnails
As you will be tested out the new image sizes for your WordPress images you will notice that you may have trouble updating the width and height without changing the $name of the custom post thumbnail size.
たとえば、古いサイズがある場合を考えてみましょう。
add_image_size( 'single-feature', 1024, 768, true );
しかし、この「単一機能」サムネイル サイズを次のように更新する必要があります。 しかし、このサイズが表示されるはずのテンプレートを更新すると、幅1024のままその画像が表示されます。
これを改善するには、サムネイルを再生成する必要があります。
そこでまず、サムネイルの幅と高さを更新したことを確認し、プラグイン Regenerate Thumbnails をインストールします。 プラグインの指示に従って、あなたはその後正常にサムネイルsizes.
すべての画像を再生成しているあなたのウェブサイトはあなたのMedia Library.
どこにadd_image_size関数を配置する
あなたが適切にWordPress after_setup_themeアクションフックの中にそれを配置しないとadd_image_size()関数が動作しなくなりまっせ。 つまり、次のサンプル コード:
add_image_size( 'archive-featured', 792, 446, true );
Must be within the following action hook in your theme’s functions.php file under:
function ms_setup() {add_image_size( 'archive-featured', 792, 446, true );}add_action( 'after_setup_theme', 'ms_setup' );
アンダースコア テーマで add_image_size
A very popular starter theme called the Underscores Theme or _s theme has a good place to add your add_image_size() function has the good place.
カスタム投稿サムネイル サイズ関数 add_image_size() は、Underscores テーマの functions.php ファイル内の add_theme_support( 'post-thumbnails' ); 行の下に追加することができます。
この下に関数add_image_size()を追加できるのは、すでに先ほどのafter_setup_themeアクションフックの中に入っているからです。
Add Image Size Function Snippet for WordPress Themes
よろしければ、Underscoresテーマのadd_image_sizeの以下のスニペットをコピーして、今後の参考にしてください：
/* * Custom post thumbnail sizes for use across the theme. * * @link https://developer.wordpress.org/reference/functions/add_image_size/ */add_image_size( $name, $width, $height, $crop );
注意：お使いのテーマでPHP警告エラーが出ないように、スニペットで使用しているパラメータを必ず定義するようにお願いします。 上記のスニペットは、テーマの関数にコピー ペーストするためのテンプレートとして使用されます。
Conclusion
この記事をお読みいただきありがとうございました! 7709>
If you enjoyed this article you might like to know the Theme mistakes in setting up custom post types.
If you enjoyed this article, please let me know your thoughts and your setup on custom post thumbnail sizes. 一つは、カスタム投稿タイプをテーマに登録しないことです！
。
