SE奮闘記

ある一定以上の文字幅になったら切り詰めて表示する方法を調べたメモ。サーバーサイド（PHP）でやる場合は mb_strimwidth という関数が標準で用意されている。 mb_strimwidthは半角文字を1、全角文字を2として幅を計算しているので、気をつけないといけないのは プロポーショナルフォント （Verdana, sans-serifなど）を使っている場合は、思い通りの幅に収まらない場合がある。 特にアルファベットの半角大文字を使った場合にズレが大きくなる。（「W」とか） これを解決するためには、等幅（等角）フォントを使う必要がある。CSSで指定する場合は次のような感じ。 font-family: monospace; もう一つの方法はJavaScript（クライアントサイド）で横幅を判断して切り詰める方法。下記サイトが詳しい。 JavaScript で幅に合わせて文字列を切りつめる jQuery でそれらしいプラグインがありそうだけど、時間があったら今度調査。

TwitterのつぶやきをAPI経由で取得して表示する wordpressのプラグインを作った けど、つぶやき内のURLがリンクになったり、ならなかったりしたので、正規表現を見直したときのメモ。 元にしたのは ここ にある正規表現。 これを日本語用に直したのがこれ。 function wp_twitter_client_convertlink($tweet) { $tweet= preg_replace("#(^|[\s\"\[<(（　])([\w]+?://[\w]+[^\s\"\]>)）　]*)#", "\\1<a href=\"\\2\" target=\"_blank\">\\2</a>", $tweet); $tweet= preg_replace("#(^|[\s\"\[<(（　])((www|ftp)\.[^\s\"\]>)）　]*)#", "\\1<a href=\"http://\\2\" target=\"_blank\">\\2</a>", $tweet); $tweet= preg_replace("/@(\w+)/", "<a href=\"http://www.twitter.com/\\1\" target=\"_blank\">@\\1</a>", $tweet); $tweet= preg_replace("/#(\w+)/", "<a href=\"http://search.twitter.com/search?q=\\1\" target=\"_blank\">#\\1</a>", $tweet); return $tweet; } 全角スペースとか全角カッコとかあるので、ファイルの文字コードを気をつける必要がある。 さらに ...

携帯サイトのアクセス解析をするためにGoogle Analyticsの携帯電話向けコードを設置したときのメモ。 全体的な流れは こちらのサイト を参考に。 Wordpressのプラグイン Ktai Style の開発元サイトでも 設置方法の説明 がある。 ここでは実際に試したときの注意点のみ記載 プロファイルを追加するときは「新しいドメインのプロファイルを追加」にした方がいい。「既存のドメインのプロファイルを追加」をすると、PC向けに設置しておいたプロファイルに携帯のアクセス解析が統合されて表示されるので、アクセス解析しにくくなる。 Ktai Styleのテーマに埋め込むには、コードを修正する必要がある。 global $GA_ACCOUNT, $GA_PIXEL; //←これを追記 $GA_ACCOUNT = "MO-123456-1"; $GA_PIXEL = "/ga.php"; 確認するときはFirefoxのプラグインの「 FireMobileSimulator 」が便利。   ＜関連記事＞ Google Analyticsの携帯対応。ついにこの日が・・・

Windows7を使ってデモを行ったときに、レイアウトのズレが気になったので、前に手に入れたMac上のVMware FusionにWindows7評価版をダウンロード、インストールしてみた。 評価版は マイクロソフトのサイト からダウンロード。ない場合はGoogleで「 Windows 7 Enterprise 評価版 ダウンロード 」で検索すれば出てくると思う。 OSのインストールは特に迷うことはないと思う。 ただネットワークがデフォルトでNATになったので、ブリッジに変更した方がいいかも。 起動後はVMware Toolsをインストール（自動起動しなかったのでスタート → コンピューターから開いて実行）。 リモートデスクトップの接続を許可（スタート → コンピューターを右クリックプロパティ → リモート設定 → 「リモートデスクトップを実行して・・・」を選択）。 これで環境が整った。 ・・・でも現象が再現しない。 あれー？もしかしてvistaだったのかな。   ＜関連記事＞ Mac mini(snow leopard server) + VMware fusion 3を買った windows 7 RCをVMware Server 2.0にインストールしてみた

