Instagram Feeds 6.3では、フィードをどのようにレイアウトするか、また画像をどのようにトリミングして中央に配置するかを決定するCSSコードを変更しました。
このプラグインは、CSS Gridというものを使ってフィードをレイアウトするようになりました。これは、WordPressテーマとのコンフリクトを防ぐこと、新しいフィードテーマ機能で鮮明なレイアウトを作成しやすくすること、そしてコンテンツの端まで同じように鮮明なエッジで既存のフィードデザインのルック＆フィールを改善することです。
CSSグリッドによって何が変わるのか？
グリッドレイアウトは、より簡単にページ上の他のコンテンツと並ぶ鮮明なエッジをサポートします。以前は、フィードに何らかのスペースやパディングを追加すると、フィードがコンテンツ領域の端に届かなくなっていました。
さて、CSSグリッドを使うと、グリッドレイアウト時のフィードのコンテンツは次のようになります：
画像の変更点とは？
また、フィード内の画像を分割して中央に配置するためのコードも変更しました。Image Liquid "と呼ばれるJSライブラリを使用する代わりに、CSSルールのみを使用するように変更しました。
これにより、遅延ロードプラグインやテーマとの互換性が向上します。以前は、Image Liquidライブラリを使用して画像をトリミングしたり中央に配置したりするため、遅延読み込みプラグインがフィード内の画像を遅延読み込みできない原因となっていました。
既存のフィードは影響を受けるのか？
既存のフィードは、この変更の影響を受ける可能性があります。フィード内のアイテムのレイアウトをカスタマイズしていた場合、以前のように表示するために、ビジュアル上の変更を修正する必要があるかもしれません。すべてのカスタマイズをサポートすることはできませんが、サポートにご連絡いただければ、カスタマイズを復元できるかどうかを確認することができます。そうでない場合は、最初にカスタマイズを行った担当者にご相談ください。
また、移行に必要な設定もあります。バージョン6.2で使用されるCSSは、Instagramフィード設定ページの「詳細」タブにある設定を使って切り替えることができます。
この設定は将来的に利用できなくなる可能性があるため、インスタグラムフィードの今後数回のメジャーバージョンアップで、フィードのレイアウトに関する問題に取り組んでおくといいだろう。
