The
Add To Cart Popup拡張機能は、Easy Digital Downloadsにポップアップ機能を追加します。有効にすると、顧客が「カートに追加」ボタンをクリックした後、小さなモーダルポップアップが表示され、チェックアウトページに直接移動するか、買い物を続けるかのオプションが提供されます。これは、TwentyFifteenテーマのデフォルトのスタイリングを使用した例です。
ここにポップアップの設定方法を示します。
カート追加ポップアップの設定手順
- インストール後、インストールしたこの拡張機能の設定は、WordPress管理画面 → ダウンロード → 設定 → 拡張機能 → カート追加ポップアップ から見つけることができます。
- プラグインを有効にすると、ポップアップはデフォルトで無効になります。これは、サイトで有効にする前に設定を調整する機会を与えるためです。その後、ポップアップを有効にするチェックボックスをオンにすることで、ポップアップを有効にできます。
注意： 「すぐに購入」ボタン機能、または無料ダウンロード拡張機能を使用している場合、決済ゲートウェイのリダイレクトやサードパーティのポップアップに干渉しないように、ポップアップは自動的に無効になります。
カスタマイズ
全般的な外観
ポップアップをプレビュー： このボタンをクリックすると、設定ページにいる間にポップアップをトリガーして、保存する前に変更を確認できます。管理バーの「ポップアップをプレビュー」リンクを使用することもできます。これは、ポップアップをプレビューするために設定ページのトップに常にスクロールバックする必要がないように追加されました。
ショートコードを使用している場合、一部のスタイルがWordPress管理画面に読み込まれない可能性があるため、プレビューが完全に正確ではない場合があることに注意してください。ポップアップの外観を確認するために、完了したらサイトのフロントエンドでプレビューすることをお勧めします。
ポップアップテキスト： ここでポップアップに表示されるテキストを設定できます。プラグインがこのオプションのテキストのどこかで「%s」（引用符なし）を検出した場合、それはユーザーがカートに追加したダウンロードの名前に変更されます。また、ポップアップ内にメディアファイル（画像など）、埋め込み、ショートコードを追加することもできます。
ポップアップ複数テキスト： ポップアップテキストと同様に、このテキストは、複数のアイテムが同時にカートに追加されたときにポップアップに表示されます。これは通常、複数のオプションを同時に追加できるバリアブル価格オプションを使用している場合に発生します。ここでも、ポップアップ内にメディアファイル（画像など）、埋め込み、ショートコードを追加することもできます。
エディタのツールバーは、エディタの右端のボタンをクリックすることで拡張できることを忘れないでください！
フォントサイズ： これにより、ポップアップで使用されるフォントの全体的なサイズを変更できます。さまざまなCSS形式がここで受け入れられます。
- ピクセルサイズは絶対固定サイズです。例： 12px
- パーセンテージサイズは、テーマのデフォルトのフォントサイズに対する相対サイズです。例： 120%（テーマのフォントサイズより20%大きい）。
- 「em」値はパーセンテージに似ており、1emはデフォルトのフォントサイズです。例： 2em（デフォルトの2倍の大きさ）。
テキストカラー: ポップアップテキストの色。色を設定するには、カラーボックスをクリックしてカラーピッカーを表示します。
背景色: ポップアップの背景色。色を設定するには、カラーボックスをクリックしてカラーピッカーを表示します。
テキストの色を黄色、背景色を青色に設定した例を以下に示します。
境界線: このオプションを使用すると、ポップアップボックスの端に表示されるポップアップの境界線をスタイル設定できます。3つのオプションは、それぞれ幅（または太さ）、スタイル、および色です。
境界線の半径: 境界線の角の半径。この値が大きいほど、角は丸くなります。これは、境界線が表示されない（幅がゼロ、スタイルが「なし」、または色が透明）場合にも適用されます。
影: このオプションを使用すると、影の量（サイズと太さ）と影の色を設定して、ポップアップに影を追加できます。以下の例では、影の量が15の濃い緑色の影を追加しています。
オーバーレイカラー: オーバーレイとは、ポップアップが表示されたときにページの残りの部分を覆う色を指します。カラーピッカーを表示するにはカラーボックスをクリックして色を変更でき、これには透明度オプションも含まれています。以下の例では、オーバーレイを明るい半透明のオレンジ色に変更しています。
ポップアップの寸法
サイズ: ここでポップアップのサイズを制御できます。ピクセルやパーセンテージなど、さまざまなCSS形式が受け入れられます。
- ピクセルサイズは固定サイズです。例：500px（ユーザーの画面上の500ピクセル）
- パーセンテージサイズは、ユーザーのブラウザウィンドウのサイズに対する相対値です。例：60％（ユーザーの画面の60％）
幅または高さが空白の場合、ポップアップはコンテンツに合わせて自動的に計算されます。
次の例では、幅を500pxに設定し、高さを空白にして自動計算されるポップアップを示しています。
パディング: パディングとは、ポップアップの端とそのコンテンツの間のスペースを指し、次の画像のように示されます。
緑色の領域が「パディング」と呼ばれるものです。
ボタンのスタイル
ボタンの境界線: ポップアップに表示されるボタンの境界線。前の境界線オプションと同様です。それぞれ境界線の太さ、スタイル、色を設定できます。
角の半径: ボタンの角の半径。この値が大きいほど、角は丸くなります。これは、ボタンの境界線が表示されない（幅が0、スタイルが「なし」、または色が透明）場合にも適用されます。
例：幅5px、角の半径3pxの青色の「点線」の境界線：
ボタンのパディング: ポップアップのパディングオプションと同様に、ボタンの内側のスペースを調整できます。たとえば、次の例では、上下のパディングを6px、左右のパディングを30pxにしています。
ボタンの方向: ボタンを横並びにするか、縦に積み重ねるかを選択できます。デフォルト設定は横並びです。
ボタンの配置: 左、中央、右の配置を選択できます。左または右を選択するとボタンはその側の端に寄せられ、中央を選択するとボタンはポップアップの中央に配置されます。
ボタンの順序: このオプションでは、最初に表示されるボタンを選択できます。ボタンの方向が横並びに設定されている場合、このオプションは左側に表示されるボタンを決定します。ボタンの方向が縦積みに設定されている場合、このオプションは上部に表示されるボタンを決定します。
チェックアウト/続行ボタン
次の2つのセクションには、両方のボタンの個々の外観を微調整できる同様のオプションが含まれています。
有効: ボタンを表示するか非表示にするかを選択します。
テキスト: 各ボタンのテキストを好きなようにカスタマイズできます。
テキストの色: ボタン内のテキストの色。
マウスホバー時のテキストの色: マウスカーソルがボタン上にあるときの、ボタン内のテキストの色。
背景色: ボタンの背景色。
マウスホバー時の背景色: マウスカーソルがボタン上にあるときの、ボタンの背景色。
次の例では、マウスカーソルがボタン上にあるときに白から赤に変わる、黒いテキストの白いボタンを使用しています。
カラーピッカーの説明
