縦書きエンジン「涅槃」について-#2

投稿アップデート情報  追記(11/5) 追記2(2014/6/10) 追記3(2016/5/18)

ヘビさん1
ヘビさん1
ヘビさん2
ヘビさん2
 本題に入る前に,久しぶりに坪でヘビさんを見たので,アップ。今年の正月に書いたように,実は,ヘビは苦手。しかし,本日撮影していて,なかなかかわいい目をしているな,と感じてしまった(汗ッ)。

 朝洗濯した夏蒲団を,しっかり乾かすために日向に干していたが,もうすっかり乾いたのでいれたあと,竿をしまおうと井戸のところに運んで,梁に手をかけたのだが,まさにそこに奴はいた。危うく触るところだったよー,ウウーッ。これ,青大将くんダヨネ。

 我が家は,もともとはヘビの多いうちで,その代わりにネズミを見たことがなかった。庭に弁財天があるんだけど,白蛇を祭ってるらしいし。しかし,このごろあまり見かけない。彼らも暮らしにくい世になったのかなあ。

 さて,本題。
 先日,「涅槃」のバージョンが上がっているのに気づいた。はてなに移られた「縦書き文庫 (id:convertical)」さんが,新しいバージョンについて使い方「縦書き、横書き自由自在! あなたのブログをページ送りで表示させる最も簡単な方法」を書いておられたので,早速アップデートにかかったのだが,いやー,てこずったてこずった。

 もっとも,てこずったのは,前バージョンで我が家用にカスタマイズしていたところのうちのひとつだけ,なのであるが……

 他のところは,上のリンクの説明どおりでまったく問題なかった。

 何はともあれ,各ページが縦書きになるように, <meta http-equiv=”Content-Type” content=”text/html;charset=UTF-8″ /> の直後に,以下のコードをコピペ。
————————————————————————————————————————————————-
<link charset=”utf-8″ rel=”stylesheet” type=”text/css” href=”//nehan.googlecode.com/hg/nehan4.css” />
<link charset=”utf-8″ rel=”stylesheet” type=”text/css” href=”//nehan.googlecode.com/hg/jquery.nehan.css” />
<script type=”text/javascript” src=”//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js”></script>
<script charset=”utf-8″ type=”text/javascript”
src=”//nehan.googlecode.com/hg/nehan4.min.js”></script>
<script charset=”utf-8″ type=”text/javascript”
src=”//nehan.googlecode.com/hg/jquery.nehan.min.js”></script>
<script type=”text/javascript”>
$(function(){
 $(“.nehan-book”).nehan({
  usePager:true, // falseにするとページャーなしで多段組
  direction:”vert”, // 横書きなら “hori”
  fontSize:16,
  width:600,  <<—- 800 に変更
  height:400,  <<—- 500 に変更
  rowCount:1, // 2段組がよければ2にする
  colCount:1, // 見開きがよければ2にする
  readerElements:[“screen”, “pager”], // ページャーを先にしたければ逆順に
  // より軽いページ送りがよければこっち
  //pagerElements:[“left-next”, “right-prev”, “progress”]
  pagerElements:[“left-next”, “indicator”, “right-prev”]
 });
});
</script>
————————————————————————————————————————————————-
 さらに,縦書きにしたいところを, <div class=”nehan-book”>~</div> で囲う。

 変えたのは, width と height だけ。まあ,このままだと,縦書きページが左によってしまうから,中央に来るように <table style=”margin: auto;”> は入れたけど。

 で,うまくいかなかったことの話。
 <icon> タグの仕様が変わったか無くなったかのようで,これを使っていた「⦅」「⦆」の表示がどうしてもうまくいかなかった。

 「⦅」「⦆」は JIS X 0213 に含まれていて,旧いブラウザ (OSも絡むと思う) で表示できないので,画像を使っていたのだが,時代の流れでもあるし,この際,旧いブラウザは見捨てることにした(汗+爆)。
 nehan4.css を調べてみると,90°回転について
          .nehan-rotate-90{
           word-break:normal;
           overflow:visible;
           -webkit-transform : rotate(90deg);
           -webkit-transform-origin : 50% 50%;
           -moz-transform : rotate(90deg);
           -moz-transform-origin : 50% 50%;
           -o-transform : rotate(90deg);
           -o-transform-origin : 50% 50%;
           transform : rotate(90deg);
           transform-origin : 50% 50%;
          }