サクっとできると思ったら、ちょっとハマったのでメモ。 「リモートログインを設定」で許可したあと、実際に接続できるかどうかはローカルホストのターミナルで確認。 Windowsの Tera Term でログインするときは「チェンジレスポンス認証を使う」にしないと出来ないみたい。←これで少しハメられた。 SSHのセキュリティを強化したい場合は、/etc/sshd_configを編集してRSA認証を有効にしたりする。   ＜関連記事＞ 【Linux】SSHの鍵方式を設定してログインを制限する Tera Term Proのダウンロードとインストールメモ

受発注システムを開発したときに、たくさんある入力項目に自動入力してくれるツールを探したときのメモ。 「 Selenium IDE 」というFirefoxアドオンを使うと便利。 ブラウザ上の動作を記録して実行することが可能。 ただjavascriptのonblurなどのイベントは発生しないので注意が必要。 下記サイトも参考に。 [Think IT] 第7回：Selenium IDEの活用とSelenium利用時の注意点 (1/3) 一つの帳票を作成するのに100を超える入力項目があり、そのデータを集計する画面をテストするのに、このツールがないと生きていけない。

やっぱり一定の年齢以上の人はEnter(Return)で入力できないと苦痛らしい（Tabで移動できることを知らない）ので、JavaScriptで実現できないものかと調査したメモ。 IEだけなら次のコードをonkeydown時に実行すればOK。 if( event.keyCode == 13 ) {     if(event.which) {         return false;     } else {         event.keyCode = 9;     } } event.whichの分岐はfirefoxでスクリプトエラーが出ないようにしている。 firefoxでも動くようにしようと思ったら結構めんどくさい。 Enterキーイベントをtabキーイベントに置き換えるのではなくて、Javascriptで次のフォームを見つけてfocusするようにした方がいいかも。 ここ などを参考に。 jQueryを使えば closest とか nextAll とか使えば簡単に実現できると思う。

Wordpressのテーマをいじっていて、IEとFirefoxで文字サイズに違いがあるので調査したメモ。 他の開発で困らなかったのは、 blueprint というcss frameworkを使っていたから。既存のテーマをカスタマイズするときでもcss frameworkは積極的に使っていこうと思った・・・。 フォント指定しているところを見比べてみると、次のような指定をすれば大丈夫そう。 html {     font: 100.01% Verdana, sans-serif; } body {     font-size: 75%; } 下記サイトも参考になる。 ブラウザに依存せず文字の大きさを統一させる方法 IEで指定どおりのfont-sizeにならない

関連記事する記事へのリンクを手動で貼っていたけど、そんなガジェット普通にあるよね？と思って調べてみた。 こちら のサービスを使う。 「Get Key AND Install」から自分のブログのアドレスを入力すれば「Add a Sidebar Widget」のボタンを表示してくれるので、クリックすればガジェットとして登録できる。 簡単。↓こんな感じ。詳細記事のときだけ表示される。 いろいろガジェットとか追加しすぎて Googleウェブマスターツール で見ると、サイトの読み込み時間が遅い（平均5.5秒らしい）ので、少しは軽くしないといけないと思いつつ・・・。 BloggerのタグをGmailみたいに整理できるツールがほしいね。

サーバーを移行したときにUbuntuとCentOSがある中で、なぜかUbuntuだけ外から接続できなくて調査したときのメモ。 結局ルータの設定で192.168経路で外に出れなくなっているみたい。どういった経路で外にでるかは # route -n とか # traceroute -n -w 2 -q 2 -m 30 8.8.8.8 で分かる。tracerouteは Google public DNS に接続する経路を調査するときのコマンド例。 routeの情報は、ネットワークの設定でデフォルトゲートウェイ（DefaultGateway）を設定後にネットワークを再起動すると自動で設定されるみたい。 ちなみにネットワークの設定はCentOSの場合はsystem-config-networkコマンドでできる（ 前の記事 ）。Ubuntuの場合は/etc/network/interfacesを編集する（ 前の記事 ）。 ただUbuntuはネットワークを再起動してもルーティング情報が残ったままだったので、 # route del -net 0.0.0.0 のコマンドで削除。削除したあとネットワークを再起動したら思ったようなルーティングになった。 さらにルータをnameserverに指定しても名前解決してくれなかったので、GoogleのPublic DNSを使うように設定。/etc/resolve.confに次のように記述。 nameserver 8.8.8.8 nameserver 8.8.4.4 詳しくは Googleのページ に書いてある。ちゃんと8.8.8.8にたどり着くことができるかどうかは # traceroute -n -w 2 -q 2 -m 30 8.8.8.8 で分かる。これもGoogleのページに書いてあるけど。 ルータをちゃんと設定すれば、こんなことで悩まないんだけどね。

