header-logo
Wix の使用方法を学び、サイトとビジネスを構築する。
直感的な Wix 機能でサイトをデザインして管理する。
定期購入、プラン、請求を管理する。
ビジネスを運営し、サイト会員とつながる。
ドメインの購入、サイトへの接続と移管方法を学ぶ。
ビジネスとウェブプレゼンスを成長させるツールを入手する。
SEO とマーケティングツールで知名度を上げる。
より効率的な作業を支援する高度な機能を利用する。
解決策や既知の問題について確認し、問い合わせる。
placeholder-preview-image
コースとチュートリアルでスキルを習得する。
ウェブデザインやマーケティングなどのヒントを得る。
検索エンジンからのトラフィックを増やす方法について学ぶ。
フルスタックプラットフォームでカスタムサイトを構築する。
あなたの目標達成をサポートするエキスパートを見つけましょう。
placeholder-preview-image

Wix エディタ:テキストマスクを追加・カスタマイズする

4分
テキストマスクは、訪問者の注意を引く短いテキストに最適なツールです。テキストの中に画像や動画、グラデーションを表示して、ページ上でテキストを目立たせることができます。
ライブサイトのテキストマスク
この記事では、以下の項目について説明します:

テキストマスクを追加する

まずは、サイトにテキストマスクパーツを追加します。
役立つヒント:
モバイルで最高のサイトパフォーマンスを得るために、ページごとに追加するテキストマスクは最大 10個までにすることをおすすめします。

テキストマスクを追加する方法:

  1. エディタで該当するページを開きます。
  2. パーツを追加 をクリックします。
  3. テキスト」をクリックします。
  4. テキストマスク」をクリックします。
  5. 好きなテキストマスクデザインをページにドラッグします。
    ヒント:一部のデザインには背景動画が含まれています。デザインにマウスオーバーすると、実際の動作を確認できます。
エディタの「追加」パネルと、サイトにテキストマスクを追加するオプションが表示されたスクリーンショット。

テキストマスクのテキストを変更する

テキストマスクを追加したら、カスタマイズを開始できます。まずは、テキストを変更しましょう。

テキストを変更する方法:

  1. エディタでテキストマスクをクリックします。
  2. テキストを編集」をクリックします。
  3. テキストを入力」下にテキストを入力します。
    注意:テキストは自動的に保存されます。
クリックするオプションを示したスクリーンショット

テキストマスクのサイズを変更する

次に、テキストマスクパーツがページに完全に収まるようにサイズを変更します。

テキストマスクのサイズを変更する方法:

  1. エディタでパーツをクリックします。
  2. パーツの周りのハンドルをドラッグして、サイズを調整します。
パーツ周辺のハンドルの動きを示した GIF。ハンドルが移動して、サイズが変化していることを示しています。

テキストマスクをデザインする

最後に、デザインを変更して、テキストマスクにフレアを追加します。

テキストマスクをデザインする方法:

  1. エディタでテキストマスクをクリックします。
  2. デザイン」アイコン  をクリックします。
  3. テキストマスクのデザイン方法を選択します:
ライブサイトのテキストマスク
エディタの「追加」パネルと、サイトにテキストマスクを追加するオプションが表示されたスクリーンショット。
クリックするオプションを示したスクリーンショット
パーツ周辺のハンドルの動きを示した GIF。ハンドルが移動して、サイズが変化していることを示しています。