現在、私はBigcommerce Storefrontでテキストボックスに入力された動的テキストの画像を表示できるようにカスタマイズしています。つまり、商品イメージのプレビューは、書面による新しい画像と同時に表示されるはずです。テキストの変更によるBigcommerce製品イメージのカスタマイズ
最終的な製品がどのように見えるかを知って、同じイメージをショッピングカートに入れなければならないようにします。
私は、Shopifyに製品ビルダーという名前のアプリがあることを知っています。
これはBigcommerceで可能ですか？アドバンス
で
おかげこれは、いくつかのかなり高度なクライアント側のコードで間違いなく可能です。残念ながら、あなたが探しているものを達成するためのプラグアンドプレイシステムやビッグコマース用のアプリはわかりませんが、あなたの手を汚しても構わない場合は、プロダクトプレビューを更新するいくつかの方法があります。
ここにはexample from my siteがあります。 「このアイテムをパーソナライズする」の下にあるボタンをクリックすると、モーダルで説明したようなライブプレビュー画像が表示されます。テキストを入力してモノグラムのスタイルと色を変更すると、オプションを変更するたびにプレビューイメージがかなり迅速に更新されます。鉱山のようなソリューションは実現できないかもしれません。広範囲にカスタマイズされたステンシルテーマに基づいて構築された非常に複雑なReact/Redux実装を使用しているからです。つまり、完全にカスタムのアプリケーションを必要とせずに、同様のものを実装することができます。
上記の例のイメージプレビュー自体は、IMGIX.comによって提供されています。彼らは素晴らしい価格で素晴らしいサービスを提供しています。基本的に私のシステムは、ユーザーが選択したBigcommerceオプションをIMGIXのURLベースのAPIごとにURL文字列に変換します。ライブプレビューの表示は、入力の変更ごとにイメージのsrc属性を対応するIMGIX URLに変更するのと同じくらい簡単です。私はReduxストアを消費するReactコンポーネントでこれを行いますが、あなたが選んだフレームワーク、あるいは普通の古いバニラJavaScriptで同様のことを行うことは間違いありません。 CloudyはIMGIXと同様の機能を提供しますが、私はIMGIXが少し速くなっていることがわかりました。
HTML5キャンバスを使用してイメージにテキストとエフェクトをオーバーレイし、サードパーティのサービスを使用しないようにすることもできます。このような解決策がクライアント側のデバイスに課税されるより多くの作業と方法であることが判明しましたが、間違いなく、その諺の猫を肌に触れる別の方法になります。
そこには他の実行可能なソリューションがあるかもしれませんが、上記は私がBigcommerceで探しているものに似たものを実装した経験です。これが参考になることを願っています！