HTML 形式のファイルを編集するための設定

Last Updated at $Date: 2005/12/04 03:18:00 $.

私は,HTML 形式のファイルを編集するために yahtml-mode を利用しています.ここでは,その yahtml-mode の設定と Tips について解説します.


yahtml-mode って何?

yahtml-mode は,『野鳥 (YaTeX)』に附属している HTML ファイルの編集を支援するメジャーモードです. yatex-mode を使いなれている人が使うと共通点が多いので快適に使えます.

『野鳥』については, 「野鳥ワールド」のページが, 大変参考になります.このページでは,インストール方法などについても解説されています.


改行キーでオートインデント

改行キーで自動的にインデントしてほしい場合,変数 indent-line-function を設定し,改行キーのキーバインドを変更します. 以下のコードを ~/.emacs に追加してください.

(add-hook 'yahtml-mode-hook
	  (lambda ()
	    (setq indent-line-function 'yahtml-indent-line)
	    (define-key yahtml-mode-map "\C-m" 'reindent-then-newline-and-indent)))

ただし,この設定を行うと,単なる改行のみを行うキーがなくなってしまいますので, デフォルトの状態では関数 newline-and-indent にバインドされていた Ctrl-J を関数 newline にバインドしておくことをお勧めします. 具体的には,「改行キーでオートインデントさせる」 を見てください.


outline-minor-mode を使う

長めの文章を書く場合,しばしば文の見通しが悪くなって不便です.が, outline-minor-mode を使うと,編集している部分以外の枝葉を取り去っ て表示させたりすることができ,全体の構造が把握しやすくなります.それで, fj.editor.mule に投稿された記事を参考に, outline-minor-mode が使えるようにしてみました.

(add-hook 'yahtml-mode-hook
          (lambda ()
            (make-local-variable 'outline-minor-mode-prefix)
            (setq outline-minor-mode-prefix "\C-c")
            (make-local-variable 'outline-regexp)
            (setq outline-regexp "<h[1-6]>")
            (outline-minor-mode t)))

定型文を使う

新規ファイルを開いた時,<html>…</html> などの定型のタグを毎回入力するのは面倒ですから, 別に用意した定型文を自動的に読み込んでくれると便利です. そのためにはいくつかの方法があります.

変数 yahtml-template-file を使う

定型文を別のファイル(~/html/default.html)に用意しておいて, ~/.emacs に次のように書きます.(ただし, yahtml-template-file がサポートされたのは,1.65 になってからですので,最新の YaTeX に更新する必要があります.)

(setq yahtml-template-file (expand-file-name "~/html/default.html"))

私は,次のような内容の定型文ファイルを使っています.

<!doctype html public \"-//W3C//DTD HTML 4.01 Transitional//EN\">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-2022-JP">
<title></title>
</head>
<body fgcolor="black" bgcolor="#EEEEEE">


</body>
</html>

この方法は単純ですが,その代わり定型ファイルの挿入しかできません. 入力に応じてさまざまなことを行なわせたい場合は,autoinsert を使いましょう.

YaTeX のバージョンが古くて,yahtml-template-file がサポートされていない場合,次のようなコードを ~/.emacs に加えて下さい.

(add-hook 'yahtml-mode-hook
          (lambda ()
            (if (zerop (buffer-size))
                (insert-file-contents
                 (expand-file-name "~/html/default.html")))))
autoinsert を使う

autoinsert を使うと,対話的な骨組みを使った定型文が使えます.

19.34 以前の Emacs/Mule の場合,autoinsert のバージョンが古いので, 対話的な骨組みを持った定型文は使えず,単純な定型ファイルの挿入しか出来ません. その場合の設定例は,こせきさんの I love GNU & Mule のページに書かれています. Emacs/Mule のバージョンは,C-h v emacs-version とすれば確認できます.

次のようなコードを ~/.emacs に加えて下さい.

(require 'autoinsert)
(auto-insert-mode 1)
(setq auto-insert-alist
      (cons
       '(yahtml-mode
         "Input title: " "\
<!doctype html public \"-//W3C//DTD HTML 4.01 Transitional//EN\">
<html lang=\"ja\">
<head>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=ISO-2022-JP\">
<title>" str "</title>
</head>
<body fgcolor=\"black\" bgcolor=\"#EEEEEE\">

<h1>" str "</h1>

" _ "

</body>
</html>
") auto-insert-alist))

この指定では,新規ファイルを開く時に表題を入力すると,自動的に <title>表題</title> を挿入します.

日本語を含んだ HTML ファイルを書く場合,漢字コードとして Shift JIS や EUC を使うと,コード判定に失敗する可能性が高くなるのでよくありません. JIS コードを使い,明示的にコードを指示しておくようにしましょう.

  1. 定型文には,以下の <meta> タグを加えておく.
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-2022-JP">
    
  2. ~/.emacs には,以下の指定を加えておく.
    (setq yahtml-kanji-code 2) ;; 1=Shift JIS, 2=JIS, 3=EUC
    

索引を生成するコマンド

HTML ファイルが長くなってくると,先頭に索引を入れて,見通しを良くしよう とすることがあります.例えば,こんな風に.

<ul>
 <li><a href="#chapter-1">第1章</a>
 <li><a href="#chapter-2">第2章</a>
</ul>
<h2><a name="chapter-1">第1章</a></h2>
<h2><a name="chapter-2">第2章</a></h2>

ところが,このタグをきちんと書くのが結構うっとうしいんですよね…. という訳で,カレントバッファに含まれている <h?><a name="foo">bar</a></h?> 形式のタグを調べて,上記のような索引を生成してくれるコマンドを書いてみました.

このファイルを適当な場所にコピーしてから, 以下の設定を ~/.emacs に追加して下さい.

(autoload 'yahtml-insert-index "yahtml-insert-index" nil t)
(autoload 'yahtml-delete-index "yahtml-insert-index" nil t)
(autoload 'yahtml-update-index "yahtml-insert-index" nil t)
(add-hook 'yahtml-mode-hook
          (lambda ()
            (define-key yahtml-mode-map "\C-ci" 'yahtml-update-index)))

このページの索引は,このコマンドを利用して生成しました.


[Top] / [Emacs Lisp Tips] / [HTML 形式のファイルを編集するための設定]