2024.4.15追記
ポチップv.1.13.2のバージョンアップで、画像を大きくする設定が追加されました。Post
この記事ではポチップの基本的な使い方について解説します。
ポチップは簡単かつ迅速に商品リンクを作成できるワードプレスプラグイン。
このようなリンクがあっという間に作れます。
ポチップ
Amazon・楽天市場・Yahoo!の商品リンクの他に、自由にカスタムリンクも追加OK！
直感的な操作が多くとても使いやすいので、物販アフィリエイトをしたい方はご覧くださいね。
特に ポチップのAmazonアソシエイトで商品検索する方法 は分かりにくいため、こちらの記事で先に確認しておくことをおすすめします。
- ブログ好きな40代主婦
- CocoonサイトをCSSでカスタマイズ
- JavaScriptを勉強中
- ドメインパワー35
- ワードプレスで複数サイトを運営しています
です
ポチップの使い方／商品リンクを設置する方法
ポチップは、基本的にブロックエディタ内で商品検索からリンク設置までをすべて同じ画面（投稿編集画面）でおこないます。この記事を書く画面でリンク作成できるのが時短になるポイントのひとつ。
商品リンクを作成するには以下の４パターンがあります。
どの方法を選択する場合でも、後述する「自動リンク切れチェック機能」を使うために、商品はポチップに登録しておくことをおすすめします。
①投稿編集画面で検索して商品リンクを作成する
まず、都度検索して商品リンクを作る方法です。
- Step1「ポチップ」ブロックを選択
投稿編集画面で段落の「+」をクリックし、ブロックメニューから「ポチップ」を選択します。
- Step2商品を検索する
「商品を検索する」ボタンをクリックすると画面が切り替わります。
- 検索したいショップのタブをクリック
- 商品キーワードを入力
- 検索（右側の虫めがねのアイコンをクリック）
- Step3表示したい商品を選択する
キーワードにヒットした商品がいくつか表示されるので、リンクを作りたい商品を選んで「この商品をクリック」をクリックします。
- Step4必要に応じて各ショップでも検索する
特定の商品をリンクに指定したい場合は、すべてのショップで商品検索をおこないます。
検索しないショップでは、商品キーワードの検索結果ページが表示されます。
特定の商品を指定せず、すべて検索結果ページにすることもできます。（リンク先をすべて検索結果ページにするに✓チェックを入れます）
「検索結果ページ」はキーワードを入れて検索したとき、ヒットした複数の商品が表示されるページだよ。
- Complete完成
商品リンクが設置されます。
「商品データをポチップ管理画面に登録する」ボタンをクリックすることで、この画面から商品を登録することもできます。（※自動リンク切れチェック機能を使うには登録が必要）
②先に登録し、商品を呼び出す
次に、先に登録した商品を呼び出す方法。（こちらがおススメ）
- Step1ポチップの管理画面で商品リンクを新規作成する
「新規投稿を追加（新規作成）」をクリックすると画面が表示されます。
- 検索したいショップのタブをクリック
- 商品キーワードを入力
- 検索（右側の虫めがねのアイコンをクリック）
- 「この商品を選択」ボタンをクリックします。
- Step2必要に応じて各ショップでも検索する
特定の商品をリンクに指定したい場合はすべてのショップで商品検索をおこないます。
検索しないショップでは、商品キーワードの検索結果ページが表示されます。
特定の商品を指定せず、すべて検索結果ページにすることもできます。（リンク先をすべて検索結果ページにするに✓チェックを入れます）
「検索結果ページ」はキーワードを入れて検索したとき、ヒットした複数の商品が表示されるページだよ。
- Step3選択した商品を登録
検索設定を終えたら画面右上の「公開」をクリックします。
公開した商品は「ポチップ管理」から商品を確認できます。
- Step4登録した商品を呼び出す
投稿編集画面でポチップブロックの「登録済み商品を検索」から商品を選択して呼び出します。
- Step5表示したい商品を選択する
登録済みの商品一覧が表示されるので、リンクを作りたい商品を選んで「この商品を選択」をクリックします。
- Complete完成
登録した商品のリンクが設置されます。
右側に表示されるサイドバーで、ある程度表示する内容をカスタマイズできるので必要に応じて設定しましょう。
- 全デバイスでリンクを縦並び表示にする
- 商品タイトルの上書き
- 各リンクの個別非表示設定
- カスタムボタンの非表示設定
- クリック率計測のON／OFF（計測できるのはPochipp Pro機能です）
③カスタムリンクを追加する
続いて、設置した商品リンクにさらにお好みでリンクボタンを追加する方法。
Amazon、楽天、Yahoo!の他に２つまでリンクを追加可能。
この機能があるだけでポチップを使う意味があると思います。
ポチップ管理画面で登録した商品を選択すると、下にカスタムボタンの設定項目があります。
ここでリンク先URL・表示するテキストを入力するだけ！
追加できるカスタムリンクは２個まで。十分ですね。
実に簡単で素晴らしい！
カスタムボタンに入力できるURLは「https～」から始まる一般のURLのみです。
<a>から始まるアフィリエイトリンクはカスタムボタンには使えません。ポチップリンクと並べることはできませんが、テキストリンクにするかアフィリエイトリンク対応のボタンを使いましょう。
- SWELL：SWELLボタン
- Cocoon：囲みボタン…等
④ショートコードを利用してリンクを作成する
また、ポチップはブロックエディタ専用なのですが、実はショートコードを使って商品リンクを呼び出すこともできるんです。
ブロックエディタが使えないウィジェット等でのポチップ表示が可能になります。
- Step1functions.phpにコードを追加する
ウィジェットでショートコードを使うためのコードを、テーマのための関数（functions.php）に一行追加します
add_filter( 'widget_text', 'do_shortcode' );テーマがCocoonの場合Cocoonの場合は『Cocoon Child』（子テーマ）
外観→テーマファイルエディター→テーマのための関数（functions.php）に追加。
これでショートコードが使える状態になりました。
- Step2ポチップの管理IDを確認する
- ポチップ管理→商品を登録
- 管理IDを確認する
ポチップ管理IDは「ポチップ管理」ページの一覧テーブル右側『ID欄』で確認できます。
- Step3ウィジェット（カスタムHTML）にショートコードを記述する
ここまで準備ができたらショートコードを記述します。
ショートコードの書き方[ pochipp id="1234567890" ]ショートコードは簡単[ pochipp id=”ここに数字を入れます” ]
- 完成
例）ウィジェット（カスタムHTML）で使用する場合
ウィジェットといったブロックエディタが使えないところでショートコードが活躍します。
必要があれば表示するカテゴリーを選択しましょう。（表示設定はCocoon機能）
ショートコードに商品IDを入れるだけなので、当サイトもウィジェットを使って記事下に商品リンクを表示させています。ありがたい！
表にもリンクボタン設置！ポチップではインラインボタンが使える
ポチップではインラインボタン機能があり、文章の途中やテーブルの中など、投稿編集画面の中で簡単にポチップの商品リンクボタンを設置できます。
実際にテーブル（表）の中にインラインボタンを配置するとこんな感じ。改行して２つのボタンを置いてみました。
| 商品画像 | 商品名 | おすすめ | リンク |
|---|---|---|---|
 | けっきょく、よはく。 余白を活かしたデザインレイアウトの本 | これがインラインボタン Amazon 楽天 |
