Wix Studio エディタ：テキストエフェクトを追加・カスタマイズする
5分
テキストエフェクトを使用して、魅力的なタイトルとステートメントでクライアントのサイトをデザインしましょう。これらの要素は、エフェクトを大胆にしたり、目立たなくしたり、任意にカスタマイズすることが可能です。あらかじめデザインされた豊富な種類のエフェクトから選択し、デザインをカスタマイズしてページの他の部分を補完します。
テキストエフェクトを追加する
「要素を追加」パネルで、さまざまな芸術的なテキストエフェクトを追加することができます。各エフェクトは独自のトーンを設定し、クライアントのサイトに個性を加えます。これらのエフェクトは始まりに過ぎません。サイトの他の部分に合わせて微調整し、カスタマイズすることができます。
テキストエフェクトを追加する方法：
- エディタ左側で「要素を追加」
をクリックします。 - 「テキスト」または「装飾」をクリックします。
- 「テキストエフェクト」をクリックします。
- 選択したテキストエフェクトをページにドラッグします。
- テキストを入力します：
- テキストエフェクト要素をクリックします。
- 「テキストを編集」をクリックします。
- テキストを入力します。
テキストエフェクトをデザインする
テキストエフェクトは、クライアントのニーズやビジョンに正確に一致するように、デザインを完全にカスタマイズすることができます。各エフェクトには固有のデザイン設定があり、要素設定パネルから調整できます。色、レイヤー、動きなどのオプションを活用して、エフェクトに存在感を与えます。
ブレイクポイントを操作する場合：
デザイン設定は最大のブレイクポイントからカスケードダウンされますが、必要に応じて下位のブレイクポイントでカスタマイズすることができます。
テキストエフェクトをデザインする方法：
- テキストエフェクト要素を選択します。
- エディタ右上の「要素設定パネルを開く」アイコン
をクリックします。
- 選択したテキストエフェクトに応じて、「デザイン」下で利用可能な設定をカスタマイズします：
- 色 / 塗りつぶし色：エフェクトを構成する色を選択します。エフェクトに応じて、単一の色や複数の色を選択したり、グラデーションを適用したりすることができます。
- レイヤー：視覚的なレイヤーを調整して、デザインに奥行きを与えます。希望のレイヤーの数とその色を設定し、角度と間隔を変更して、カスタマイズされた効果を得ることができます。
- ベベル：角度を調整して、ライトと影のドロップダウンを制御し、テキストの端に立体的に見えるようにします。
- ストライプ：ストライプのサイズ、角度、太さを調整します。
- 動き：トグルを有効にして、マウスオーバー時に表示されるアニメーション効果を追加します。スライダーを使用して、アニメーションの速度を調整します。
- マスク：マスクの位置とぼかしのレベルを変更して、テキストの表示またはぼかしを制御します。
- グロー：テキストを囲むグローを調整します。
- 枠線：テキストの輪郭となる枠線の色と太さを設定します。
- 影：影の色、角度、ぼかし、位置を変更します。
注意：エフェクトによっては、影の色は選択した塗りつぶし色と自動的に一致します。 - テキスト：フォント、サイズ、大文字と小文字などを変更します。テキストの書式設定オプションに関する詳細は以下のセクションをご覧ください。
ヒント：
アニメーションを追加して、テキストエフェクトをさらに動的にすることもできます。要素設定パネルで「アニメーションとエフェクト」タブ 
をクリックし、次のアニメーションを追加します：エントランス、ホバー、クリック、スクロール、ループ、またはマウスエフェクト。
をクリックし、次のアニメーションを追加します：エントランス、ホバー、クリック、スクロール、ループ、またはマウスエフェクト。テキストを書式設定する
フォント、間隔、配置、その他の書式設定設定を調整して、デザインがクライアントのサイトにシームレスに適合するようにします。
テキストの書式を調整する方法：
- テキストエフェクト要素を選択します。
- エディタ右上の「要素設定パネルを開く」アイコン をクリックします。
- 「デザイン」下の「テキスト」をクリックします。
- 利用可能な書式設定を調整します：
- テキスト要素をタイポグラフィスタイルに追加
- フォントと文字サイズを変更します：
- 横方向と縦方向の文字の間隔を調整
- テキストを太字または斜体にする
- テキストの配置を選択
- 大文字と小文字を変更（例：テキストをすべて小文字にする）
アクセシビリティに関するヒント：
このテキストエフェクト要素が装飾目的のみに使用され、スクリーンリーダーに重要な情報が含まれていない場合は、「このテキストは装飾目的のみで使用されます」横のチェックボックスを選択します。