テキストブロックセクション

学べること

  • サブタイトルと本文テキストの追加と書式設定方法

  • 配置、フォントサイズ、色の制御方法

  • アニメーション効果の有効化方法

  • カスタムフォントのアップロードと適用方法


🧩 セクション概要

テキストブロックセクションは、ストーリーテリング、ミッションステートメント、ブランド説明に最適です。次の要素を追加できます: サブタイトル, メインテキストブロック、およびデスクトップとモバイルの両方でレイアウト、タイポグラフィ、間隔をカスタマイズできます。


セクションの追加方法

  1. Shopify テーマエディタ、クリック セクションを追加

  2. を選択 Text Block(テキストブロック)

  3. 必要に応じてレイアウト内で配置します


コンテンツとデータ

  • サブタイトル:小さなラベルまたは導入行(例:「ABOUT US」)

  • メインテキスト:主要な段落テキスト

  • 両フィールドはプレーンテキストのみをサポートします(HTMLやリッチフォーマットは不可)


レイアウトと表示

  • サブタイトルの配置:左寄せ、中央、右寄せから選択

  • テキストの配置:左寄せ、中央、右寄せから選択

💡 ヒント:短いミッションステートメントや引用には中央揃えがよく合います


タイポグラフィ設定

フォント

組み込みフォントから選ぶか、独自のフォントをアップロードできます。

  • サブタイトルフォント本文フォント:ドロップダウンから選択

  • カスタムフォントを有効にする:これをONに切り替えると独自フォントを使用できます

を使うには、 カスタムフォント、次の手順に従ってください:

🛠️ カスタムフォントの追加方法

  1. フォントファイルをアップロードします(通常は .woff2)を 設定 > ファイル (Shopify管理画面)に

  2. ファイルのURLをコピーします

  3. テキストブロックの設定で:

    • フォント名を貼り付けます (例:「MyCustomFont」)を カスタムサブタイトルフォント名 または カスタム本文フォント名

    • ファイルのURLを に貼り付けます カスタムサブタイトルフォントURL または カスタム本文フォントURL

保存すると、アップロードしたカスタムフォントでテキストが表示されます。


フォントサイズ

デスクトップとモバイルで別々にフォントサイズを調整します:

  • サブタイトルフォントサイズ (デスクトップ / モバイル)

  • 本文フォントサイズ (デスクトップ / モバイル)

  • トグル 太字のサブタイトル または 太字の本文 強調のために


  • 背景色:単色またはグラデーションの背景

  • サブタイトル色

  • 本文色

すべての色は16進コードまたはShopifyのカラーピッカーで設定します。


スタイリング

  • テキストアニメーション:次から選択:

    • アニメーションなし

    • タイプライター

    • フェードアップ

    • リビール(表示)

アニメーションはメインテキストのみに適用され、セクションが表示される際に発動します。


間隔

デスクトップとモバイル両方の上部および下部のパディングを制御します:

  • 上部の間隔(デスクトップ / モバイル)

  • 下部の間隔(デスクトップ / モバイル)

  • トグル セクションのパディングを削除 セクションを端から端まで詰めるために

💡 メディア量の多いブロックの間にこのセクションを重ねる場合は、間隔を増やすとよいです。


助けが必要ですか?

  • 💬 Discordでコミュニティに参加: https://discord.gg/hcc2GvgZc6

  • 📧 メール: [email protected]

  • 💻 ライブチャット: 月〜金、東部標準時間の午前10時〜午後6時に当社ウェブサイト上で対応可能です

最終更新