木材に網膜画像を含めるにはどうすればいいですか？

Question

Retinaディスプレイのために私のウェブサイト（木材で作られたもの）を実際に改善したいと思っていて、GitHubやDocsの過去の問題を閲覧しました。だから私はsrcsetを追加し、網膜フィルタ（これは廃止予定ですか？）を使用し、網膜のサイズ変更はかなりうまく機能しますが、標準のサイズ変更フィルタと実際には関係ありません。また、retina_resize関数/フィルタ（？）を提供するImageHelperクラスがありますが、どのように使用するのかよくわかりません。

これが今の私のコードです：木材における網膜対応のイメージのためのベストプラクティスについて

<img srcset="{{ TimberImage(image).src | resize(208) | retina(1) }} 1x, {{ TimberImage(image).src | retina(2) | resize(416) | retina(2) }} 2x">

任意のヒントを大歓迎している:)

感謝を！

Answer 1

ベスト・アプローチは、HTMLマークアップを生成するマクロを作成することです。私は、イメージIDを取得し、メディアの幅を確認し、網膜画像の適切なHTMLを出力するマクロを使用します。

私が作成したマクロは、hereで表示できます。

あなたは、適切なHTML

{% import '_macros/_img.twig' as m_img %} 
{{m_img.fixed(imageId, 50, {alt: 'post thumbnail', class: 'fixed'})}}