ママによるママのための子育て情報サイトteniteo[テニテオ] がリニューアル。今回の目玉は、今 話題のtwitter との連携。 クチコミに投稿するとTwitterに teniteoのアカウント でつぶやく。twitter上で返信があった場合は、ちゃんとteniteo内の詳細画面に表示される。 twitter上で誰も返信してくれなかったら寂しいけれど、どんな（どれくらいの）効果があるか楽しみ。 Google Newsと連携する「育児ニュース」とか「スナップ撮影会」も見やすくなったし、大分良くなっていると思う。 今開発中の機能とかも加わると賑やかになりそう。 お母様たちが便利になったと感じてくれたら嬉しいな。 今度の課題は おすすめ とか Q&A に投稿された生活に役立つ記事が埋もれてしまわないように、うまいこと探し易くすることかな。

PHPExcel を使って、ループしながら帳票をシートに書き出しているときにあまりにメモリを使うのでいろいろ調査したメモ。 処理の流れとしては 元になるエクセルのテンプレートファイルを読み込み 最初のシートを非表示にしておく 最初のシートをコピーして帳票を描画 2ページ以降も最初のシートをコピーして追加 ファイルとして書き出し ここまでを必要な分だけループして、出来たエクセルをzip形式で圧縮してダウンロード。 「シートをコピーして追加する」の処理がメモリを大量に消費する。コピーするごとにメモリ消費量が倍になっていくみたい。 なので、PHP-Excelで 「シートをコピーして追加する」はやらない方がいい 。 追加したいタイミングでテンプレートファイルを読み込んで追加 すると余計なメモリを食わない。 require_once(PW_VENDORS_DIR ."/PHPExcel/Classes/PHPExcel/IOFactory.php"); //PHPExcel 読み込み $objReader = PHPExcel_IOFactory::createReader('Excel5'); $objExcel = $objReader->load($sTemplateFile); $objSheet = $objExcel->getSheet(0)->copy(); $objExcel->disconnectWorksheets(); unset($objExcel); $objSheet->setTitle('page' . ($this->excel->getSheetCount() + 1)); $this->excel->addExternalSheet($objSheet); さらに注意点としては、1.7.3cはaddExternalSheetにバグがあるので、最新のソースをダウンロードした方がいい。ちなみにaddSheetを使う場合はrebindParentしなければならない。 動作確認したのはビルドNo.53908 あと、saveで書き出したあとは次のようなメソッドを...

