テキストスタイルの変更

テキスト スタイルをカスタマイズすることは、Shopify ストアを目立たせる最も簡単な方法の 1 つです。この記事では、GemPages でテキスト スタイルを変更する方法を段階的に説明します。

GemPages でテキスト スタイルを変更するにはどうすればいいですか?

ステップ1: テキストまたは見出し要素を選択する

GemPagesエディタで、 テキスト要素, どれでも テキストブロック, 見出しまたは 段落 あなたのページに。

これにより、 設定パネル 画面の左側にあります。

ステップ2: テキストスタイルオプションにアクセスする

設定パネルにはさまざまなカスタマイズオプションが表示されます。 文字スタイル セクションでテキスト スタイルを変更し、好みに合わせてカスタマイズします。

調整できる内容は次のとおりです:

1.スタイル

定義済みのスタイルから選択して、テキストに洗練された外観をすばやく適用します。

2.フォント

ブランド アイデンティティに合ったフォントを選択します。GemPages は Google Fonts と統合されているため、豊富なオプションから選択できます。

また、ワイルドカード*を使用すると、任意の文字にマッチし、XNUMXつのコマンドで複数のファイルを削除することができます。 フォントをアップロードする。 詳細については、を参照してください。 この記事.

3。 サイズ

デザインに合わせてテキストのサイズを簡単に変更できます。スライダーを使用して調整するか、特定の値を入力します。

すでにテキストサイズを変更している場合は、 ライブテキストエディタただし、後から左側のサイドバーの設定から直接サイズを調整することはできません。

この場合は、テキストのフォーマットをクリアしてから、設定パネルを使用してテキスト サイズを変更してください。

4 色

テキストの色を設定します。パレットから選択するか、ブランドに合わせてカスタムの 16 進コードを入力できます。

要素全体に適用するのではなく、特定のテキストの色を変更する場合は、次の手順に従います。

• テキストを強調表示する あなたは変わりたいです。
• ノーザンダイバー社の ライブテキストエディタ テキストの上に表示されるツールバーで、 テキストの色 オプションを選択します。
• パレットから色を選択するか、HEX コードを入力します。

この方法では、強調表示されたテキストのみが更新され、要素の残りの部分は元の色が維持されます。

5. フォントの太さ

ライト、標準、太字、極太字などのオプションを使用して、テキストの太さを制御します。

6. 行の高さ

読みやすさを向上させるために、テキストの行間の垂直間隔を調整します。

7. 文字間隔

文字間の間隔を微調整して、すっきりとした効果やドラマチックな効果を生み出します。

8.変換

テキストの大文字/小文字、または各単語を大文字に変更します。

9.シャドウ

カスタマイズ可能な影を使用して、テキストに深みと強調を追加します。

ページのレイアウトに合わせてテキストを左、中央、または右に揃えます。

11.幅

下 サイズ セクションで最大値を設定します 幅 テキスト ブロックの水平方向の広がりを制御します。

12.パディング

バランスの取れたデザインにするために、コンテナー内のテキストの周囲にスペースを追加します。

13。 背景

下 経歴 セクションで、ソリッド/グラデーションを適用する 色の背景 or 画像の背景 テキストを強調表示します。

具体的な例を挙げますと、以下の通りです。

• 色の背景:

• 画像の背景:

GemPagesでテキストグラデーションを作成する方法

GemPagesには現在、テキストグラデーションの組み込みオプションはありません。ただし、カスタムCSSを使用することで、グラデーションテキスト効果を簡単に作成できます。

ステップ1: グラデーションCSSを生成する

に行く CSSポータル – テキストグラデーションジェネレーター: https://www.cssportal.com/css-text-gradient-generator/

グラデーションの色、方向、スタイルを設定します。 生成されたCSSコードをコピーする.

ステップ2: テキスト要素を選択する

GemPagesエディタで、グラデーションを適用したいテキストまたは見出し要素を右クリックします => カスタムコード

ステップ3: CSSコードを追加する

そこにコピーしたグラデーションコードを貼り付けます。

ステップ4: 保存してプレビューする

変更を保存し、ページをプレビューして適用されたグラデーション テキストを確認します。