広告

この広告は30日以上更新がないブログに表示されております。
新規記事の投稿を行うことで、非表示にすることが可能です。
posted by fanblog
「ここにブログの名前を入れます」は更新を終了しました。記事はすべて新ブログ「Big Bang」に移転済みです。記事のタイトルをクリックすると新ブログの該当記事に移動します。そちらでお楽しみください。

カテゴリー別アーカイブ  :  

Twitterでつぶやいた商品名をブログに列挙

新ブログ「amazon探検隊!」ではTwitterでつぶやいた商品名を列挙するようにしました。
こんな感じです。もちろん全部アフィリエイトです。

Amazon でチェック!

    たとえばこれなんか画像もカスタマーレビューも表示されてもし見てもらえれば
    ブログで下手な宣伝するよりも圧倒的に効果的だと思う訳です。

    追記:このブログの記事下にも導入してみました。

    以前はPHPを使った処理例を書きましたが、JavaScriptだけでも出来ます。

    新ブログ「Big Bang」で続きを読む

    注釈記法を間違えていました

    ひとつ前の記事「サイドバーにもサムネイルモジュール」ですが、
    スタイルシートの注釈記法を間違えていました。

    勘太さんがスクリプトを使ってくれたらしいので見に行ったんですが、
    こちらの思っている通りに表示されていない。

    勘太さんのページのソースを確認したんですが、スクリプトは正常に動いている。
    スタイルシートのPATHも(CSSの場合はなんて呼ぶんですかね、入れ子の順序も)
    あっている。

    ローカルでのテストは正常だったのに、ブログに上げると動かない。
    あるいは違った表示がされてしまうということは(特にファンブログの場合は)
    よくあるのですが、今回は単純にスタイルシートに書いた注釈の記法が
    間違っていたのでした。どうもすいません。

    スタイルシートの注釈表記法はC形式らしい。

    つまり、/* この間が注釈 */ となる。
    それをC++などで使う、 // 行末までが注釈

    と書いてしまった。それが原因で思ったとおりにCSSが適用されなかったようです。
    注記方法を訂正したら、正しく反映されるようになりました。

    では、何故今回こんな間違いを犯したのか?

    それは、普段CSSに注釈など書かないからです。

    つまり、ローカルで完全にテストを終えた後に、
    ブログでの説明用に普段書かない注釈を書き足した。

    その記法が間違っていたので散々テストした後でアップしたにもかかわらず
    正しく動かなかった。というわけです。

    注釈に限らず、コードのエンティティ変換など、ソースが出来てから後、
    Webに上げるためにはいろいろな手順を踏まなければいけません。

    挙句公開したら「ソースを貼ったらアフィリエイトが表示されなくなった。
    これってソースのせいなのかなあ」とか質問されれば頭に来ますわ。

    「ソースのせいじゃねえよ!お前のアフィリの貼り方が悪いんだよ!」と
    怒れば、怒ったこっちが叩かれ、質問した人物は擁護される。

    「わからないから聞いているのに」
    「怒らずに、わかるまで教えてあげるべきなんじゃないですか」

    これってどうなんですかね?

    おかしいと思ったら、貼り付けたソースコードを剥がしてみる。
    それだけでそのソースが原因かどうかわかるのに、それさえせずに質問してくる。

    それで遂にひとりブログをやめましたけど。

    画像が表示されているのを見るだけで心が痛むらしいので前記事のモジュールは
    公開しませんでしたが、やめたので、ソース書きました。

    質問する前に、自分で出来ることをやりさえすればよかったのに。
    それさえせずに質問するのが当然という風潮が最近のファンブログにはありました。

    そんなんじゃ誰もソースなんか公開しなくなると思いますよ。

    新ブログ「Big Bang」で続きを読む

    別ブログの最新記事を自動でリンクして紹介

    これはNARUさんのライブドアブログ「キーワードチョイス2」に貼ってあるもののコピーです。
    自分の別ブログを紹介しています。

    ★パパ視点の子育てブログ絶賛公開中!

    「あぁ、悩み多きイクメン生活」

    NARUのイクメンブログ。気にNARU?NARUよね。

    たとえばですが、上のものと下のもの、どちらがより興味を惹かれるでしょうか。どちらも興味がない?それは残念です。

    先ほど「お友達の最新記事を表示しよう!」に書いたスクリプトに自分で関数を加えると、このような表示も出来ます。

    ★パパ視点の子育てブログ絶賛公開中!

    「あぁ、悩み多きイクメン生活」

    NARUのイクメンブログ。気にNARU?NARUよね。

    最新記事「」公開中

    [内容]

    新ブログ「Big Bang」で続きを読む

    お友達の最新記事を表示しよう!

    「パート派遣主婦のぐーたら子育て生活」
    ☆最新記事☆

    こんなカンジで、お友達の最新記事をサイドバーに表示できるようにしました。
    デザインはスタイルシートで調整できます。

    新ブログ「Big Bang」で続きを読む

    プロフィール画像をクリックしたらTwitterを開く

    A8.netのファンブログ用情報です。

    以前「プロフィールの写真は拡大できる」という記事で、プロフィール画像をクリックすると、大きくなると書きました。これは女性の写真が小さい時には非常に有用な情報でした。

    しかし、この私のブログのプロフィール画像をクリックして大きくしても意味がありません。

    そこで、プロフィール画像をクリックしたら私のTwitterに飛ぶようにしました。

    新ブログ「Big Bang」で続きを読む

    プロフィール画像のサイズ変更

    A8.netのファンブログで、サイドバーのプロフィール画像の大きさを変えるには、スタイルシートにこう書きます。

    td.profile_name_text img.photo{
    	width:150px; /* 横幅を150ピクセルにする場合 */
    }

    完全に非表示にする場合

    td.profile_name_text img.photo{
    	display:none; /* 非表示 */
    }

    実際にどう表示されるかを事前に見たければ「スタイルシートコンバータ」スクリプトを使ってみてください。SOURCE or URL欄にあなたのブログのURL、CSS欄に上に書いたスタイルシートを貼り付けて送信すれば、適用された結果が表示されます。

    スタイルシートの書き方は「で、スタイルシートはどこに書くのか?」を見てください。

    新ブログ「Big Bang」で続きを読む

    文字に影をつけるスタイルシート

    Twitter愛のリレー小説
    「セルヴーズの雨傘」

    左の文字は、現在「自作小説!ブログトーナメント」3回戦を対戦中の当ブログエントリー作品、Twitter愛のリレー小説「セルヴーズの雨傘」のタイトル文字です。

    新しいスタイルシートのCSS3を使うと画像を使わないでも簡単に文字に影がつけられます。

    ただし、このCSS3は全てのブラウザで対応しているわけではありません。
    Internet Explorer 9では上の文字に影がついて見えますが、Internet Explorer 8では
    影がついていません。

    これはバージョンの問題です。ただし、Windows XPではInternet Explorerは8までしか
    インストールできません。

    Window7を買わせたいマイクロソフトの意地悪ではなく、ハードウェアに関わる技術的な問題が
    原因のようです。

    もし、あなたがWindows7をお使いなら、Internet Explorer9が入っています。
    でもあなたが自分のブログをお持ちの場合「私はInternet Explorer9だから大丈夫」という考えは間違いです。

    あなたには影がついて見えていても、あなたのブログの読者には影がついて見えないかもしれない。いや、影がついて見えない読者も確実にいる。

    このことを念頭においてデザインしないと失敗します。

    では、古いInternet ExplorerにCSS3を適用させる方法はないのか?
    あります。ただし、ほとんどのブログでは出来ません。

    適用させるには.htcファイルというものをインクルードすればよいので簡単なのですが、
    ひとつ重要な条件があります。

    それは.htcファイルとサイトのページは同じドメインで同じサーバーになければならないというものです。

    つまり、「ロリポップ!」や「さくらインターネット」にサーバーを借りてWordPressなどでブログをはじめる以外はあきらめるしかありません。

    今回の記事はそういう制約があることを承知した上でお読みください。

    新ブログ「Big Bang」で続きを読む

    JSONPでTwitter API searchメソッド

    今回もWebService/Twitter/API - わすWikiを参考にさせていただきました。

    先日の記事「Twitter API 愛の劇場のソース」では、Twitterのuser_timelineメソッドをPHPで呼び出し、simplexmlを使って処理しました。

    しかし、記事中に書いてあるようにソースに不備があります。

    書き直すに当たり、次の変更を行ないました。

    1. searchメソッドを使って検索する
    2. PHPを使わず、JavaScriptとJSONPだけで構成する。

    前回のソースは、とりあえずTwitter APIがどんなものか動かしてみるレベルの内容です。
    いいコードとはとてもいえないものでした。今回は使う開発言語を減らすことで、コードがスッキリしました。

    アクセス制限の問題もあります。1時間に150アクセスまでなので、PHPを置いたサーバーからTwitterのサーバーにアクセスするより、JavaScriptを読み込んだ各ブラウザからTwitteのサーバーにアクセスさせる方がIPを分散できます。

    さらに、前回はリレー小説の書き手分user_timelineメソッドを呼び出していました。今回はsearchメソッドで、Twitterのサーバーに問い合わせる回数を減らします。

    search API

    http://search.twitter.com/search.json

    赤字のjsonatomにすると、Atomが返ってきます。

    http://search.twitter.com/search.json?q=検索クエリー&callback=コールバック関数名&result_type=recent&rpp=100&since_id=200851367760363520&page=1

    参考記事:GET送信とは?

    必須パラメーターはqです。
    q=には検索クエリーをURLエンコードして送信します。検索クエリーの書き方は後述します。

    callback=にはJSONPのコールバック関数を指定します。このオプションはatomの時には適用されません。

    result_type=には、欲しい検索結果の種類を指定します。指定できるのは以下の3つ。指定しないとrecentが指定されたものとみなされます。

    result_typeに指定できる値
    recent   「新しい発言」を優先的に検索結果に含める
    popular 「人気の高い発言」を優先的に検索結果に含める
    mixed    「新しい発言」と「人気の高い発言」の両方を適度に検索結果に含める

    rpp=には、一度に取得する検索結果の数を指定します。指定できる最大値は100、未指定だと15になります。

    since_id=は指定したIDより大きなIDのステータスのみ取得するオプションです。検索に指定IDそのものは含まれません。

    page=1ページを rpp 件とみなして取得するページを指定します。最初のページは1です。また、rppとpageで遡れるのは、最大1500件までです。

    他にもたくさんのオプションがあり、WebService/Twitter/API - わすWikiにまとめられています。


    ところが、今回も問題がありました。ある日から1話目が表示されなくなったのです。
    どうも、約10日(1.5週)以上前のつぶやきは検索されないようです。

    また、利用できる検索インデックスについても日数の制限をかけています。現在は、1.5週となっていますが1日のささやきが増加するとこの数字はもっと短くなります。
    Twitter ビジネスユーザー向けブログ » Twitter APIで開発をするために知っておくべきことより

    ということで、またスクリプトを修正することになるのですが、それは別の記事にして、この話を続けます。

    検索クエリーの書き方

    今回の検索クエリはこうなりました。

    from:Tom3suteki OR from:welcome2ourshop -RT つづく

    from:Tom3suteki で、投稿者がTom3sutekiのつぶやきを検索します。

    リレー小説なので、投稿者が2人います。from:Tom3suteki または from:welcome2ourshop という場合は、ORで結びます。

    from:Tom3suteki OR from:welcome2ourshop

    ORは大文字で、前後に半角スペースを入れます。

    検索から除外したい文字列の前には - (ハイフン)をつけます。ハイフンと文字列の間にはスペースを入れずにくっつけます。

    -RT とすることでRTを含む文字を除外します。つまり、リツィートの除外を指定したことになります。

    つづくなどと、何もつけない文字列を指定すると、その文字列を含んだツィートを探します。

    つまり「from:Tom3suteki OR from:welcome2ourshop -RT つづく」は、「投稿者がTom3sutekiかwelcome2ourshopでRTを含まず(リツィートを含まず)、つづく という文字列があるツィートを探せ」という意味です。

    これを、URLエンコードした上で、q=に続けて書きます。

    新ブログ「Big Bang」で続きを読む

    GET送信とは?

    インターネットでページを見るときに必要なのがURLです。

    このブログのURLはhttp://fanblogs.jp/ayzfqir5/archive/465/0ですが、それに情報を含めて送る事が出来ます。

    たとえば、http://fanblogs.jp/ayzfqir5/archive/465/0にユーザーIDの「Tom」とパスワード「sexy」を含めて送る場合このようにします。(このユーザーIDとパスワードは架空のものです)

    http://fanblogs.jp/ayzfqir5/archive/465/0?user_id=Tom&password=sexy

    上のリンクをクリックしてみてください。URLに架空のユーザーIDとパスワードという、余計なものが混ざっているのに、問題なくこのページが表示されたと思います。

    これがGET送信です。GET送信でTwitterなどのAPIにパラメーターを送ることが出来ます。

    GET送信
    http://fanblogs.jp/ayzfqir5/archive/465/0?user_id=Tom&password=sexy

    新ブログ「Big Bang」で続きを読む

    JavaScriptで表の並び替え

    これは大きい順や小さい順に並び替えるのではなく単純に順番を逆にする方法です。

    JavaScriptで、大きい順や小さい順に並び替えたいとき(ソート)には
    sort関数を使いますが、今回は触れません。

    テーブル(表)の順序を逆にする関数

    var swap=function(id){
    	var elem=document.getElementById(id);
    	if(!elem){return;}
    
    	var tr_elems=elem.getElementsByTagName('tr');
    	var min=0,max=tr_elems.length-1;
    
    	while(min<max){
    		var td_min=tr_elems[min].getElementsByTagName('td');
    		var td_max=tr_elems[max].getElementsByTagName('td');
    		var tmp1=td_min[0].innerHTML;
    		var tmp2=td_min[1].innerHTML;
    		td_min[0].innerHTML=td_max[0].innerHTML;
    		td_min[1].innerHTML=td_max[1].innerHTML;
    		td_max[0].innerHTML=tmp1;
    		td_max[1].innerHTML=tmp2;
    		min++;
    		max--;
    	}
    }

    新ブログ「Big Bang」で続きを読む