ドキュメント
- HOME
- 外部サービスとの連携
- カスタマイズリンク
カスタマイズリンク
Eコマースサービス等で注文時にデザインを確定するために必要なデザインIDを、自動的に元のウィンドウに返す仕組みとなります。
- リンクさせたいスケッチの「リンクコードを取得」より「カスタマイズ」を選択してコードをコピーします。
- コードはリンク元ページで動作させるために必要なJavascript・CSSのコードとHTMLの2つに分かれています。<head></head>等にJavascript・CSSコードを、コンテンツ部分にHTMLのコードを貼り付けてください。
* one-d.ioカスタマイズリンクのコードはjQueryを必須としており、予めリンクコード内でjQueryを呼び出す記述があります。別のjQeuryを既に呼び出している場合はjQueryを呼び出さなくても問題ありません。
該当コード: <script src="https://service.one-d.io/design-editor/js/jquery-***バージョン***.min.js"></script>
- デザインIDが返却される<input>タグのid及びname属性値を動作させたい仕様に変更してください。
該当コード: <input type="hidden" name="" id="design-id">
* Eコマースサービス等でFormタグ内にHTMLのコードを記述できない場合は、Javascriptをカスタマイズすることで、デザインIDの返却される<input>タグをご利用環境に合わせた箇所に変更することが可能です。
変更する場合は以下の該当スクリプトを直接ダウンロードして編集・ご利用ください。
該当スクリプト: https://service.one-d.io/design-editor/js/common-v1.js
該当スクリプト内コード:
window.addEventListener('message', function( ev ) { ~ デザインID返却inputタグ該当コード ~ });
- 完了です
デザイン作成者は、コンテンツ内に挿入されたHTMLのデザイン作成ボタンからデザインを作成し、完了後は「デザインID」がリンク元コンテンツの指定した箇所に自動で貼り付けされます。
※自動貼り付け対応不可のブラウザの場合、デザインIDをコピー&ペーストするよう案内が表示されます。対応不可のブラウザはデザイン作成画面推奨環境よりご確認ください。