インラインボタンの作り方
- 「ポチップ管理」にインラインボタンを表示したい商品を登録する（必ず登録する必要があります）
- 投稿編集画面のツールバー／ポチップアイコンから表示したい商品とボタンを選択する
基本的にこの２ステップだけで、必要に応じてテーブルを作成します。
インラインボタンのデザイン設定
インラインボタンのデザイン設定は管理画面のポチップ設定でできます。
ダッシュボード→「ポチップ設定」→「基本設定」→「インラインボタンのデザイン設定」
ここで設定できる項目は3点です。
- ボタンスタイル
- ボタンの丸み
- ボタン幅
変更すると上にプレビューが反映されるので、確認しながらお好みで設定しましょう。
「各ボタンの色」でインラインボタンの色を変更できます。
詳しい使い方はポチップ公式をご覧ください。
インラインボタンの色を個別設定するカスタマイズ
また、インラインボタンの色は何個設置しても同色（インラインボタンに設定した色）になります。
これをカスタマイズすることで個別に分けることができます。
例えば、Amazon、楽天、Yahooのインラインボタンを置いたとき、ポチップ設定で設定した個別のボタンカラーが反映されます。
ポチップカスマイズの記事で紹介していますのでご利用ください。
ポチップの自動リンク切れチェック機能を使うなら、商品登録が必須
どの方法でも商品リンクは作れるのですが、おすすめは②先に登録した商品を呼び出す方法。（検索した後に登録してもOKです）
理由は、自動リンク切れチェック機能が使えるから。
ポチップ管理に登録している場合のみリンク切れチェックがおこなわれます。（投稿画面のみ表示されている場合には使えません）
また他にも検索時の条件があります。
例えば、ポチップアシストを利用した検索だと自動リンク切れチェック機能は使えないので注意。
ポチップの管理画面では「チェックなし」とグレーで表示されます。
条件があっても自動リンク切れチェック機能は便利なのでぜひ利用したいところです。
リンク切れはポチップの管理画面で確認できますよ。
自動リンク切れチェックについてはポチップ公式ページをご覧ください。
ポチップでリンク切れが発生していないか自動でチェックする方法
ポチップでセール情報を表示する方法
ポチップではセール情報をボタンの上に表示する機能があります。
楽天とYahoo!の定期的なセール情報を自動で表示してくれる他、自分で文面の設定もできます。
| 定例セール | 手動設定 | 自動取得 | 複数セール設定 | |
|---|---|---|---|---|
| Pochipp （無料版） | ||||
| PochippPro （有料版） |
定期的なセールの自動表示方法
- 楽天：5と0のつく日キャンペーン
- Yahoo!ショッピング：5のつく日キャンペーン
- 「管理画面」→「ポチップ設定」→「セール」のタブを開きます
- 「定期的なキャンペーン」の項目にそれぞれチェックするだけ
セール情報の設定手順
- Step1「管理画面」→「ポチップ設定」→「セール」のタブを開く
（PochippProでセールの自動取得を有効化する場合はここでチェックします）
- Step2セール情報を入力
それぞれセール名、期間を入力します。
（この画面はPochippPro版のため表示が少し異なります）
セール情報はセールごとに自分で毎回入力するのはとても手間のかかる作業です。
PochippPro（有料版）ならすべて自動取得・自動表示！！
個人的に有料版最大のメリットなのでぜひご検討ください。
セール表示の漏れがなくなりますよ。
ポチップのスタイル、レイアウトをカスタマイズする方法
ポチップではボタンのスタイル、レイアウトを管理画面上で簡単にカスタマイズできます。
設定方法：「ポチップ設定」→「基本設定」
- ボックスのレイアウト、スタイル設定
- リンクボタンのスタイル、色変更
- 価格の表示・非表示設定
- 各ボタンの表示テキスト
- 商品リンク先を別タブで開くかどうか
公式 ポチップでカスタマイズできる6つの便利機能を紹介 で詳しい設定が確認できますのでご確認ください。
ボックスのデザイン設定 New
ポチップv.1.13.2のアップデート情報。Post
レイアウト（PC）に「画像ビッグ」が追加されました。商品画像を大きく表示できるので便利ですね！
オススメは以下の設定です。
| 設定項目 | 選択できる項目 |
|---|---|
| レイアウト（PC） | ●ビッグ（ボタンが横幅ぴったり並びます） |
| レイアウト（モバイル） | ●縦並び |
| 画像の配置 | ●左 |
| ボタンスタイル | ●標準 |
| ボタンの丸み | ●四角 |
| ボタン幅（PC） | ●自動フィット |
| ボタン幅（モバイル） | ●一列幅 |
| 商品の価格表示 | ●表示 |
設定を変更するとプレビュー画像で確認できるので、ここはお好みのデザインで問題ありません。
各ボタンの表示テキストと色
また各ボタンの表示テキストと色もここで設定できます。
「Amazon」→「Amazonでチェック」といった変更をしたり、ボタンの色をサイトの配色と合わせるといったことも簡単にできてしまいます。
その他、ポチップのカスタマイズについてをこちらにまとめています。リンクボタンの並べ方など、細かいこだわりがある方向け。
ポチップでメルカリアンバサダーのリンクを作成できるようになりました New
2023年11月、ポチップではメルカリアンバサダーのリンクを簡単に作成することができるようになりました。
手順は以下の2ステップ。
- メルカリアンバサダーに登録する
- メルカリアンバサダーのIDをポチップ設定に登録する
メルカリの非表示機能については、メルカリ設定画面からまとめて設定ができるようになっています！
メルカリの商品ごとのリンク非表示機能はこんな感じ。
— ひろ🐾ポチップ開発者 (@hiro_develop127) February 12, 2024
「ポチップ管理」から1つ1つ設定するのも大変だと思ったので、メルカリ設定画面からまとめて表示設定の変更を行えるようにしました😌
全商品にメルカリリンクが表示されるので設定するか迷っていた方は、ぜひご利用いただけると嬉しいです😉 pic.twitter.com/E13PKxfEaQ
詳しくはこちらをご覧ください。
まとめ／快適なポチップライフで売り上げアップを目指しましょう
以上が、ポチップの基本的な使い方です。
ポチップを使用することで、手軽に商品リンクを作成しアフィリエイト収益を上げることができます。ぜひ、このプラグインを利用して効果的なコンテンツ作成をしましょう。
プラグインのアップデートや新機能の追加がある場合は、公式サイトをご確認ください。
ポチップの設定、インストール方法はこちら。
また、売上アップの工夫満載 Pochipp Proについて、機能、インストール、設定方法をより詳しくこちらの記事で解説しているのでご覧ください。
- 商品リンク簡単作成
- セール表示
- らくらくデザイン
Comment