となっている。で,どの文字を回すかは nehan4.min.js の中でやってくれているようなのだが,当然ながら,「⦅」「⦆」については nehan の考慮に入っていないから回してくれない。というわけで, nehan-rotate-90 を手差しで必要箇所に挿入した。

 それから,「ヰ」と「阿」を小文字として使えるように, custom.css を作り,もともとある2枚の css の直下に,以下を追加。
<link charset=”utf-8″ rel=”stylesheet” type=”text/css” href=”//o6asan.com/~/custom.css” />

 custom.css の中身は,次の通り。
          .nehan-small{
           font-size: 60%;
          }
 たったこれだけだから,わざわざ custom.css にするほどでもないのだが,どこをカスタマイズしたかを忘れる可能性があるので, custom.css は一種の備忘録だ。

 まっ,こんなとこ。

追記(11/5):
 縦書き集の紹介入れるのを忘れてた。お暇なら,覗いてみてください。

追記2(2014/6/1) :
 nehan5 について,「縦書きエンジン「涅槃」について-#3」を書いた。

追記3(2016/5/18) :
 縦書き文庫さんの GitHub のリポの「nehan-book」利用方法について記事を書いた。

「縦書きエンジン「涅槃」について-#2」への12件のフィードバック

  1. o6asanさん こんばんは。

    いつも有難う御座います。

    本題は私には難しく・・・。

    ヘビさんは私も苦手でして、先日も畔にニョロっと居たのを踏み掛けましてドキッと。(汗)
    ”早いこと寝んとあかんよー”と声掛けしときました。(笑)
    ウチの農小屋にも住んでいるようで袴がありましたよ。

    1. FHさん,こんばんは。

      いえ,こちらこそ,いつもお世話になりまして。

      ヘビさんはねぇ。ほんと,苦手なんですよ。子供のころは,カマキリさんとか,カエルさんとか,果てはクモさんまで,飼ってたことがあるんですけど(爆)。しかし,今回デジカメに納めたときに,かわいい目をしているな,と思ったのも事実でして。ある意味,鳥さんよりやさし気かもしれません。

      先日のヘビさんは,何していたんでしょうねぇ。火曜日は結構暖かだったんで,英気を養っていたのかもしれません。もしかしたら,何か獲物を狙っていたのを,私が邪魔してしまったのかもしれないなぁ,と気になっています。じーっと,してましたもんね,梁の上で。冬眠前の大事な狩りだったのかもしれないですね。

      そういえば,ヘビさんの抜け殻も最近見ませんです。子供のころ,よその小母さんがお財布に入れたりしてましたっけ。

  2. お世話になります。涅槃3を紹介しているページを作っているのですが、バージョンアップしているのを見つけて、こちらのサイトを参考にしようと思いましたが、コピペ対応しても全く動きません。
    http://jump-up.info/site_customize/wordpress_homepage_customize_nehan.html
    こちらで涅槃3で縦書き表示を見せているのですが、ヘッダー部分をそのまま丸々コピペで変更し、実際の縦書き部分をバージョン3で利用していたpreタグからやはり、こちらの記事を参考にdivタグに変更したのですが、うまくいきません。
    wordpressサイトなので、Jqueryプラグインのかぶりの問題とかもあるかと思い、単純なページを1枚作って試してみたのですが、どうもうまくいきません・・・
    デモサイトとか見せて頂けるとソースが参考になるんですが・・・一体何がおかしいのか・・・
    いやなんか愚痴になってしまって申し訳ありません。
    失礼いたします。

    1. jump-up さん,こんばんは。

      > preタグから

      preタグ,なくなっちゃったみたいですね。

      もう解決されたかもしれませんが,テーマが,Supernovaみたいだったので,バージョン 1.4.3を入れて,テストサイトで試してみました。大丈夫みたいです。
      header.phpはこんな風に,本文部分についてはこんな風にしています。

      追記:
      うちのブラウザでは,header.txt,honbun.txtともに,開いたときに文字化けします。そういう場合は,UTF-8で開きなおしてください。

  3. ありがとうございます!!!まだ詳しく見てないんですが、実は今もあれやこれややってて駄目でちょっと休憩でこちらのサイトをのぞきましたあああああw
    わざわざ私のテーマで試してみていただいてありがとうございます!!!早速、やってみます!!!また夜にでも結果報告します。それでは失礼いたします^^

  4. お世話様です。無事できました!!!ありがとうございました。
    何がおかしかったかというと、header.phpで以前のnehan3と同じ場所に設置していたためだめだったようです。Jqueryプラグインはどちらかというとヘッダーの出来る限り下部が良いという常識に囚われ、UTF-8文字コードセットの直下にとわざわざ説明して頂いているにもかかわらず、通常のようにTitleよりも下の部分に設置していました。たったこれだけで、また、何故なのか理由もよくわからないのですが、とりあえず、ばっちりできました!!!重要ですね、文字コードセット直下というのは!!!また機会がありましたらよろしくお願いします。早速、涅槃4で記事をあげとこうと思います。(非公開で縦書きで文章綴ったりしてたのでほんと助かりました!!!)

  5. 何度もすみません。ちょっと別件ですが、このコメント欄に続けて書かせてもらいます。申し訳ありません。
    ご承知のとおりSupernovaのテーマを利用してまして、日本語化したいと思い、languagesフォルダを見ると、default.po/moファイルがあり、言語を変えたければ直接上書きしてよみたいなtextがあったので、テキストエディターで直接上書きしてpoeditで保存しなおして、出来上がったpo/moファイルをアップロードしてみたのですが、うまくいきませんでした。text domainが指定されていないみたいですが、po/moファイルが用意されているので、msgid側を無理やり日本語にしたらいけるのかなと思ったのですが、駄目でした。
    ブログを拝見すると日本語化などもやっておられるみたいでしたので、質問させて頂きました。
    このテーマだとlocalizationで色々難しいことを説明しているようなことをやらないと無理なんでしょうか?ちょっと私には難易度が高くて・・・
    すみません、変な質問して。ありがとうございました。

    1. こんばんは。おめでとうございます。よかったです。

      > Jqueryプラグインはどちらかというとヘッダーの出来る限り下部が良いという常識

      そうなんですよね。しかし,タイトルタグより下に入れると働かないとは,驚きですね。知りませんでした。 nehan の場合,なにか特殊なものがあるのでしょうか。

      Supernova を見てみました。text domainが指定はされていますが, functions.php の中にある load_theme_textdomain( ‘Supernova’, SUPERNOVA_ROOT.’/languages/’ ); の SUPERNOVA_ROOT の定義が抜けているようで, /languages/ を読みに行ってくれていません。 SUPERNOVA_ROOT を手っ取り早く, dirname(__FILE__) に変えてやれば,作成した ja.mo (ファイル名はこれでないと読んでくれません)を読みに行きますが,バージョンアップのことなどを考えると,作者に連絡してあげておいたほうが親切かもしれませんネ。

  6. ありがとうございます!!!
    作者とは何度もやり取りしてますが、流石にこれは英語が難しそうwwwです!とはいえ、チャレンジしてみます。
    本当にお世話になりました。私も修羅の国(北九州ですが)です。
    大学では6年ほど六本松におりました。今はキャンパスのかけらも無いみたいですが・・・・
    失礼します。

    1. お役に立てて,幸いです。

      > 今はキャンパスのかけらも無いみたいですが・・・・
      誰も賛成しなかったように思いますが,結局なくなってしまったようですね。

      修羅の国ですかwww。学生時代は東京にいましたが,本当のところ,大都会のほうがずっと危ないです。しかし,田舎は一度危険だという噂が立ってしまうと,立ち直れませんです。もっとも,福岡市や北九州市を,田舎とは言いづらいですが……私は,福岡といっても,ずーっと田舎の出です (^_^;)。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください