Wix Studio エディタ：Lottie アニメーションファイルを追加・カスタマイズする
4分
LottieFiles は、クライアントサイトに高画質のアニメーションを追加するのに最適なソースです。JSON URL からアニメーションをインポートしたら、必要に応じてサイズを変更し、連続ループで再生するかどうかを決定できます。
始める前に：
アニメーションをインポートするには、LottieFiles アカウントが必要です。
LottieFiles からアニメーションをインポートする
Lottie アニメーションを必要な数だけ追加して、デザインを盛り上げましょう。LottieFiles でワークスペースにアニメーションを保存したら、JSON URL をコピーして Wix Studio エディタに直接貼り付けることができます。アニメーションは、すぐに新しいページ要素として追加されます。
または、新しい Lottie アニメーション要素を追加し、関連する URL を設定パネルに貼り付けることもできます。
重要：
Wix は、JSON 形式の Lottie URL のみサポートしています。
Lottie アニメーション要素を追加する方法：
- エディタ左側で「要素を追加」 をクリックします。
- 「メディア」をクリックします。
- 「Lottie」をクリックします。
- 「Lottie アニメーション」横の「サイトに追加」アイコン をクリックします。
- （別のブラウザタブで）LottyFiles アカウントから保存したアニメーションの JSON URL をコピーします。（英語）
- エディタにアニメーションの URL を貼り付けます：
- エディタで Lottie 要素をクリックします。
- 「設定」アイコン をクリックします。
- 「アニメーション URL」下に URL を貼り付けます。
- キーボードの Enter キーを押します。
をクリックします。
をクリックします。
をクリックします。次のステップ：
設定パネル上部の「動作をプレビュー」をクリックして、公開する前に表示を確認します。
ブレイクポイントを操作する場合：
Lottie アニメーションのサイズは、ブレイクポイントごとにカスタマイズできるので、どの画面でも理想的に表示されます。
Lottie アニメーションを変更する
別の Lottie アニメーションに切り替えたい場合は、要素の設定パネルで新しい URL を貼り付けることで簡単に変更できます。
アニメーションを変更する方法：
- Lottie アニメーション要素を選択します。
- 「設定」アイコン をクリックします。
- 「アニメーション URL」下に新しいアニメーションの URL を貼り付けます。
アニメーションがループ再生するように設定する
Lottie アニメーションの再生方法を 1回だけにするか、ループ再生にするかを選択できます。
アニメーションの再生方法を設定する方法：
- Lottie アニメーション要素を選択します。
- 「設定」アイコン をクリックします。
- 「ループ再生」トグルをクリックして、アニメーションのループ再生を有効または無効にします。
Lottie アニメーションに代替テキストを追加する
アニメーションに代替テキストを追加する方法：
- Lottie アニメーション要素を選択します。
- 「設定」アイコン をクリックします。
- 「アニメーションテキスト」までスクロールダウンします。
- 「アニメーションの代替テキストを入力してください」下にテキストの説明を入力します。
- キーボードの Enter キーを押します。
備考：
Wix サイトでは、JSON 形式の Lottie ファイルのみがサポートされています。技術的な理由から、JSON ファイルのすべてのファイルフィールドが含まれるとは限りません。そのため、Lottie アニメーションは Wix のライブサイトで見た目が少し異なる可能性があります（例：動きの範囲 / 量が制限される）。