正気を失わずに SaaS CMS パッケージを検査する (Package Explorer アップデート)

Optimizely エクスポート パッケージは密かに複雑になってきています。 CMS 12 および PaaS ソリューションのインライン (ネストされた) ブロックは、必ずしも明確に表示されるわけではありませんでした。SaaS CMS (および間もなく CMS 13) では、Visual Builder にコンポジション、レイアウト階層、およびその上に表示テンプレートが導入されます。 Optimizely Package Explorer の今回の更新により、これらのシナリオ全体のサポートが改善され、パッケージの実際の内容を検査して理解することがはるかに簡単になります。

前回のリリースでは、大幅なユーザビリティの改善と構造検査の機能強化を導入しました。このアップデートはさらに深くなり、特に CMS 12、SaaS CMS、および次期 CMS 13 にわたる最新のエクスポート シナリオに焦点を当てています。

エクスポート パッケージは以前は比較的予測可能でした。

コンテンツタイプがありました。
あなたには財産がありました。
既知の方法でブロックが参照されていました。

その後、特に CMS 12 および PaaS ソリューションで、インライン (ネストされた) ブロックがより一般的になりました。これらは強力ですが、エクスポートされたパッケージ内で解釈するのが必ずしも簡単ではありませんでした。明確に構造化されたコンテンツの代わりに、構造が目に見えるものではなく暗示されている、長いシリアル化された値がよく見られます。

ここで、SaaS CMS、そして間もなく CMS 13 をこの問題に追加します。

Visual Builder では、コンテンツは単なるプロパティや参照ではなくなります。その：

• 組成物
• セクション、行、列
• 入れ子になった要素
• 構造化レイアウト内のインライン ブロック
• 要素の動作を定義する表示テンプレート

この柔軟性は編集者にとって素晴らしいものです。

しかし、エクスポート パッケージ内では、その柔軟性が、一見しただけでは必ずしも明らかではない、階層化された JSON 構造と埋め込み要素に変換されます。

デバッグ、エクスポートの検証、移行の準備、または単に実際に構築されたものを理解しようとしている場合は、推測ではなく明確さが必要です。

今回のアップデートではこれに焦点を当てています。

インラインブロック — 適切に表示されるようになりました

インライン (ネストされた) ブロックは、特に CMS 12 および PaaS ベースのソリューションでしばらく使用されてきました。これらは、エディターが次のようなプロパティ内にリッチで構造化されたコンテンツを直接構築できるため、強力です。 ContentArea。

問題？

エクスポート パッケージ内で、これらのインライン ブロックを検査するのは必ずしも簡単ではありませんでした。

明確に構造化されたネストされた項目の代わりに、実際の階層がマークアップまたは埋め込まれた JSON 内に隠されたシリアル化された値を確認することになることがよくありました。技術的には正しいですが、正確に読み取れるわけではありません。

このリリースでは、インライン ブロックの解析方法と表示方法が改善されています。

インラインブロックは次のようになりました。

• 適切なネストされた項目として抽出および表示される
• 明確な階層構造で表示される
• 拡張、検査、検証が容易になる
• 周囲の物件データから視覚的に分離

頭の中でリバース エンジニアリングすることなく、コンテンツ領域の実際の内容を確認できるようになりました。

構成とレイアウト — ビジュアルビルダーの構造を理解する

Optimizely SaaS、そして間もなく CMS 13 を使用して、Visual Builder はコンテンツに対してより構成的なアプローチを導入します。

単なるプロパティと参照ブロックの代わりに、次のもので構成される構造化レイアウトが作成できるようになりました。

• セクション
• 行
• コラム
• コンポーネント
• これらのコンポーネント内のネストされた要素

エクスポート パッケージでは、この構造は通常、レイアウト JSON として表されます。確かに強力ですが、必ずしもすぐに読めるわけではありません。

この更新により、パッケージ エクスプローラー内でこれらのレイアウト構造が解釈および表示される方法が改善されました。

未加工のレイアウト定義を確認する代わりに、次の操作を行うことができるようになりました。

• 全体的な構成構造
• 個々のセクションとその目的
• ネストされた行と列
• 各レイアウト領域内に配置されるコンポーネント

階層は暗黙的ではなく可視化されます。

個々の要素のドリルダウン

レイアウト構造を見るだけではありません。

また、コンポジション内の個々の要素にドリルダウンして、実際のデータ (タイトル、サブタイトル、背景設定、リンク、その他の要素のプロパティ) を検査することもできます。

これは、次の場合に特に役立ちます。

• 予期しないレイアウト動作のデバッグ
• エディターが構成した内容を検証する
• 移行の準備
• 別の環境でレイアウトを再構築する

コンポーネントがどのように構成されているかを推測する代わりに、要素データを直接検査できます。

新しく改良された表示テンプレート ビュー

Visual Builder は構造を定義するだけではありません。また、動作も定義します。

表示テンプレートは、要素がどのようにレンダリングされるか、どのようなバリエーションが存在するか、さまざまなコンテキストでコンポーネントがどのように動作するかを制御します。 SaaS CMS では、そして CMS 13 に向けては、これがソリューションを理解する上で重要な部分となります。

以前は、表示テンプレート データにアクセスできましたが、概要を把握するのは必ずしも簡単ではありませんでした。

このリリースでは、表示テンプレート用のより明確な専用ビューが導入されています。

生の定義を詳しく調べる代わりに、次のものを取得できるようになりました。

• 利用可能なテンプレートの構造化された概要
• 要素の設定とデフォルトを明確に可視化
• テンプレートとコンテンツ タイプの関係についての理解を深める
• 全体的により焦点を絞った検査エクスペリエンス

開発者とアーキテクトにとって、これは次の場合に重要になります。

• 要素の構成方法の検証
• レンダリングの不一致のデバッグ
• SaaS 実装の構造を理解する
• 移行の準備またはリファクタリング作業

これにより、最新の Optimizely セットアップでますます中心的な領域が可視化されます。

これが最終的に意味することは単純です。エクスポート パッケージは、頭の中で再構築する必要がなくなったということです。

インライン ブロックが明確にネストされ、コンポジションが階層的に構造化され、表示テンプレートがコンテキスト内で表示される場合、パッケージはソリューションの実際のアーキテクチャを反映し始めます。

ページがどのように構成されているかがわかります。
要素がどのように構成されているかを確認できます。
構造と動作がどのように関連しているかがわかります。

これは、期待どおりに動作しないレイアウトをデバッグするときに役立ちます。これは、移行前に SaaS エクスポートを検証する場合に役立ちます。また、これは、別のチームが構築したソリューションをレビューし、その背後にあるアーキテクチャ上の決定を理解しようとする場合に特に役立ちます。

最新の Optimizely セットアップは、これまで以上に柔軟です。それらを検査するために使用されるツールは、最新のものである必要があります。

このバージョンの Package Explorer は、その方向への一歩です。

試してみる

CMS 12、PaaS、SaaS CMS を使用している場合、または CMS 13 の準備をしている場合は、試してみてください。

👉 ライブデモをお試しください: https://codeartdk.github.io/CodeArt.Optimizely.PackageExplorer/

⭐ GitHub でプロジェクトにスターを付けます: https://github.com/CodeArtDK/CodeArt.Optimizely.PackageExplorer

📖 前回の更新を読む: https://www.codeart.dk/blog/2025/11/optimizely-package-explorer-now-with-extra-superpowers/

これはオープンソースであり、完全にブラウザー内で実行され、プラットフォームとともに進化し続けます。