Drupal Canvasページの非対称翻訳

Canvasページは、すべてのコンポーネントとそのコンテンツを含むデザイン全体を、エンティティ上の1つのフィールドに保持します。標準状態では、Canvasには翻訳の概念がありません。言語プレフィックスを有効にするとエディタが読み込まれず、ある言語での保存が別の言語を上書きし、プレフィックス付きのCSS URLは404になります。Canvas Multilingualはこれらのギャップを修正し、エディタに言語セレクタを追加します。

ここでの「非対称（asymmetric）」の意味

翻訳システムには2つの種類があります。対称型（Symmetric）翻訳は、すべての言語で同じ構造をミラーリングすることを強制します。同じブロックを同じ順序で並べ、異なるのは言葉だけです。非対称型（Asymmetric）翻訳では、各言語が完全に独立したレイアウトを持つことができます。異なるコンポーネント、異なる順序、ある言語にのみ存在し別の言語には存在しないセクションなどです。スペイン語ページを編集しても、英語ページには一切影響しません。

要件とインストール

Composerでインストール

このモジュールにはDrupal Canvas（^1.3）と、コアのLanguageおよびContent Translationモジュールが必要です。Composerで取り込み、Drushですべてを有効化します:

composer require 'drupal/canvas_multilingual:^1.0@beta'

drush en language content_translation canvas_multilingual -y
Module language has been installed.
Module content_translation has been installed.
Module canvas_multilingual has been installed.

drush cr
[success] Cache rebuild complete.

① 言語を追加する

サイトにスペイン語を追加する

2つ目の言語をConfiguration → Region and language → Languagesで追加します（または1つのDrushコマンドで）。英語がデフォルトのままで、スペイン語が翻訳対象になります。

drush language:add es -y
[success] Added language Spanish

② Canvasページの翻訳を有効にする

「Page」エンティティを翻訳可能にする

次の場所で Configuration → Region and language → Content language and translation、Page（Canvasページエンティティ）にチェックを入れて保存します。これにより、各Canvasページが言語ごとに個別のコンポーネントツリーを保持できるようになります。

③ Canvasエディタで編集する

エディタ内の言語スイッチャー

任意のCanvasページをエディタで開くと、モジュールが言語セレクタを上部ツールバーのPreviewの隣に追加します。現在の言語を表示し、別の言語へ移動できます。

結果: 2つの言語、2つの独立したレイアウト

以下は同じCanvasページを各言語でレンダリングしたものです。英語版とスペイン語版は、文字列を差し替えた共有テンプレートではありません。これらは1つのエンティティ上に存在する別々のコンポーネントツリーであり、互いに影響を与えることなく編集できます。スペイン語URLの/es/プレフィックスに注目してください。

英語 — デフォルト

https://site.local/page/1

Español — /es/

https://site.local/es/page/1

ページタイトルと各コンポーネントのテキストは、それぞれ独立して翻訳されます。コンポーネントツリー自体が翻訳可能なので、スペイン語にセクションを追加したり、1つ削除したり、並べ替えたりすることも同じように簡単にでき、英語のレイアウトはそのまま維持されます。

内部の仕組み

Canvas Multilingualは、現在のCanvasの動作に対する的を絞った回避策の集まりです。最も重要なものは次のとおりです:

• 自動保存の兄弟保護。Canvasの自動保存はエンティティをゼロから再構築することがあり、それにより他の翻訳が失われる可能性があります。entity presaveフックがこれを検出し、データベースおよび他言語の自動保存エントリから兄弟翻訳を復元します。そのため、ある言語での編集が別の言語を密かに削除することはありません。
• 言語対応のAPI解決。イベントサブスクライバが各CanvasのAPIリクエストをアクティブな言語の正しい翻訳へ解決し、新しい言語でエディタを開いた際の最初の（安全な）GETで翻訳を作成します。
• 翻訳スコープの削除。デフォルト以外の翻訳を削除すると、その言語のみ（およびその自動保存データ）が削除され、デフォルトと他の言語はそのまま残ります。デフォルト言語を削除すると、ページ全体が削除されます。
• アセット404の回避策。小さなfetchインターセプタが、core/、themes/およびmodules/のアセットURLから言語プレフィックスを取り除くため、プレフィックス付きページでCSS/JSが404になりません。

モジュールはこれらが暫定的な修正であることを明示しています。メンテナの目標はこれらをCanvasコアに統合することであり、その時点で回避策は不要になります。

知っておくとよいこと

• このモジュールはベータ版（1.0.0-beta1）です。すべてのオンザフライ翻訳作成は、監査可能性のためにログに記録されます。
• セットアップ後に言語セレクタが表示されない場合は、drush crを実行してください。
• Canvasはページエイリアスを手動で管理します（CanvasページではPathautoが無効）。各翻訳はそのタイトルから独自のエイリアスを取得します。

セットアップの概要