楽天アフィリエイトの画像を左寄せ、右寄せにしたい

 楽天アフィリエイトで生成されたリンク用コード自体に手を加えないで、デザインに自由度を出すためのブックマークレット。
 楽天アフィリエイトではおすすめ商品を紹介するための画像リンクおよびテキストリンクが作成できます。
 でも、それでリンク用コードを作って、そのまま貼り付けると、右側ががら空きでデザイン的に美しくない、っていう悩みがあったりします。たとえば、こんな感じ。
女王の教室 DVD-BOX【VPBX-12949】=>20%OFF!女王の教室 DVD-BOX
 右側ががら空きでなんかさびしい。でも、これを左寄せ、とか右寄せできたらどうだろう? たとえば、こんな感じ。

女王の教室 DVD-BOX【VPBX-12949】=>20%OFF!女王の教室 DVD-BOX

 このドラマ、すごいおもしろかったです。とくに、主演の○○さんの冷徹無比なキャラクターと、それに対抗し、成長していく生徒たちの演技がすばらしくよかったです。
 とかなんとかー。
 っていう、感じ。こうすると、無駄な空きスペースとか気にならないですよね。
 こういうのをやる場合には、「img」タグにいろいろ足して、っていうふううにすると思うんですが、楽天アフィリエイトでは、タグの改変を認めてないわけです。まあ、そんな気にすることない、っていう人もいっぱいいると思うんですが、気にする人も多いようで。
 じゃあ、楽天で生成されたタグはそのままで、それをはさむ形で別のタグを加えれば問題ないだろう、ってことで。ここで紹介するブックマークレットを利用すれば、規約違反を気にせずに、左寄せ、右寄せのレイアウトが簡単にできます。
 ‘ + s_word +’

‘;void(s_range.text=r_word);”>sel2r(楽天広場用)
 上記2つのリンクをそれぞれ、ドラッグでお気に入りに追加します。XP SP2だとうまくいかないので、右クリックで「お気に入りに追加」してください。警告が出ますが、それは無視してください。これで準備段階は終了。
 実際にエントリを書く際には、アフィリエイトリンクを記事中にペースト。その貼り付けた部分を選択した状態で、先に追加した「sel2l(楽天広場用)」(左寄せ用)または「sel2r(楽天広場用)」(右寄せ用)を、お気に入りからクリック。これで、左寄せ、右寄せ用のタグが追加されます。
 楽天ではclassの指定ができない(やるとエラーが出る)ので、背景や枠線などを楽に加えるといったカスタマイズはできませんが、それでも、簡単だからいい! っていうメリットはあると思います。当然ながら「アフィリエイトリンクを右寄せ、左寄せにしたい」をもとにしたブックマークレットです。
 なんか、うまくいかないー、などの質問、ご要望はコメント、トラックバックなどで受け付けたいと思います。よろしくです。
 おまけ。

 画像とテキストの両方を使う場合(間に改行入ってます)も、このブックマークレットがうまく効いてくれます。
 ここでは、画像のあと、改行入れて、合計2つのリンク用コードを選択しておいてから、ブックマークレットを実行してます。あと、ブックマークレットで加えられたDIVタグに「width:100px;」を加えてます。どうでしょう? いま、SMAP! SMAP!に荒川選手が出てたので、そんな感じのセレクトに。

コメント

  1. 匿名 より:

    こんにちは、
    楽天アフェリエイトを左寄せ方法はないか検索をし
    辿りつきました。

    現在もこちらの方法で左寄せにすることはできますでしょうか?
    宜しくお願い致します。

  2. ここの人 より:

    Windows 10のIEで試したら、大丈夫っぽいですよ。
    試してみて、左寄せできてたらいいわけですよね。ココログの投稿ページならちゃんと動作してます。ほかのブログサービスの投稿ページでは修正が必要になりますが。