Hemingway WordPress Theme

春だし、衣替え~!
ってことでブログのデザイン変えてみた。Hemingwayって名前のテーマなのだけど、Hemingwayってこういうのじゃなかったけ?違うバージョンなのかな?結構良さげなのを発見したので導入!一部CSSに納得いかない箇所(Linkの文字に下線が引かれない等)があるけど、まぁここら辺は全体の整合性を考えて後で微調整しよう。
これで順道制勝もレスポンシブウェブデザイン!スマホでも見やすくなった~。最近のアクセス解析見ると、ボルダリング系の日記は何故か突出してスマホからのアクセスの割合が多いのだよねえ。ボルダラーはモバイラー?

雑誌「LIFE」の写真のgoogleアーカイブ

ライフマガジン所有の約1000万点の写真(未発表含む)をデジタル化して、タイトルやイベント名、写真家名をキーに検索することができるようにしたウェブサイト「LIFE photo archive hosted by Google」って、皆さんもうご存知でした??

なんでこんなサービス見つけたかって言うと、今借りてる部屋はピクチャーレールがついていて、せっかくなので使いたいな〜と思ってるんだけど、自分の撮った写真を飾るってのは趣味が悪い。かといって「友達の○○君がいつ撮った写真」みたいな余計なコンテキストもいらないって感じなので、最近ずっとネット上で写真を探してたら、上記のサイトを発見したというわけです。

これなら、特に自分とは関係のない撮影者や被写体で、純粋に気に入った写真を探す事が出来そうです!プリント販売もしてくれてるし、あと、そもそもLIFEの写真カッコいいし。。

ブログ移転しました

といっても、ほんと内部的な話で、外からは何も変わっていないように見えると思いますが・・・。

この前、さくらVPSはじめましたってエントリー書きましたが、ひとまずブログを以前使ってたxrea.comからこちらへ移転。VPS始めたから移したってだけで、xrea.comも非常に満足のいくサービスを提供してくださいました。今までありがとうございました〜。※でもやっぱsshログインしたいっすわ。さらなる自由を求めて、ということで。
※2010/10/07 追記 すんません!xrea.comさん、普通にsshできました!僕が使ってないだけでした!笑

とりあえず引っ越しでやったことメモ。

1. 旧サーバからエクスポート
 1.1 wordpress 管理画面左部の「ツール」→「エクスポート」
 1.2 /wordpress/wp-contens/ 配下(plugins, themes など)をダウンロード

2. 新サーバへwordpressインストール

[shell]
[root@www6384u ~]# yum install httpd php php-mbstring php-mysql php-gd mysql-server
[root@www6384u ~]# chkconfig –level 345 httpd on
[root@www6384u ~]# chkconfig –level 345 mysqld on
[root@www6384u ~]# /etc/init.d/httpd start
[root@www6384u ~]# /etc/init.d/mysqld start
[root@www6384u ~]# mysql -u root -p
> create database ‘wordpressdb’ default character set utf8 collate utf8_general_ci;

[root@www6384u ~]# cd /var/www/html/
[root@www6384u ~]# wget http://ja.wordpress.org/wordpress-3.0.1-ja.tar.gz
[root@www6384u ~]# tar zxvf wordpress-3.0.1-ja.tar.gz
[root@www6384u ~]# chown -R apache:apache wordpress
[root@www6384u ~]# chmod +w wordpress
[/shell]

3.新サーバへのインポート
 3.1 wordpress 管理画面左部の「ツール」→「インポート」
 3.2 /wordpress/wp-contens/ 配下(plugins, themes など)へアップロード

4.wordpressの設定
 4.1 ブラウザから/wordpress/wp-admin/install.php へアクセスし各種設定入力

こんな感じでしたかね。
というか、いっつも思うんですが、プログラムコードをブログに載せるときはSyntaxHighlighter Evolvedにお世話になってますが、いわゆる.bash_history的なものとかってどうのせたら良いんですかね・・・。rootのプロンプトでコメントアウトされちゃうし。

まったく関係無いけど、最近聴いてる。
来年2月に来日らしいっすよ!

WordPress 2.9.1 (automatically upgrade)

WordPress 2.7を今まで使ってて、特に不便もなかったんだけど、ログインしてみるとダッシュボードに

WordPress 2.9.1 is available!

との文字が。流石に0.2もバージョン空けてしまうのはタコいでしょうということで、アップグレードすることに。とりあえずバックアップを取ってautomatically upgrade しようとするも、

Unable to locate WordPress directory

と言われて、アップグレードに失敗。「これは手動でやれということなのか?」と思ったけども、とりあえずこんな超有名なブログツールなんだから、しかもサーバも超有名なxrea.comなんだから、絶対俺と同じ症状の人おるでしょうということで、調べてみると、WordPressでのFTP設定(自動アップデートとプラグインのため) という情報を発見。

