ブログ管理

【使い方説明】「カッテネ」のショートコード作成をサポートするツールを作りました

WordPressプラグイン「カッテネ」のショートコード作成をサポートするツールを作りました。

はじめに言っておくと、サポートするのはURL取得以外の部分です。
URLの収集は依然自力で行います。それでもだいぶラクにはなると思います。
このページでは、上記ツールの使い方を説明いたします。

カッテネ(kattene)という良プラグイン

AmazonJSが使えなくなったので、Amazonのアソシエイトリンクを貼ろうと思ったら、「カッテネ(kattene)」という便利なプラグインの存在を知りました。
以下のような感じで、ある商品に関して複数のショッピングサイトのリンクをまとめて表示できるものです。

石川 栄和 (著), 大串 肇 (著), 星野 邦敏 (著)

仕組みとしては、「画像」「ボタンの文字」「ボタンを押したときのリンク先」の3つを設定するというもの。

ですので、商品紹介以外の用途でも使えます。こんなこともできます。
(下のブロックは「カッテネ」を使って作りましたが、クリックしても当サイトのトップに飛ぶだけです)

飼っていた2羽のインコです。

さて、そんなカッテネ。
カスタマイズ性が高いぶん、作るのがけっこうメンドクサイです。
例えばAmazon、楽天、Yahooショッピングのリンクを張りたかったらひとつひとつのURLを都度設定する必要があります。1ボタンごとに、です。

  • Amazonアソシエイトリンクから商品画像のURLを取得
  • Amazon商品のURLを取得
  • もしもアフィリエイトから楽天商品のURLを取得
  • バリューコマースからYahooショッピングのURLを取得
  • そして最後にそれらを組み込んだコードを作成する

…といった具合。
ひとつのリンクを作るのにこれだけの手間がかかります。

そんな手間を削減するツールを作ってみました。

ツールの使い方説明

ツールページに行くと、以下のような画面が表示されます。

1.商品名を設定

まず、商品名を入力します。AmazonなどのショッピングサイトからのコピペでOK。

設定した文字列は、「カッテネ」のこの部分に相当します。

2.説明を設定

説明を入力します。書籍の著者名を設定するのが一般的のようです。自分の言葉でひとことコメントを付けるのもいいですね。

この位置に反映されます。

3.画像URLの入力

画像URL欄に、画像のURLを入力します。

書かれたURLに存在する画像が、ここに表示されます。

4.ボタン外観の編集

商品1~5URL欄の、「ボタン文字列」と「色」を設定します。
初期表示は以下のようになっています。
ボタンを表示するかどうか はURLの有無で判断しますので、
5個もボタンいらない、という方も特に気になさらず。

5.ボタンURLの編集

各ボタンをクリックした際に遷移するURLを記述してください。
利用するアフィリエイトによって、URL生成手順が変わってくると思うので適宜ご用意ください。

URL欄に記述がある行が、ボタン表示の対象となります。
たとえばURLを3種類分だけ入力した場合、表示されるボタンは3個です。

なお、入力した文字列にダブルクォーテーションが含まれる場合は、分割2グループ目の値を使用します
要は、「A HREF=」のタグから始まるURLをコピッてしまった場合の保険です。

6.「生成してコピー」ボタンをクリック


画面下部の「生成してコピー」をクリックします。
ショートコードがコピーされます。クリップボードに勝手にコピーされると思うのですが
できない場合はボタン下のテキストエリアからコピーしてください。

コピーした文字列を、サイトの記事ページにペーストすれば、カッテネのブロックが表示されます。

ツールはこちら

さいごに

自分用に作ったものですので。目的にそぐわない部分もあるかもしれません。
アクセスされる方が多ければ、使い勝手の強化にも目を向けていこうと思います。

ひとまず、このツールと「ShortCoder」プラグインのおかげで商品リンクの付与がラクになりました。

COMMENT

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください