livedoor Readerの表示を左右逆にするuserCSS

作成者:mattz 作成日:2011/04/19(火) 10:41

個人的に「右側にメニュー類」が好きなんですよね。Windowsのタスクバーも、Operaのタブバーも(今は使ってないけどパネル使うときはパネルも)全部右に配置してるし。
自己分析すると、日本語(以外の多くの言語もそうですが)はltr(左から右に書かれる)なので、多くの場合文章のかたまりはブロックの中の左側に寄ります。で、この時に左側がメニューだとごちゃごちゃしたものが目に入るのが気が散って嫌なんだと思います。

それなりに理由はあるんだと思うんですが、PC関係は左側にメニュー類が配置されているものが多いです。livedoor Readerもツリービュー?が左で、メインの表示領域が右という配置で、まぁ、特に何も考えずにこれまでずっと使ってきたんですが、昨夜急にそれが気になりだしてしまったのでuserCSSを書いてみました。

@charset 'utf-8';
/* 配置を逆に */
#left_container{
  float:right !important;
  width:250px !important;
  position:absolute !important;
  right:0 !important;
  left:auto !important;
}
#right_container{
  float:left !important;
  width:auto !important;
  position:absolute !important;
  right:250px !important;
  left:0 !important;
}
/* ツリービュー?のスクロールバーを右にする為に */
#subs_container{
  direction:ltr !important;
}

D6to7

作成者:mattz 作成日:2011/04/14(木) 14:48

このサイトのCMSをDrupal 6から新しいバージョンであるDrupal 7に移行しようと奮闘中です(というこのエントリは、構築中の7側にしか投稿しません)。

ついでなので、いまいち重くて使いづらかったさくらの共用MySQLをやめ、Drupalが7から新たに対応するようになった、sqliteにしちゃおうかと思っています、というかしました。DBの種類が変わるということで、DrupalのUpgrade機能に頼れませんので、データの移行のほとんどが半分手作業です。でまぁ、どんなことをやったかという辺りの覚え書きです。

sqliteに変えようと決めて、実際にその作業を今まさに行っているところではありますが、一応、MySQLのままのUpgradeにも挑戦してはいます。まぁ、うまくいかなくて諦めたんですけどね。あと、結構めんどくさい。

DrupalのUpgradeは、簡単にまとめるとモジュールやテーマなどの設定をいったん初期状態に戻し、更新を適用し、モジュールやテーマの設定を元に戻す、ってのが正しい手順です。が、セキュリティフィックスとかの(小数点第2位)のマイナーバージョンアップであれば、初期状態の戻すの手順は、まぁ省略しても大体うまく行くもので、実際、最初にセットアップしたのが6.11で、その後の6での最新版6.20まで、9回の更新を一度も飛ばさずに行いましたが、初期状態に戻すって、真面目にやってたの最初の2回くらいです(もちろん、個人ブログだからできることであって、商用サイトではそうはいかないでしょうけど)。

とはいえ6を7に、となるとさすがにそのやり方では無理なので、6で使ってるテーブルを、全て別名でコピーし、まずそちらに向けてDrupal6を構築し、そこでDrupalを7に更新、うまく行ったら、サーバ側の設定でそちらに向ける、なんてことを目論んで何度か試したのですが、全然うまくいきゃしねぇ。

そんな訳で、sqliteでDrupal 7をさくらインターネットのスタンダードプランで構築する場合のメモです。

大筋としては、「さくらインターネットサーバでDrupal 6.11を導入した」でやったことと同じですが、今回は./sites/default/settings.php ではなく、 /sites/[FQDN]/settings.phpに設定情報を書いています。この方があとで何かと便利なので。

あとsqliteですが、DrupalのDB設定は

$databases['default']['default'] = array(
'driver' => 'sqlite',
'database' => '/path/to/databasefilename',
);

こんな感じで記述する(もうちょっと細かく設定できるけどそこまでやるほどのものでもないので)のですが、databasefilenameは事前に作っておいたりする必要はありません。install.phpにアクセスした時点で勝手に作られます。ただし、次の画面に進む前に、databasefilenameに書き込み権限を付与しましょう。これが分からなくて何回もやり直しました。なおこのファイルは、念のため公開ディレクトリ(さくらなら~/www)の外に置きましょう。

モジュールとかテーマとかは、7に対応しているものとそうでないものが結構バラバラです。うちの場合、tagadelicとかtrackbackモジュール(とか自作のモジュール)が未対応なので、タグクラウドとかトラックバックとかカレンダー表示とか個別エントリ表示時の前/次リンクあたりが、今のところありません。

データ(各nodeの中身とか)の移行については多分別エントリで。

なんにせよ、こんな作業、仕事だったらやってらんね。

TwitterのパーマリンクURLにおけるスクリーンネームの意味のなさについて

作成者:mattz 作成日:2011/04/06(水) 17:25

どういう事かというと

http://twitter.com/MATSUO_Tetsuji/statuses/55477380877262848

http://twitter.com/-/statuses/55477380877262848

http://twitter.com/ikedanob/statuses/55477380877262848

こういうことです。

なお、3つめの例に他意はございません。

以前、Twitterを火元に炎上した事案におきまして、某まとめブログが火元ツイートのURLを伏せたつもりで、http://twitter.com/*hoge/statuses/55477380877262848 みたいに伏字っぽくして紹介してたんだけど、アクセスしたら普通に見られんじゃん、ってことで、あぁここ(URL中のscreen name部分)の文字は何でもいいのね、ってのに気づいた。

そのまとめブログも知っててやったのかもしれないけどね。

Google検索のサイドバーに3ヶ月以内と6ヶ月以内の結果へのリンクを追加するuser.js

作成者:mattz 作成日:2011/04/06(水) 11:07

http://d.hatena.ne.jp/mono-hate/20110405/1302015546 を読んで、コメントもして、ついでなので作った。色々ツメが甘いけど、それはいつものことなので気にしないで公開する。後悔はしない。

自分の環境でしか確認してないので、他人様の環境ではちゃんと動かないかもしれませんが、そもそも「Googleの検索結果ページ」って一口に言っても人によって違うもの見てると思うし、あくまで僕の環境に最適化したものしか作る気はないです。ごめんなさい。

// ==UserScript==
// @name          mod-google-search-result
// @author        mattz
// @namespace     http://mattz.xii.jp
// @license       public domain
// @description   add link to qdr=m3 and qdr=m6 on side-bar
// @published     2011-04-06
// @version       0.0.1
// @include       http://www.google.com/search?*
// @include       http://www.google.co.jp/search?*
// ==/UserScript==
(function(){
  var create_qdr = function(m) {
    var ml = document.createElement('li');
    ml.setAttribute('class', 'tbou');
    ml.id = 'qdr_m' + m;
    var a = document.createElement('a');
    a.href = location.href.replace(/[&\?](tbs|as_qdr)=[^&]*/, '') + '&as_qdr=m' + m;
    a.appendChild(document.createTextNode(m + 'か月以内'));
    ml.appendChild(a);
    return ml;
  }
  var init_qdr = function() {
    var std = document.querySelector('#qdr_m6');
    if (! std) std = document.querySelector('#qdr_y');
    if (! std) return false;
    if (! document.querySelector('#qdr_m3')) {
      std.parentNode.insertBefore(create_qdr(3), std);
    }
    if (! document.querySelector('#qdr_m6')) {
      std.parentNode.insertBefore(create_qdr(6), std);
    }
  }
  window.addEventListener('DOMContentLoaded', init_qdr, false);
})();

ちなみに見た目はこんな感じになります。

※リンクにdottedな下線が入っているのはuserCSSによるものです。

「LDRにブックマーク数を表示するスクリプト」を改造する

作成者:mattz 作成日:2011/03/30(水) 17:29

takefさんのLDRにブックマーク数を表示するスクリプトをここ半年くらい使っていたのだけど、「s」で読みすすめている分にはいいのだけど、「a」で戻ったりするとブックマーク数アイコンが二重に表示されて微妙に気持ち悪いので、ちょこっと改変。ついでなので、主に利用しているlivedoor clipも表示するように。

// ==UserScript==
// @include       http://reader.livedoor.com/reader/*
// ==/UserScript==
(function () {
  var entryurl = "http://b.hatena.ne.jp/entry/";
  var apiurl = "http://b.hatena.ne.jp/entry/image/";
  var entryurl2 = "http://clip.livedoor.com/page/";
  var apiurl2 = "http://image.clip.livedoor.com/counter/";
  register_hook('before_printfeed', function(feed) {
    var items = feed['items'];
    var len = items.length;
    for (var i = 0; i < len; i++) {
      var item = items[i];
      var url = item['link'].replace('#', '%23');
      if(! item['title'].match(/<a href=/)) {
        item['title'] += '<a href="' + entryurl + url + '"><img src="' + apiurl + url + '"></a>';
        item['title'] += '<a href="' + entryurl2 + url + '"><img src="' + apiurl2 + url + '"></a>';
      }
    }
  });
})();

