以下は、Josepha による WordPress.org 公式ブログの記事 “An Update on the Classic Editor Plugin” を訳したものです。
誤字脱字誤訳などありましたらフォーラムまでお知らせください。
文章: Alex Lende
WordPress 5.8より、デュオトーンフィルターを使って画像やカバーブロックに色付けできるようになりました。デュオトーンは、デザインにポップな色を加えたり、テーマとうまく調和するように画像をスタイリングすることができます。
フィルターとは、Instagram みたいなものですか ?
デュオトーンは、Instagram のフィルターとまったく同じようには機能しません。Instagram のフィルターは、色の調整 (色レベル/カーブ、ヴィネットなど) を行いますが、新しいデュオトーンフィルターは、画像の色を完全に置き換えます。
デュオトーン効果は、白黒のフィルターのようなものであり、シャドーが黒・ハイライトが白になっている代わりに、シャドウとハイライトの色を自分で選ぶことができます。
例えば、シャドー/ハイライトの色を黒と白にすればグレースケールフィルター、茶色と褐色にすればセピアフィルターになります。
類似色を選ぶと繊細な効果が演出でき、文字を目立たせたいカバーの背景にぴったりです。’
補色を使うと、より鮮やかで面白い効果が得られます。
デュオトーンフィルターを追加するには
デュオトーン効果はコントラストの高い画像で最も効果を発揮するため、大きな暗い部分と明るい部分がたくさんある画像から始めましょう。ブロックツールバーの「フィルター」ボタンからプリセットを選択します。
また、テーマのパレットから色を選ぶこともできますし、カスタムカラーを選ぶこともできます。
デュオトーンは、画像ブロックに加えて、カバーブロックでも画像と映像の両方に適用できます。
Duotone
デュオトーンはメディアライブラリの画像を上書きしてしますか ?
メディアライブラリの画像や動画が変更されることはありません。デュオトーン効果は、SVG フィルターと CSS のフィルター属性を使って動作するため、ライブラリ内の画像や動画が変更されることはありません。このことは、メディアライブラリに存在しないリンク先の画像にフィルターを適用できることを意味します。一方で、RSS フィードや画像の URL を直接使用する場所では、フィルターが表示されないことを意味します。
自分で開発したブロックやテーマにデュオトーンカラーを追加することはできますか ?
ブロックにデュオトーンカラーを追加する API は、Gutenberg v10.6では実験的なものです。とはいえ、独自のブロックで使用するためのドキュメントはブロックエディターハンドブックの「Supports Color (色対応)」に掲載されており、更新される予定です。テーマでは、theme.json でデュオトーンのプリセットを追加できます。詳細は「ブロックエディターハンドブック」の「グローバル設定とスタイルのプリセット」に記載されています。
Gutenberg プラグインを使って今すぐ試してみましょう
デュオトーン機能は、Gutenberg プラグインのバージョン10.6でリリースされたため、7月の WordPress 5.8 のリリースに先立って、今すぐお試しいただけます。