リクエストのログを記録していくときに jQuery のajax通信を使う場合は除外したかったので、サーバー側で判別する方法を調べたメモ。 環境変数のHTTP_X_REQUESTED_WITHを見れば分かるみたい。サーバーサイド（PHP）のサンプルコードは下のような感じ。 /** * Ajaxによるリクエストかどうか * * @return boolean True or False */ public function isAjax() { if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest'){ return true; } return false; } これで判断できるのはjQueryがajax通信をするときのリクエストヘッダー「X-Requested-With」に「XMLHttpRequest」をセットしてくれているから。 ちなみにリクエストヘッダーを見る場合は、Firefoxのアドオン「 LiveHTTPHeaders 」が便利。   ＜関連記事＞ jQueryを使ってPHPとJSON形式のデータをやり取りする方法

Teniteo で今日の天気を表示させたいということで、天気を商用利用できるAPIがないものかと調査したメモ。 Google グループに貴重な情報源 を発見。 World Weather Onlineが商用利用でもAPIを使っていいみたい（クレジットの表示は必要）。 Wordpressのプラグインでは「 WP-Weather 」というのが良さそう。これは Weather.com を利用している。Weather.comは商用利用は不可みたい。 rssWeather.com を使っても同様だと思う。 公式のガジェット だったら大丈夫そうな予感がする。 Google Weather API が商用でも使えるようになればベストなんだけど。公式に公開されるまで待ちみたい。

前の記事 でPicasaの写真を一覧表示するプラグインを使ってWordpressに表示したときに、クライアントでは Fancybox を使おうと実装してみた。 ただ、大量の写真をIEで表示させると異様に遅い。読み込んでから引っかかっている感じ。調べてみるとどうやらcssでAlphaImageLoaderを指定しているのが原因みたい。 AlphaImageLoaderはIE6でもpngを表示させるためのIE限定ハック。 しょうがないのでAlphaImageLoaderは全てコメントアウトして、JavaScriptでIE6でもPNGを表示できるライブラリ「 DD_belatedPNG 」を使うことにした。 ライセンスはMIT License。 add_action('wp_head', 'show_ie6_png');//IE6のPNG対応 function show_ie6_png() { $base_url = get_bloginfo('url') . '/wp-content/plugins/wp-gallery/fancybox'; echo '<!--[if IE 6]>'; echo '<script type="text/javascript" src="' . $base_url . '/DD_belatedPNG.js"></script>'; echo '<script type="text/javascript">'; echo 'DD_belatedPNG.fix(".fancy-bg, .fancy-ico, #fancybox-close, #fancybox-loading div");'; echo '</script>'; echo '<![endif]-->'; } さらに同じ画面にflashがあるとflashが前面に出てきてしまう問題は、 wmode=...

Wordpress MU(multi user)と統合された部分が気になったので、インストールして試したときのメモ。 3.0の詳しい機能は 公式サイト で（英語）。 新規インストールは最初からadminのユーザー名とパスワードを指定できるようになった以外はあまり変わらず、直感的にできる。（ 前の記事 を参照） .htaccessは作成されないみたい。 日本語化する場合は設定項目が見当たらなかったのでwp-config.phpのWPLANGを直接編集。languageファイルは前のバージョンをコピーしとく。 define ('WPLANG', 'ja'); この辺は 日本語バージョン を使えば必要ないかも MUのマルチサイト化する場合はwp-config.phpに次のように記述。詳しくは 公式サイト を参照。 define('WP_ALLOW_MULTISITE', true); これで管理画面に「Network」という項目が出現する。設定してインストールすると、wp-config.phpと.htaccessを編集するように言われるので設定して、ログインし直す。 そうすると、前のMUっぽい管理画面になっている。 いろいろと利用できる関数とか変更があったみたいで、アップグレードするときは慎重にやる必要がありそう。

2年ぐらい前から待っていたBloggerのアクセス解析機能がようやく導入されたみたい。 http://draft.blogger.com/ にアクセスすると「統計」というタブが増えている。 Google Analyticsと比べて、参照元（リファラー、被リンク）の一覧やリアルタイムなアクセス状況が表示されていて、見ていて面白い。 参照元（被リンク）はGoogle Analyticsで表示できるように設定してあったので、今のところ使い道はなさそう（？）。   ＜関連記事＞ Blogger向けアクセス解析ツールはまだ？

WordpressでObject Cacheを有効にしたときに（ 前の記事 を参照）、APC(Alternative PHP Cache)の挙動がおかしかったので最新バージョンをコンパイルしてインストールしたときのメモ。 環境はLinux(CentOS), Xampp for linux(LAMPP) 1.7.1 現象としてはページ一覧のウィジェットを表示したときに（キャッシュがない）初期表示したときは正常に表示されるが、2回目移行は表示できない。 コードでいうと/wp-includes/post.phpの2368行目あたりの wp_cache_set( 'get_pages', $cache, 'posts' ); したときにうまくキャッシュに保存されないみたい。 このときのAPCバージョンは3.0.19 最新バージョンは ここ からダウンロード。この時点では3.1.3p1 適当な場所において解凍してコンパイルしてインストール（アップグレード） # tar xzvf APC-3.1.3p1.tgz # cd APC-3.1.3p1 # /opt/lampp/bin/phpize # ./configure --enable-apc --with-php-config=/opt/lampp/bin/php-config # make  # make install 完了すると次のようなメッセージ php.iniに下記を追加 extension="apc.so" これでlamppを再起動。 # etc/rc.d/init.d/lampp restart php_infoを開いてみてapcのバージョンが上がっていたら成功。 問題の現象も直っているみたいで良かった。betaバージョンだし他の問題が起きなければいいけど。 ＜2010/09/23 追記＞ APC 3.1.3p1は時間が経ってもキャッシュが残ったままのバグがあるので、3.1.4にした方がいい。 ＜2010/10/15 追記＞ php.iniの設定例 extension="apc.so" apc.sh...

先輩から私が結婚式の披露宴で四方割をしたときの動画を頂いたので Picasa にアップ。ついでにその1ヶ月前に2次会でやったので、これも紹介。 2009å¹´2月7日 結婚式の2次会前に練習中   2009å¹´2月7日 結婚式の2次会板割本番   2009å¹´3月8日 結婚式の披露宴で四方割 このときの板は前にやったときより2.5倍くらいの厚さ（最後の手刀のは薄め）。事前に練習してみたら、結構本気にならないと割れなかったので、↑真剣です。 集中していたので、野次られていたのにも気付かず。 初めてPicasaの動画機能を使ってみたけど、結構画質が悪くなるね。   ＜関連記事＞ arai-flat氏の結婚式2次会

Wordpress のプラグインの開発で、標準で提供されているキャッシュ機能を利用しようと思っても、何も設定しないとwp_cache_setしてwp_cache_getしても無意味と気づいたときのメモ。 単にキャッシュして高速化するなら W3 Total Cache とか WP Super Cache をインストールすればプラグインが自動でいろいろやってくれるので劇的に速くなると思う。 ただPHPで動的に表示するページとかktai styleとの絡みが怖かったので、明示的にプログラムでキャッシュしたい場合にだけキャッシュする。 wp-includes/cache.phpのWP_Object_Cacheクラスの使い方やキャッシュする方法はいろいろあるよ。的な説明は 本家のページ を読む。 前の記事 でAPC(Alternative PHP Cache)はインストール済みなので、今回はWP_Object_CacheのバックエンドにAPCを使う。 ここ のブログからリンクされている（APC Object・・・をクリック）apc-object-cache.phpをダウンロード。 wp-content/object-cache.phpとして配置。 これで完了。 内部的にはwp_cache_setしたときは apc_store を呼んでいるだけ。ちなみになぜ「object-cache.php」という名前にしないといけないのかは、wp-setting.phpの290行目あたりを見れば分かる。 これでGoogle AJAX Search APIに毎回問い合わせなくて済む。 Picasaの写真を取得するプラグインを作成したときのキャッシュを使う部分は次のような感じ。 $xml = wp_cache_get('album_' . $id, WP_PICASA_CLIENT_CACHE_GROUP); if (empty($xml)) { //if not cache then connect to picasa $api_manager = new WPPicasaClientAPIManager(); if (!$api_manager->auth($account, $password)) { retur...

wordpressでTwitter APIと連携するプラグインを開発したときのメモ。 PHPでTwitter APIを使う方法は 前の記事 を参考に。 ちなみに Services_Twitter を使っている。 特定のtweetに返信した場合にtimelineを取得すると、in_reply_to_status_idに返信元のstatus_id（tweet ID）が入っているので、これをキーにして取得する。 「このつぶやきに対するツイートのタイムラインを取得」というAPIは現状ないみたいなので、自分に対するつぶやきを取得できる statuses/mentions を使って取得。 指定したstatus_id以降の自分に対する返信を取得して、ループしながらin_reply_to_status_idと比較するやり方。 サンプルコード（一部のみ抜粋） public function get_replay($status_id='', $limit=20) { try { $param = array(); if (!empty($status_id)) { $param['since_id'] = $status_id; } if (!empty($limit) && is_numeric($limit) && $limit > 0) { $param['count'] = $limit; } $list = $this->client->statuses->mentions($param); $result = array(); foreach ($list as $item) { if (!empty($item->in_reply_to_status_id) && $item->in_reply_to_status_id == $status_id) { $result[] = $item; } } return $result; } catch (Services_Twitter_Exception $e) { array_pu...