それぞれのカラーに存在する重量やサイズなどのテキスト情報のエリアが出し分けて出る
上記の「出し分け」という部分がどういう状態なのかわかりかねますが、メタフィールドに入れた情報を2箇所に分けて出力するのであれば、以下のような出力方法で記載場所を任意の複数箇所にすれば対応できるかと思います。
https://www.shopify.com/partners/blog/metafields
または「バリエーション選択時に表示を切り替える」ということであれば以下などが考えらると思います。
初期状態が2種類考えられ、それぞれに対して2種類の切り替え方法が考えられるという状態です。
■初期状態
- 最初から全て出力しておき、不要なものはCSSで隠した状態にしておく
- JSON形式などで情報をどこかに出力しておき、必要な情報だけJSで出力した状態にしておく
■バリエーション選択時
- JSを自作し、バリエーション選択のアクションをトリガーにして表示を切り替える
- テーマ内蔵のJSを利用して表示を切り替える
自作する場合、Googleなどで検索いただければ類似の動作をするサンプルコードが見つかると思いますので、そちらを参考にされるとよいかと思います。
テーマ内蔵のJSはコードを読めれば利用できる場合が多いと思います。
「どういう仕組みでバリエーション選択時に価格などを変更しているのか」というあたりを調べていただくと得るものが多いはずです。
■アプリ
https://apps.shopify.com/dynamic-variant-description?locale=ja
出し分けという部分が該当するのかわかりませんが、上記のようなアプリは見つかりました。
要件を満たさない場合はアプリストア内を探していただければと思います。
以上ですが、ご自身で対応が難しい場合はエキスパートやパートナーに依頼されることをお勧めします。
またはテーマのサポートに相談されるのも良いかと思います。