• 管理人へのメール

  • crossbreed tumblr.  ※画像をクリックして拡大できます tumblr-タンブラーって何?tumblrの始め方
    最新記事ヘッドライン (※画像をクリックして拡大できます)
    はてなブログ始めました この記事を読む → はてなブログ始めました http://crossbreed.tv/archives/201709011610.php お前らってどうやって嫌な事乗り越えてるの? この記事を読む → お前らってどうやって嫌な事乗り越えてるの? http://crossbreed.tv/archives/201501150028.php キモ美しい街並みを集めてみたよ(Googleマップ付) この記事を読む → キモ美しい街並みを集めてみたよ(Googleマップ付) http://crossbreed.tv/archives/201501101258.php みんなのビヤホールCMがリア充過ぎる件 この記事を読む → みんなのビヤホールCMがリア充過ぎる件 http://crossbreed.tv/archives/201501101122.php 【DJMIX】Bar KNAT FINAL MIX この記事を読む → 【DJMIX】Bar KNAT FINAL MIX http://crossbreed.tv/archives/201411300014.php
    同カテゴリ内最新記事ヘッドライン (※画像をクリックして拡大できます)
    「姪っ子が嫁に行った」スレ この記事を読む → 「姪っ子が嫁に行った」スレ http://crossbreed.tv/archives/201104042221.php Ajaxを使ったクールなメールフォームを設置する方法 この記事を読む → Ajaxを使ったクールなメールフォームを設置する方法 http://crossbreed.tv/archives/200901122305.php ネタ投稿掲示板を始める事にしたよ! この記事を読む → ネタ投稿掲示板を始める事にしたよ! http://crossbreed.tv/archives/200711291245.php web2.0時代のhtmlタグ作成方法(amazonリンクタグ作成方法)その1 この記事を読む → web2.0時代のhtmlタグ作成方法(amazonリンクタグ作成方法)その1 http://crossbreed.tv/archives/200607190117.php トラックバックスパムフィルター「BanNoReferTb」は凄いです この記事を読む → トラックバックスパムフィルター「BanNoReferTb」は凄いです http://crossbreed.tv/archives/200603261315.php

    7月
    19
    2006

    web2.0時代のhtmlタグ作成方法(amazonリンクタグ作成方法)その1

    カテゴリ:blogカスタマイズ |

    STARを押してこの記事を評価お願いします→
    つまんないイマイチ普通まあまあよかった! (評価して下さい!)
    Loading...


    新ブログ始めました!
    http://crossbreed.hatenablog.com

    猫も杓子もweb2.0とうるさい世の中になってきました。僕にはなんのことやらさっぱりわかりません。そこで僕なりに2.0というものに取り組んでみることにしました。
    さて、主にブログ等webサイトを運営している方はリンクタグや画像のタグをどうやって書いているんでしょうか?手入力だったり、オーサリングツールを使っていたり、タグ生成ソフトを使っていたりだと思います。
    ブログツール等はリンクタグ作成ボタンがあったりして一見便利ですが、あれも実は便利なようで使っていると超面倒にな事がだんだん分かってきます。
    こんなの
    ブログ管理画面にありがちなツールバー ということで、僕はあの手のボタンは一切使った事がないです。
    で、色々試してみて便利な方法を模索しておりまして、ようやくカタチになったっぽいので紹介したいと思います。amazonアソシエイトのリンクタグを超カンタンに生成する方法なんかも合わせて書いてます。


    ボタンを使うとこんなに面倒

    まず、ブログツールやhtml作成ツール等の機能としてある「リンク作成ボタン」を使用した場合の手順を書いてみます
    1.リンクを作成したいページへブラウザで移動する
    2.アドレスバーを選択して→コピー
    3.リンクさせる文字を入力→マウスで選択
    4.ブログ管理画面等の「リンク作成」ボタンを押下
    5.たいていの場合「ユーザープロンプト」のダイアログが表示され、URLを入力する(貼付する)
    6.OKを押すとリンクタグ「<a href="http://crossbreed.tv/">CROSSBREED</a>」が作成されます。
    うーん。URLのリンクを作るのが億劫になりますね。

    単語登録を使うと意外と便利

    僕がずっと使っているのはIME等の単語登録にタグを登録する方法です。結局一番コレが僕にとっては速かったです。やったことない方はぜひ試してみてください。
    たとえば、リンクタグの場合は、
    <a target="_blank" href=""></a>
    これを単語「りんく」等に登録します。上記ステップで書くと1番2番は同じですが
    3.「りんく」を変換して<a target="_blank" href=""></a>を表示
    4.""の間にコピーしたURLを貼り付け(CTRLL+V)
    5.リンクさせる文字をを"></a>の間に入力
    ステップ数はあまり変わりませんが、マウスを握る回数がこの方法だと約一回で済むのです。これは格段の差です。
    他のタグ、画像タグの「<img src="" />」引用タグの「<blockquote></blockquote>」なんかもすべてURLを除いた部分を単語登録によって対応することで、いちいちタグを覚える必要もありません。なんとも原始的ですが、速いんだからこれを使わない手はないです。
    是非やってみてください。

    アマゾンアソシエイトタグの作成

    webサイトやブログを個人で運営している方の8割が加入しているであろう、アマゾンアソシエイトのidつきタグを作成する方法にもちょっとした裏技というかカンタンに入力する方法があります。
    アマゾンアソシエイトの管理画面のリンク生成ページで作っている方や、webツールを使って作成している方がほとんどなんではないかと思いますが、実はそんなページでツールを使わなくても自力でURLを作成する事ができるのです。
    通常の流れですと、
    1.作成したい商品のページへ移動
    2.そのページのURLやASINコードをコピー
    3.アマゾンアソシエイト管理画面のリンク生成ページへ移動
    4.先ほどコピーしたASINコードやURLを貼り付け
    5.リンク生成ボタンを押下
    6.ID付URLのできあがり
    超不便です。いちいちやってられません。
    そしてできあがるURLは
    http://www.amazon.co.jp/exec/obidos/redirect?link_code=ur2&tag=ayuk-22&camp=247&creative=1211&path=ASIN%2FB000056K2Y%2Fqid%3D1152215954%2Fsr%3D8-1%2Fref%3Dsr_8_xs_ap_i1_xgl
    なんだこれ!長げえよ!
    URLが長すぎてキモチ悪いので、生成されたURLを色々眺めて調べたところ、そのURL自体にも法則がある事がわかります。
    http://www.amazon.co.jp/exec/obidos/ASIN/ (ASINコード) /(ユーザーID)
    ふむふむ。これで良さそうです。ASINコードというのはアマゾンの各ページについている商品固有のコードです。これで解決のように見えますがしかし、ついでに言うとこれでは商品の個別ページへは飛びません。「こんな商品もおすすめします」のウゼエページが表示されます。(カテゴリによっては個別に飛ぶ場合もあるようですがよくわかりません)

    http://www.amazon.co.jp/exec/obidos/ASIN/B000AJ9SWM/ayuk-22
    ウゼエ。
    というわけで、知っている方には当たり前の事なんですが、URLの後ろに 「/ref=nosim/」
    をつけるだけで、ちゃんとした商品個別ページへ誘導できることとなります。うーん便利!
    さらに書くと、このアマゾンのURLは以下のようにも書く事ができるようです。
    http://www.amazon.co.jp/o/ASIN/ (ASINコード) /(ユーザーID)/ref=nosim/
    長かったURLがこんなにコンパクトに!感動すら覚えますね。以上、長々と書きましたが、要はこのアドレスの雛形となる
    http://www.amazon.co.jp/o/ASIN//ayuk-22/ref=nosim/
    これを単語登録すればよいという仕掛けになります。あとは、//の間にASINコードをペーストしてやるだけ。一般的に公開されているなんとかツールを使うより圧倒的に速く、そして手軽に利用する事ができるというわけです。だってアソシエイトの管理画面に行く必要もなければ、なんとかツールのリンク生成ページに行く必要もないのですから。
    ついでにもっと言うと、先のリンクタグの登録と合体させて、
    <a target="_blank" href="http://www.amazon.co.jp/o/ASIN//ayuk-22/ref=nosim/"> </a>
    これで随分と手間が省けるはずです。
    次にアマゾンの画像も利用してみます。自分のサーバにダウンロードして使用している方が結構いらっしゃいますが、どうやらアマゾンのサーバのジャケ写真を使ってもいいようですので、使うことにします。
    これから仕様変更があったりして、画像のURLが変更になるかもですが、現在のURLは
    http://images-jp.amazon.com/images/P/(ASINコード).09.MZZZZZZZ.jpg
    http://images-jp.amazon.com/images/P/(ASINコード).01.MZZZZZZZ.jpg
    この二つで構成されているようです。[09]と[01]の違いはなんなのかはわかりませんでした。誰か教えてください。
    というわけで、imgタグを作成する際にはちょっと一手間入れてやる必要がありました。
    <img src="http://images-jp.amazon.com/images/P/(ASINコード).09.MZZZZZZZ.jpg" onload="if(this.width==’1′) this.src=this.src.replace(‘.09.’,’.01.’)" />
    これで、上の太字の部分のASINコードを差し替えてやるだけで上手く表示されるはずです。
    何をやっているのかというと、通常は[09]で表示しておいて、表示されなければ、onloadで分岐させて、01を利用するようするというものです。単純ですね。
    しかし、ここで大きな問題が発生します。
    この長いタグを単語登録することができないのです。MS-IMEでの最大文字数は60文字のようなのです。
    方法はないこともないのですが、僕はここで一旦この方法は断念して次のステップへ進もうと考えました。
    次回は、bookmarkletを使ってさらに簡単にすることができるのでその方法に迫りたいと思っております。







    あ、web2.0の事すっかり忘れてた!
    TO BE CONTINUED…

    関連

     最新WebサービスAPIエクスプロ-ラ ~Amazon、はてな、Google、Yahoo! 4大Webサービス完全攻略■最新WebサービスAPIエクスプロ-ラ ~Amazon、はてな、Google、Yahoo! 4大Webサービス完全攻略
     基礎から作るMovable Typeブログデザイン―オリジナルBlogをデザインすることからはじめよう■基礎から作るMovable Typeブログデザイン―オリジナルBlogをデザインすることからはじめよう

    商品無料仕入戦隊『電脳卸』

    この記事を読んで頂きありがとうございます。
    コメント欄も設けておりますが、
    よかったらtwitterやfacebookなどでつぶやいたりシェアして頂けると嬉しいです。

    STARを押してこの記事を評価お願いします→
    つまんないイマイチ普通まあまあよかった! (評価して下さい!)
    Loading...

    Written by ayu in: blogカスタマイズ |

    4 Comments »

    • amazon より:

      amazon

      amazonのマーケットプレイスで1円という本はたくさん.. [Ruby] amazon.co.jpから注目アイテムの発売日を取り出す Amazon.co.jp…

    • Y氏 より:

      はじめまして!
      Y氏と申します。
      プログラム?素人の私にとって、
      このブログ本当に参考になります。
      これからも有益な情報流してください!
      それだけですww

    • 管理人ayu より:

      >Y氏
      どうもありがとうございます!
      また遊びに来てくださいね。
      ちなみにアマゾンのURLはまた変わったみたいです。調査しないとなあ。

    • Inferko より:

      ヌ蓿糂. マ黑魲頸・ⅳ・靑・ 濵粽胛 ・ http://www.forum.dorways.org
      ミ裙頌頏 ・・鞣・・鶯・濵糺・・・鉋籵・・ ヌ・・鞣・湜 褥 ・鍄.
      5- 鈿璞燾・ICQ 濵・. http://www.forum.dorways.org

    RSS feed for comments on this post. TrackBack URL


    コメントして下さい

    同一カテゴリ内記事

    最近買ったモノ


    Template: TheBuckmaker.com Blog Themes | Website Hosting, Gesundheitspapst