Amazonアソシエイトのキャンペーン期間のみ表示する囲み型ショートコード作成(PostSnippets使用)

スポンサーリンク

 

広告・例の様なAmazonアソシエイトのキャンペーン専用バナー広告コードを今回作成した囲み型ショートコードの間に配置しておき、ショートコードにキャンペーン期間を設定しておくと、キャンペーン期間が終了したらWebページのキャンペーン専用バナー広告を自動で消す方法の紹介です。

何時もの様に、簡単に囲み型ショートコードが作成できるPost Snippetsプラグインを使用します。

合わせてショートコード作成のし易さを見るために、参考までに、Post Snippets プラグインを使わずに、手動で囲み型ショートコードも作成してみました。

注意!!

Post Snippets Plugin はバージョン4.0からメジャーアップデートされ大幅に仕様が変更になり管理画面も変更になりました。 未だ不安定の部分があり、今までのショートコードとの互換がとれない等の問題が発生します!! ご注意ください。 

この記事は、旧バージョンのpost-snippets.3.1.6 を使用しています。

 

完成した囲み型ショートコードの説明

まず、完成した「囲み型ショートコード」を説明します。

 shortcode
  ↓ 開始ショートコードタグ                                        ↓ 終了ショートコードタグ
[Amazon_campaign start_day="20221231" end_day="20230108" ] iframeから始まるアマゾンHTMLコード[/Amazon_campaign]

囲み型ショートコードは、[開始ショートコードタグ]と[終了ショートコードタグ]で構成されます。 

ショートコードの名前 [Amazon_campaign]としました。 先頭のショートコードにある start_dayend_day が変数で、の後に表示を開始する日付、終了する日付を記述します。 この例では、2022年12月31日〜2023年1月8日の期間で専用バナー広告 が表示されます。

ショートコードでサンドイッチされている「iframeから始まるアマゾンHTMLコード」は、Amazonアソシエイトの個人ユーザ画面から 商品リンク > バナーリンク > カテゴリーごとのバナーから 選択し「好みのバナー」HTMLコードをコピペします。

注意:
ビジュアルモードでHTMLコードを貼付けると文字化けしますので、テキストモードで貼付けてください。

まとめ
アマゾン専用バナー広告のHTMLコードをテキストモードで記述して、囲み型ショートコードでサンドイッチしてサイトにアップロードします。 Webページで確認すると、現在日付が「2022年12月31日〜2023年1月8日」の期間内にあれば、専用バナー広告が表示され、それ以外は表示されません。 

 

囲み型ショートコードの作成

Post Snippets プラグインを開き、「Add New Snippet」ボタンを押すと、下の管理画面が開きますので、管理画面の記入箇所を説明します。 なお、この画面は旧バージョンのpost-snippets.3.1.6 です。

項目番号 項目 設定内容
タイトル名 Amazon_campaign
snippet ここにPHPコードを記述(次節を参照
Variables
(変数)
start_day=20221201,end_day=20221231
(備考: =以降がデフォルになる)
Shortcode レ点
PHP Code レ点
Description

Amazon_campaignの期間だけ表示する、囲み型ショートコード。 開始と終了日付を夫々、年月日で記述(ex.20221230)

以上を記述したら、「SAVE」ボタンを押して、囲みショートコードの完成です。 ビジュアル又はテキストエディタのPostSnippetsボタンから選択できます。 但し、囲み型ショートコードの 終了ショートコードタグ[/Amazon_campaign] は手入力で追記する必要があります。

記述例
[Amazon_campaign start_day=20221201,end_day=20221231] HTMLコード  [/Amazon_campaign]

 

snippet箇所に記述するPHPコードについて

参考にさせて頂いたWebページ
「日付を過ぎたら自動で非表示・表示を指定できるPHP関数」

設定期間中は専用バナー広告を表示。 期間が過ぎたら専用バナー広告を除外させるPHPコード

PHPコードの説明
  • 1行目:date関数で現在の日付を取得して$selectdate に代入
  • 3行目:if文で現在日付($selectdate)が start_day(開始日)とend_day(終了日)の期間に有るか否かを判定
  • 5行目:現在日付が期間内にある時、{content} の内容が表示される。 {content}記述することで、囲み型ショートコードが実現します。
ポイント
専用バナー広告が非表示の時、Javascriptと違って専用バナー広告を隠して非表示していないことに注意してください。

設定期間が過ぎたら代替えコンテンツを表示させるPHPコード

 

 参考)手動で囲み型ショートコードを作ってみる

オペレータ
参考までに、Post Snippets プラグインを使わずに手動でショートコードを作ってみました。 このショートコードをfunction.php 内にコピペすればOKです。 ショートコード名は「Amazon_campaign1」です。
下のコードから分かるように、Post Snippets と比較して手動での作成はちょっと面倒ですね!

 

【Amazon_campaign】囲み型ショートコードを使う

ここでは、アマゾン専用バナー広告のHTMLコードの替わりに、Affinger6のパーツ「まるもじ(大)」を使ってみました。 下の例では、表示を維持させるために終了期間(end_day)を2100年にしてます。

設定期間中

 Amazon_campaign shortcode
[Amazon_campaign start_day="2023-01-01" end_day="2100-01-15"]
[st-marumozi-big webicon="" bgcolor="#F48FB1" bordercolor="" color="#fff" radius="10" margin="0 10px 0px 0" myclass=""]あけましておめでとうございます。[/st-marumozi-big]
[/Amazon_campaign]

あけましておめでとうございます。

Affinger6の タグ > テキストパーツ > まるもじ(大)ーピンク を選択 し「あけましておめでとうございます。」と記述しています。 このまるもじ(大)が[Amazon_campaign]囲み型ショートコードで囲まれているので、正月期間に合うようにstart_dayとend_dayを設定すれば設定期間中は、PHPサーバーで まるもじ(大)ーピンクを出力しブラウザで表示され、期間終了で 出力するコンテンツが無くなるので、ブラウザで非表示になります。

 

以上、Amazonアソシエイトのキャンペーン期間中にのみ表示する囲み型ショートコードの作成でした。 Amazonアソシエイト以外でも色々使いみちがあると思いますので、ご参考にしてください。

 

スポンサーリンク

 

Blog オススメ記事(コンテンツ選択)
  • レコード音質とハイレゾ化

  • CD音質と圧縮音源 AAC等

  • WordpressやiPhone・PC

  • ツールと閑話ブログ

レコード音質とハイレゾ化

CD音質と圧縮音源 AAC等

WordpressやPCなど

ツールと閑話ブログ