短縮する必要のないところでまでURL短縮するのやめませんか?

作成者:mattz 作成日:2011/03/09(水) 19:37

Twitterみたいな入力できる文字数制限がきついところでは仕方がない部分もあるけど、ブログの本文とかでまでどうして短縮するの?

なんか、短縮URLの後ろに+付けると、簡易アクセス解析できるよ、みたいな記事も見たけど、それ、君の都合だよね?

リンク先のURLって、まぁ、実際ろくに観てない人の方が多いかもしれない。僕だって毎回毎回リンククリックする前にwhoisするわけじゃないし、あんまり考えないでクリックしちゃうこともないわけじゃない。けど、やっぱり出来ればクリックする前に確認したいよね。リンク先がなんなのか。どこなのか。

っていうようなことを書こうとして、「短縮URLで検索」して結果を眺めてみたけど、なんかもう呆れた。ますます短縮URLが信用できなくなった。今後、ブログの本文で無駄に短縮URL使うブログは全部他人を騙そうとしてると思うことにする。

twicli(のようなページ)のuserスタイルシートの作り方

作成者:mattz 作成日:2011/03/08(火) 14:20

「twicli スタイルシート」みたいなフレーズで検索をしてくる人が結構多くて、特に何も考えずに、参考になればいいねぇ、とか思ってたんだけど、ふと 気づいた。

twicliは、ほとんどの要素をJavaScriptで描画しているので、普通に「ソースを見る」ってやっても、今見えている画面のどの部分がなんていう名前(要素 名とかclassとかidとか)なのか分からないから、そういう事を知りたいのかなぁって。

検索しても実際のCSSのサンプルはたくさん出てくるけど、↑みたいなことがまとまってるところはあまり見かけません。

最近はTwitterもそうですけど、そういうサイト増えてます。その手のサイトのuserスタイルシートをどうやって書くのか書いときますね。

実は難しいことは何も無いです。OperaだったらDragonflyとか、FirefoxだったらFirebugとか、Chromeだったらデベロッパーコンソールとか、IEだったら開発者ツールとか使いましょう。

それぞれのツールの使い方はご自分で調べてください。

終わり。

たむらぱん「パンダフルツアー」を見てきました。

作成者:mattz 作成日:2011/03/07(月) 09:43

まずは、いつものsakusakuさんからのお花紹介。

今回のパンダフルツアー、僕は初日の代官山UNITにも行っているので2回目です。伝聞ですがここまで6ヶ所の公演は、曲目は同じでも結構構成を変えてきているらしいとのこと。また、事前に公式ブログでサプライズもあるよ、と書かれていましたので、2回目とはいえかなり楽しみにしていました。

曲目は、最新アルバム「ナクナイ」収録曲をメインにしたラインナップ。ちゃんとしたセットリストはそのうちどっかに出るでしょうからお探しください。僕は全部は覚えてないんで。

僕のたむらぱんライブ参戦は今回で5回目。昨年9月の「SOSOSOS」の時からバンド編成に、キーボードのエマーソン北村さんとコーラスの加藤哉子さんとい うお二方が加わったのですが、これは僕のようなど素人の1ファンが言うのもおこがましいですが、本当に大正解だと思います。すごく深みが出ましたし、 以前からいるメンバーの方たちにもすごく刺激になっている気がします。

なんかいろいろ言いたいことはあるんですが、昨日のステージは、僕が観た中では最高のパフォーマンスでした。初日のUNITも楽しかったですけど、それ以上でした。周りの観客のノリも結構良かった。演る方も観る方もだんだん間合いが掴めてきたって感じ。

ちなみに会場の恵比寿LIQUIDROOM[リキッドルーム]、Wikipediaによれば収容人数は約1,000人って書いてありますね。大きく見えたけどO-Eastよりは少し小さいのか。ざっと見わたした限り、いっぱいになってましたね。

ただ、ちょっと音が大きかったかのなぁ。スピーカの直前という場所もよくなかったんでしょうけど、音酔いしちゃってライブ終盤はかなり気分悪かった。あと、これは音量のせいかどうか知らないけど、倒れちゃった方もいるみたいですね。僕も実は危なかった。翌日の今も全体的な体調はほぼ戻りましたが、耳だけはまだ不調。イヤホンで音楽聞いてると変な雑音が混じるので休ませてます。

あ、サプライズは、5月に発売の新曲「でんわ」の初披露と、7月のワンマンライブについての発表でした。僕はもうチケット取りました。場所は同じ恵比寿LIQUIDROOM。今回の反省を元に、もうちょっといい音で聴けるポジションを取ろうと思います。

前にも同じようなことをやったけどまたやってみよう

作成者:mattz 作成日:2011/02/10(木) 13:48

前にやった同じようなこと

以下、全ての項目は、「あ~刺さる! 「金麦のCM」風、男の胸を貫くオンナの行動12! | Menjoy! メンジョイ」からの引用。ちなみに僕は金麦のCM(で描かれる女性像)は大嫌いである。おかげで檀れいまで嫌いになりそうである。

■男性の洋服のすそを持って引っ張る
恥じらいからくる表象、としてはありかもしれないけど、伸びたり、服の形が崩れたりするのでやめてもらいたい。
■くしゃみをするとき「くちゅん」
大きくくしゃみしたらみっともないからせめて音を小さくしようとして結果としてこうなる、ならセーフ。でも、別にこれで萌えたりはしない。
■待ち合わせ場所に小走りで到着
これは認める。遅刻じゃないのなら。
■歩いてるときにしょっちゅうつまずく
別に。運動不足じゃね?
■熱いものを”ふぅふぅ”して食べる
分からない。熱くて食べられなきゃするでしょ、としか。
■怒ったとき、ほっぺをふくらませる
NG。
■ジャムの蓋などは自分で開かず、開けてもらう
分からない。開けられなかったら開けられそうな人に頼む。当たり前。
■高いところにあるものを必死で取ろうとするも、取れず男にやってもらう
多分NG。「特に必死に取ろうとするも」の所に、アピールが透けて見えていやだ。
■うれしいことを言われたら、顔の前で小さく拍手する
このような人は見たことがないが、多分特になんとも思わないのではないだろうかと思う。
■考えごとをするときは顔を斜めに傾けて、指を口元にあてる
NG。
■階段で最後の一段はジャンプして降りる
しょっちゅつまづくようなひとはこういうことをしてはいけません。
■バッティングセンターで突如ヒールを脱いで打ち始める
とっさに思い浮かべたのが山口智子。なんでだろね?ま、でも別にキュンとはしない。

理由も書かずにただNGと書いた項目についてですが、要するに「演技」が透けて見えるのです。例えば怒ったとき、ほっぺをふくらませるなんて、 演技じゃなく素でこんなことする人がいるのなら是非お目にかかりたい。いるならば「NG」という意見は引っ込めてもいい。

なんにせよ、あまり共感はできない記事でした。

rel='next'なlink要素を強制的に付加するuser.js

作成者:mattz 作成日:2011/01/07(金) 17:37

Operaにはfastforwardという素敵な機能があって、真っ当なつくりのページであればこれで事足りるのですが、世の中真っ当なつくりのページというのはなかなかございませんもので、このようなものを作りました。

もちろん、extreme-fast-forward.jsなんていうものが既にあるこ とは百も承知なのですが、oAutoPagerizeが好みではないもので、SITEINFOとか導入してませんし。

やってることは、rel='next'なlink要素がない場合は、ページ内のリンクから次っぽいリンクを見つけて(※)、そのリンク先URLをnextページとしてrel='next'なlink要素を付加するというものです。

※ちなみにa要素のinnerTextに「次」とか「つぎ」とか「Next」があればそのリンクは次のページへのリンクであろう、とか、a要素のinnerTextがなくて、a要素の中身が画像であってそのalt属性に「次」とか「つぎ」とか「Next」とかあるならそのリンクは次のページへのリンクであろう、みたいなやり方です。

副作用として次原隆二みたいなリンクに反応しちゃうことがありますが、まぁ大体うまくいっています。よろしければご利用下さい。

// ==UserScript==
// ==/UserScript==
(function (){
  var makeNextrel = function(url) {
    var n = document.createElement('link');
    n.rel = 'Next';
    n.href = url;
    document.querySelector('head').appendChild(n);
    return false;
  }
  var regexpnext = new RegExp(/(次|つぎ)( ?|[のへ])|next|[Nn][Ee][Xx][Tt])/i);
  window.addEventListener(
    'DOMContentLoaded',
    function(){
      var needsNext = true;
      var links = document.querySelectorAll('link');
      var i;
      for(i = 0; i 
var regexpnext = new RegExp(/(次|つぎ)( ?|[のへ])|next|[Nn][Ee][Xx][Tt])/i);

のところをお好みの正規表現に変えてあげれば、これでうまく行かないページでもどうにかなるはずですが、正規表現なんか知らんという方はご相談下さい。

ページ