Optimizely Forms – 余分なデータを自動的に送信に追加する方法

Optimizely Forms についての一言

Optimizely Forms は、Optimizely 開発チームによる組み込みアドオンで、ブロックベースのアプローチで動的にフォームを作成できます。 開発者は、nuget パッケージをインストールすることで、Optimizely CMS または Customized Commerce サイトに Optimizely Forms をインストールできます。

これにより、コンテンツ編集者は、テキスト ボックス、テキスト領域、日付時刻、ファイル アップロード、画像などの利用可能なフォーム要素をフォーム コンテナ ブロックにドラッグ アンド ドロップすることで、通常のブロックとしてフォームを動的に作成できます。 そのため、編集者は、必要なコントロールを備えた任意のフォームを簡単にデザインし、ユーザー調査、ユーザー登録、ユーザー フィードバック、ユーザー サポートなどのさまざまなコンテキストで任意のページで再利用できます。

ユーザーがフォームを送信すると、データはデフォルトでデータベースに永続的に保存されます。 さらに、自動マーケティングの目的で、コネクタを介して提出データを第三者に送信することもできます。

ユーザーインターフェイスの編集でフォームを作成するイメージを示します。

フォームを作成してページにフォームを配置すると、ユーザーが以下のようなページを表示するとフォームが表示されます。

Optimizely Forms の仕組み

以下の画像は、Optimizely Forms の適用方法とその仕組みを示しています。

そのため、開発者として、新しいフォーム要素の作成、ポスト送信アクターの追加、カスタム コネクタの実装など、Optimizely Forms に関して多くのカスタマイズができることに気づきました。

最近、クライアントがすべての送信データにページ URL、ページ カテゴリなどの追加データを含めたいという要件を受けました。 これらの追加フィールドはデータベースに保存し、フォーム送信ビューやエクスポート ファイルにも表示する必要があります。

以下の画像は、送信データがバックエンド ユーザー インターフェイスに表示される方法を示しています。

青い枠のデータはユーザーによって入力されたデータであり、オレンジ色の枠のデータはシステム データであることがわかります。これらはユーザーによって入力されたデータではありません。 デフォルトのシステムデータと同じようにさらにデータを追加することはできますか? はい。 カスタマイズも可能です。共有したいサンプルコードは次のとおりです。

提出物に追加データを追加する方法

• まず、送信データに追加データを追加するための新しい投稿投稿アクターが必要です。 このアクターは、他のすべてのアクターの前に追加データが常に送信データに追加されるように順序を設定して最初に実行する必要があります。

public class MoreExtraInformationPostSubmissionActor : PostSubmissionActorBase, ISyncOrderedSubmissionActor
 {
     private readonly IUrlResolver _urlResolver;

     public MoreExtraInformationPostSubmissionActor(IUrlResolver urlResolver)
     {
         _urlResolver = urlResolver;
     }

     public int Order => 1;

     public override object Run(object input)
     {
         var hostedPageId = SubmissionData.Data["SYSTEMCOLUMN_HostedPage"] as string;

         if (!string.IsNullOrEmpty(hostedPageId))
         {
             var hostedPageUrl = _urlResolver.GetUrl(new ContentReference(hostedPageId));
             SubmissionData.Data.Add("PageUrl", hostedPageUrl);
         }
         return new SubmissionActorResult();
     }
 }

• 追加のデータをビューに表示してファイルをエクスポートするには、ここに追加する必要があるものがあります。

public class CustomFormRepository : FormRepository
{
    public override IEnumerable GetFriendlyNameInfos(FormIdentity formIden, params Type[] excludedElementBlockTypes)
    {
        var friendlyNameInfos = new List(base.GetFriendlyNameInfos(formIden, excludedElementBlockTypes));
        friendlyNameInfos.Add(new FriendlyNameInfo() { FormatType = FormatType.String, FriendlyName = "Page Url", ElementId = "PageUrl" });
        return friendlyNameInfos;
    }
}

• 最後に、Startup.cs の下のコードを追加して、デフォルトの FormRepository を新しい FormRepository でオーバーライドする必要があります。

  services.AddSingleton();
  services.AddSingleton();

上記のコード変更をすべて適用した結果

この記事で共有したいのはこれだけです。 誰かの役に立てば幸いです。 コーディングを楽しんでください!

2024 年 4 月 29 日