使い方 ボタンとリンク、任意のタイプを追加できます リンク （1）セクションにボタン／テキストリンク／画像リンク／アイコン／セパレーターを追加できます。
また、ご購読はいつでも停止することが可能です 重複ファイル （2） 編集 （3）、または 削除 （4）既存のボタン／リンク。
ここで扱われる内容：
ボタン/リンクを追加する
- セクションに任意の種類のリンクを追加するには、 + 追加ボタン オプションを選択します。
その + 追加ボタン オプションでは、リンクを追加する方法が4つあります。これ以外にも、 セパレータ ボタン/リンク間にスペースを追加します。以下のオプションがあります。
ボタン
リスト項目にボタンを追加します。
以下を更新できます。
- ボタンラベル – 指定する 表示テキスト ボタンに。これがユーザーに表示されるもので、クリックすることになります。
- ボタンリンク – 指定する URLまたはアクション ボタンはクリックするとトリガーされる必要があります。
- ターゲット ウィンドウ – リンクを 同じタブ または 新しいタブ.
- ボタンスタイル – デフォルトにするボタン スタイルを選択します ( ボタンとリンク タブ)、ソリッド、アウトライン、またはテキスト リンク。
-
- デフォルト： サイトのテーマ設定に従います。
- 固体： 太字で塗りつぶされたボタン。
- 概要： 境界線のある透明な背景。
- テキストリンク: シンプルでクリーンなテキストのみのスタイル (ボタン ボックスなし)。
- ボタンの形 – 設定する 各ボタンのカスタムシェイプ セクション内で、グローバルボタンの形状を上書きできます。 デザイン設定により、各ボタンの表示をより細かく制御できます。選択できる形状は、四角形、丸型、丸型です。
- ボタンの色 – ボタンの配色をカスタマイズします。
-
- デフォルト： テーマ設定を継承します。
- 反転： ボタンのテキスト/背景色を反転します。
- カスタム： 特定のテキストと背景の色を選択できます。
- ボタンのテキスト –使用する場合 カスタムボタンの色、設定できます テキスト（ラベル）の色 ここから。
- ボタンの背景 – 「カスタム」でも利用可能な、ボタンの背景色を設定します。テキストの色と組み合わせることで、読みやすさとスタイルを最大限に高めることができます。
- ボタンアイコン – ボタンラベルの横にアイコンを追加します。様々なアイコンオプションから選択できます。
- レイアウト – ラベルに対するアイコンの配置を制御します。利用可能なレイアウトオプションは次のとおりです。
-
- ラベル + アイコン: 最初にテキストが表示され、その後にアイコンが表示されます。
- アイコン + ラベル: 最初にアイコンが表示され、次にテキストが表示されます。
- ラベル + アイコン (ワイド): テキストとアイコンはより多くのパディングで配置され、幅の広いボタンに適しています。
- アイコン + ラベル (ワイド): アイコンを優先し、パディングを広くしたレイアウト。
- アイコンの色 – ボタンアイコンの色を選択します。 ボタンのテキスト 色または ブランド 色。
ボタンスタイルの設定
これらの設定は、 スタイルタブ セクション。これらの設定により、Pixpaサイト上のボタンの外観、間隔、レイアウトを微調整して、デザインのコントロールと応答性を向上させることができます。
- ボタンのサイズ – ボタンのサイズ（例：小、中、大）を選択します。これにより、デザインに合わせてパディングとフォントサイズが調整されます。
- ボタン間のスペース – 複数のボタン間の水平方向の間隔を制御します。レスポンシブな間隔設定には、vw（ビューポート幅）単位を使用できます。
- ボタンの上のスペース – ボタンの上に垂直方向の間隔を追加します。これにより、ボタンと上のコンテンツとの間隔が広がります（%単位）。
- テキストリンク – ボタンのテキストリンクのフォント サイズを調整します (従来のボタンの代わりに「テキスト リンク」スタイルを使用する場合に特に便利です)。
- ボタンとしての画像（サイズ） – 従来のボタンの代わりに画像を使用している場合、この設定は画像の表示サイズ (ピクセル単位) を定義します。
- ボタンの幅 – ボタンの表示幅を選択します:
-
- デフォルト： ボタンの内容に基づいた標準幅
- ラージ / XL: 強調するための幅広のボタン
- 全幅: ボタンはコンテナの幅全体に広がります
テキストリンク
加える テキストリンク リスト項目に。
以下を更新できます。
- をセットする テキストラベル.
- 特定します テキストリンク.
- ターゲット ウィンドウ – ページを同じウィンドウで開くか、新しいウィンドウで開くかを選択します。
画像
画像を追加して、任意のページにリンクします。
- 画像をアップロードすると、このように表示されます。 リンクをクリックして編集します。
- ここから、次のことができます。
- アップロード/画像を変更します。
- ボタンリンク – リンクを指定します。
- ターゲット ウィンドウ – ページを同じウィンドウで開くか、新しいウィンドウで開くかを選択します。
サイトのタイトルは、検索性を高めるためにボタンの画像の代替テキストとして使用されます。
ソーシャルアイコン
- リスト アイテムにソーシャル アイコンを追加します。
以下を管理できます。
- リンクするソーシャル アイコン。
- 関連するソーシャル プロファイル パスを指定します。
- ターゲット ウィンドウ – ページを同じウィンドウで開くか、新しいウィンドウで開くかを選択します。
セパレータ
その セパレータ オプションを使用すると、ボタンまたはリンクの間にスペースを挿入できます。
これは、近接して配置されたボタンの間に視覚的な区切りを作成するのに役立ちます。 ボタンとリンク 他のボタンを追加するのと同じようにパネルに追加します。
- ボタン間のスペースは、 パディング – 上 セパレータ内の設定です。この値を調整すると、近接して配置されたボタン間の垂直間隔が増減します。
- セパレーターはどこにもリンクせず、単に垂直方向のスペースを作成します。
- 必要に応じて上下に移動して、アイテム間の間隔を調整できます。
ボタンとリンクのスタイルオプション
その スタイルオプション の下に存在します 形式 セクションの管理中にタブ。
ボタンとリンクには、次のように複数のスタイル オプションがあります。
ボタンとリンク
- 特定します ボタン/リンク間のスペース 追加されました。
- 特定します ボタン/リンクの上のスペース.
- 選択する ホバー効果 ボタン/リンク用。
- 選択する 通常ボタンのサイズ に追加した ボタン/リンク。
- 特定します 画像ボタンの高さ に画像リンクを追加した場合 ボタン/リンク。
- 特定します アイコンボタンのサイズ にソーシャルアイコンを追加した場合 ボタン/リンク。
ソーシャルアイコンを追加した場合 ボタン/リンク 上記の場合：
- 選択する ソーシャルアイコンの種類/形。
- 選択する ソーシャル アイコンの色スタイル。 を選択した場合 ブランドカラーの場合、アイコンのブランド カラーが継承されます。
を選択した場合 選択した色 上記のオプション：
-
- 特定します ソーシャル アイコンの色.
- 特定します ソーシャル アイコンの背景色.
例:
たとえば、Amazon ソーシャル リンクを ボタン/リンク, を指定し、 アイコンの色は赤 と アイコンの背景色を緑、 すると、以下のようにアイコンが表示されます。
