Blog Archive

生きてます。

なんだかんだ言って、やっぱり投稿が減った原因はTwitterですね。。Twitterの方が、圧倒的に書くのが手軽だし、何か書いた時に貰えるレスポンスが多いし、でBlogをサボってしまっています。良くないですね。別にTwitterで良いじゃん、Blog書かないでも、という考え方もあるのでしょうが、やっぱり良くないと自分は感じていて、というのは、やはり、Twitterというサービスは、Blog以上にリアルタイムのストリーム的な特性が強く、Tweetの内容が、その時自分をフォローしてくれている人にしか届かず、後からその情報を求めてGoogleなどで検索した人に上手く届けることができないのが問題だと思っています。これは、Twitterのサイト構造が、古いTweetを積極的に見せようとしていないということ以上に、140文字という文字数制限が、Tweetのコンテキストを削ぎ落としてしまっており、検索に引っかかりにくくなっているというのがあります。ぼちぼちまた書いて行きたいなぁと思っています。

WordCamp WordCamp Japan » WordCamp Tokyo 2009 開催日決定のお知らせ

おぉ、開催されるんですね。これは是非行きたい。

大晦日企画。hiromasaさんが昔アップされていたエントリに倣いまして、「～のn個のひみつ」。

1. 誰も知らない（といい）が、実は404ページのデザインも作りこんでいる。
2. IE6対策は放棄してしまっている。
3. サイト名の由来はC#のsharpと.net Frameworkの.netである。
4. labという単語は予防線である。実験的なものだから内容に責任は持たないよ―という意味。
5. 実際、SharpLab.の58%は罠でできているらしい。読んでも信じないように。
6. でも何時かはlabの名に恥じない先進的なものもC#で作ってみたいとも思っている。
7. www.sharplab.netには、サイト全体のトップページが用意される予定である。
8. でも予定は未定である。
9. あまり推敲せずにアップするので、日本語がおかしいときがある。
10. そんなエントリを数時間後に直すことがままある。
11. もともとはMovableTypeで構築される予定だった。
12. WordPressの編集画面からのポストは一件もなく、全てWindows Live Writerによる投稿である。
13. Contactページに張り付けられたLive Messengerが活躍したことは今まで一度もない（泣）
14. WordPressにログイン状態で表示すると、「Edit with WLW」というリンクがエントリ毎に表示され、クリックするとWindows Live Writerで当該エントリが開かれるギミックが用意されている。
15. sharplab.netのひみつはまだ14個しかない。

バイトで必要になったので調べた。How to Move WordPress Blog to New Domain or Location » My Digital Lifeというエントリが参考になる。

UPDATE wp_options SET option_value = replace(option_value, 'http://www.old-domain.com', 'http://www.new-domain.com') WHERE option_name = 'home' OR option_name = 'siteurl';

UPDATE wp_posts SET guid = replace(guid, 'http://www.old-domain.com','http://www.new-domain.com');

UPDATE wp_posts SET post_content = replace(post_content, 'http://www.old-domain.com', 'http://www.new-domain.com');

上の三つのようなSQLを発行してデータベース内のURLを書き換えてやれば良いようだ。もちろんWordPressのプラグインが独自のテーブルを持っている場合はそれに対しても対処が必要になるだろう。

• 画像OFFでもいい感じの表示に。
• クレジット関係の明確化
• 印刷用CSS（作業中…。）

Windows Live Writerの新版まだかなー。

ということでそれにぶつける形でサイトのデザインを変えてみた。十代の卒業制作って奴です。
（今考えた。）

ビバ・フルスクラッチ。今回はWordPress＋Windows Live Writerの組み合わせで運用することを前提にフルスクラッチしてみた。念願のsyntaxhighlighterの組み込みも果たし、相当ソースコードを載せるのがやり易くなったのがありがたい。また、可変幅の2コラム構成だが、本文部分の最少幅を指定したことで、写真を貼り易くなったのも結構便利になると思う。

まだ追加しきれていない機能、調整しきれていないCSSの修正などが残っているので、ちょくちょく直していきたい。

前記事・後記事へのリンクとかコメント欄とかトラックバックとかの部分がなんとなく形になってきた。ここら辺はwp.vicunaをちょっと参考に制作。

ソースコードをハイライト表示してくれるので非常に便利なSyntaxHighlighter。JZ5さんがSyntaxHighlighter for Windows Live WriterというプラグインでWLW上でスマートコンテントとして管理できるようにしてくれているので、WLW好きの自分としては是非このBlogにも組み込みたいと思い、作業していたのですが、その中でSyntaxHighlighterの表示の不具合にぶつかりました。今回のエントリではその対応策を記します。

SyntaxHighlighterの持つ問題

SyntaxHighlighterは、通常、一行あたりの文字数が多くSyntaxHighlighterの表示部の横幅を超えるようなソースコードの場合、white-space:normal;の指定により、折り返し表示してくれるようになっています。ですが、半角文字列の折り返しは単語毎に行われるというブラウザの仕様のためか、場合によってはソースコードの折り返しが上手く行われず、横スクロールバーが表示されてしまうという問題があります。そうなると、スクロールした部分は背景の塗り分けが上手く行われず、SSのように違和感のある表示になってしまう、という問題があります。

対応策

上手く折り返し表示させる方法がよく分からなかったので、自分の場合、常に折り返し無しで表示することにしました。そして背景の塗り分け自体も廃し、常時横スクロールバーを表示。また、上のツールメニューもあわせて表示の仕方を変更しました。

長々と言葉で説明しても冗長になるだけなので、SyntaxHighlighterのCSSを上書きするのに使用したCSSファイルを示します。

.dp-highlighter{
	overflow-y:visible;
	overflow-x:scroll;
	background-color:#fcfcfc;
	width:100%;
}
.dp-highlighter ol li,.dp-highlighter ol li.alt{
	background-color:#fcfcfc;
	white-space:pre;
}
.dp-highlighter ol li, .dp-highlighter .columns div, .dp-highlighter .tools {
	border-left:3px solid #e26c6c;
}
.dp-highlighter .tools{
	font-size:120%;
	height:2em;
	padding:0px;
	background-color:#fcfcfc;
}
.dp-highlighter .tools a{
	font-size:100%;
	display:block;
	color:#888888;
	float:left;
	height:1.5em;
	margin:0px;
	padding-top:0.4em;
	padding-bottom:0.1em;
	padding-left:0.5em;
	padding-right:0.5em;
	background-image:url("images/shToolsBG.png");
}
.dp-highlighter .tools a:hover{
	background-image:none;
	background-color:#ffffff;
}
.dp-highlighter ol.dp-c{
	clear:both;
	background-color:#fcfcfc;
}

実際に適用するとこんな感じ。

スクロールさせても崩れてません。

今回は不具合修正をきっかけとして既製のライブラリのCSSの上書きに取り組みましたが、今回のツールメニューや左ボーダーの変更のように、単なるデザインの変更にも使えるので、結構ブラックボックス化しがちなライブラリのデザインを、サイトのデザインと調和させる目的でも色々弄ってみてはいかがでしょうか。

追記

このCSSは桁の表示には未対応です。まぁ全角文字が含まれているとどうせズレが生じるし、放置で良いかな･･･。

すすまない…。とりあえずフッタとか。 月末までに間に合うのだろうか…。

サイドバーの形が見えてきた。意外とここは順調。