wp-admin/ ディレクトリ直下に、以下の内容の .htaccess ファイルを設置したら、無事automatically upgradeできました〜。

<files async-upload.php>
AddHandler application/x-httpd-phpcgi .php
</files>
<Files plugin-install.php>
AddHandler application/x-httpd-phpcgi .php
</Files>
<Files update.php>
AddHandler application/x-httpd-phpcgi .php
</Files>
<Files update-core.php>
AddHandler application/x-httpd-phpcgi .php
</Files>

というわけでWordPress 2.9.1です。ネクストレヴェル!!

PC間の同期(飲みすぎた日)

普段、

  • ノートPC
  • 研究室のデスクトップPC
  • 自宅のPC

の3つでプログラミングをしているんだけど、PC間の同期がやっぱり面倒だったり。たとえば家にいて、

「こうすればいいじゃん!」

ってアイデアが浮かんで、家のPCでがーっと書いて、うまくいって、喜んで寝て、んで結局そのまま学校に来たり。。

まぁそれはマヌケな例としても・・・。
皆、レポートとかしてたのに、他のPC用にどっかネットワーク上(Webメールサービスとか)に上げとくのを忘れたり、あとUSBメモリに入れたはいういけどUSBメモリ自体を家に忘れたりとかってない??
そういうときメチャクチャいらっと(自分のせいなのに)するし、「いや俺は絶対に忘れないぞ」って人でも、そもそもWebメールとかUSBメモリに移す作業が面倒くさいっすよね。絶対。

なので、Microsoft Live meshというものを最近使い始めました。
これは自分のPCの指定したフォルダを他のPCと同期してくれるサービスで、たとえば、あるPCのマイドキュメントの内容を他のPCでも共有できるというような感じ。
これ、前から名前は聞いてたけど、今回使ってみて結構感動!

感覚的には、「異なる複数のPCが、同じフォルダを覗いてる。」みたいな!どっちから新しくファイルを作ったりしたら、もう一方のPC内のフォルダを見ても、勝手にファイルできてるし!すげー!
ってことで、オススメです。

そんなこんなで、今週は結構開発が進んだ週だった!
あと、無事ACCESSのバイトも継続できる(そのまま就職できないかな。。)ということも決まったし!
というわけで、金曜の夜はIIJM先輩、YNOと3人で飲み。
東方見聞録→HeartBeatとハシゴ。
テキーラ戦争(みんなでオゴり合い)が勃発して死亡。


Widget開発(クリスマス・イブ)

iG:Syntax Hiliter 日本語版の導入・試験も兼ねて。。

前にも書いたとおり、ACCESSが提供しているNetFrontBrowser Widget開発用のJavaScriptライブラリでは、
Widgetを、dock状態、float状態、maximize状態へ遷移させるボタンと、押下時のイベントは
ひとまとまりにdivタグでくくられて出力されている。(ちなみに、「押下」って「おうか」と初見で読めます??)

./access/nfbwdgt.js

[js]
function nfbw_displayModeButton(arg)
{

(中略)

////////////////////////////////
// main
//
eButtons = document.createElement(‘DIV’);
if (arg.idName) {
eButtons.setAttribute(‘id’, arg.idName);
}

eDock = nfbw_createButtonS({‘onclickfunc’:’widget.dock();’,
‘imgName’:arg.buttons.dockImgName,
‘imgWidth’:width,
‘imgHeight’:height,
‘isElement’:true});
eDock.style.position = ‘absolute’;
eDock.style.top = ‘0px’;
eDock.style.left = ‘0px’;

eMini = nfbw_createButtonS({‘onclickfunc’:’widget.restore();’,
‘imgName’:arg.buttons.floatImgName,
‘imgWidth’:width,
‘imgHeight’:height,
‘isElement’:true});
eMini.style.position = ‘absolute’;
eMini.style.top = ‘0px’;
eMini.style.left = width/3 + gaplen + ‘px’;
eMini.style.display = ‘none’;

eMaxi = nfbw_createButtonS({‘onclickfunc’:’widget.maximize();’,
‘imgName’:arg.buttons.maxImgName,
‘imgWidth’:width,
‘imgHeight’:height,
‘isElement’:true});
eMaxi.style.position = ‘absolute’;
eMaxi.style.top = ‘0px’;
eMaxi.style.left = width/3 + gaplen + ‘px’;
[/js]

と、各状態へ遷移させる関数

widget.maximize();
widget.restore();
widget.dock();

onclickイベントに割り当てている。
これだと個別にボタンを作成できないので、
ライブラリに入る手前の段階(つまり、function nfbw_displayModeButton(arg)の呼び出し元)で、
nfbw_createButtonS()によるボタンの作成を行わなければならない。
が、その問題として・・・(続く)

ACCESS社のライブラリを使用したNetFront Widget開発

NetFront Widgetを開発するときの裏ワザとして、ACCESS社が作成したライブラリを入手・使用するというものがある。βバージョンから開発ツールを使用されていた皆さんはすでにご存知かと思われるが、NetFront Widgetはその特徴から半強制的にオープンソースである。というのも、開発ツールによってパッケージングされた.wgtというファイルは、実はindex.html + config.xml + etcをフォルダにまとめ、zip圧縮しただけのものなので、

  1. 公式サイトからダウンロードした.wgtファイルをダウンロード
  2. ファイルの拡張子を.wgtから.zipに変更
  3. .zipファイルの解凍

という作業で、ソースコードが入手可能となる。また、ACCESSが開発したWidget(たとえば、公式サイトにある楽天Widgetなど)を上記の方法で調べてみると、ACCESS独自のJavascriptのライブラリ(./ACCESS/nfbwdgt.js)が用いられていることがわかる。このファイルには、

  • 携帯画面がVGA、QVGAかどうかの判別
  • スクロールバーの作成、制御
  • ウィジェットの各状態間の遷移ボタンの作成

などの機能を実現するソースコードがまとめられているので、参考にされたし。。このライブラリをソフトバンク用のウィジェットの開発にも用いることができれば便利だと思うけれど、今のところウィルコム用のものとの仕様の違いで、なかなか上手く機能を流用できない。たとえば、ソフトバンク用ウィジェットには、そもそもdock状態などがないため、function nfbw_displayModeButton(arg)などで、

[javascript]
eButtons = document.createElement(‘DIV’);
if (arg.idName) {
    eButtons.setAttribute(‘id’, arg.idName);
}
eDock = nfbw_createButtonS({‘onclickfunc’:’widget.dock();’,
                        ’imgName’:arg.buttons.dockImgName,
                        ’imgWidth’:width,
                        ’imgHeight’:height,
                        ’isElement’:true});
eDock.style.position = ‘absolute’;
eDock.style.top = ‘0px’;
eDock.style.left = ‘0px’;
eMini = nfbw_createButtonS({‘onclickfunc’:’widget.restore();’,
                        ’imgName’:arg.buttons.floatImgName,
                        ’imgWidth’:width,
                        ’imgHeight’:height,
                        ’isElement’:true});
eMini.style.position = ‘absolute’;
eMini.style.top = ‘0px’;
eMini.style.left = width/3 + gaplen + ‘px’;
eMini.style.display = ‘none’;
eMaxi = nfbw_createButtonS({‘onclickfunc’:’widget.maximize();’,
                        ’imgName’:arg.buttons.maxImgName,
                        ’imgWidth’:width,
                        ’imgHeight’:height,
                        ’isElement’:true});
eMaxi.style.position = ‘absolute’;
eMaxi.style.top = ‘0px’;
eMaxi.style.left = width/3 + gaplen + ‘px’;
eButtons.style.width = width/3 * 2 + gaplen + ‘px’;
eButtons.appendChild(eDock);
eButtons.appendChild(eMini);
eButtons.appendChild(eMaxi);[/javascript]
と、最小化、最大化、float化させるボタンをひとまとめにDIV要素としているところあたりは若干の修正が必要となる気がする。というか、このライブラリ自体、はなっから絶対にウィルコム端末だけのことを考えて作ってるだろ、と。。(もしくはソフトバンク端末とこんんだけ仕様が違ってくるとは思ってなかったか。)というわけで、ここらへんを修正し、ソフトバンクモバイル用にウィジェット開発用のライブラリを作成できたらなーと思っております。

HPデザイン

研究室の外向けのサイトをリニューアルするにあたって、国内外の色々なサイトを見てみた。一応、条件としては、

  • ページ上部にメニューがある
  • 2カラム以下(3カラムでもしつこくなければ・・・)
  • 文字が見やすい

である。フォントに着目すると、

http://firefox.geckodev.org/

ここが好き。文字が大きいし、フォントも非常に見やすい。なんか半角文字と全角文字のバランスもいいような気がするし、もしかしたら文字が大きいので一行に含まれる文字数が少なく、視点の移動距離が少なくていいのかも。あと、デザインで言えば、

http://www.oswd.org/design/preview/id/3210

http://www.freecsstemplates.org/preview/rational

http://www.opendesigns.org/preview/?template=288

http://www.opendesigns.org/preview/?template=298

http://www.ee.t.u-tokyo.ac.jp/ 

ここら辺が好き。英語ばかりなので、いまいち日本語のイメージがわかないけど、そこは上記の「firefoxまとめサイト」の日本語フォントで補間してみると、あんがいしっくりきそうな気がする。