SimpleBoxes

mi with sbHTML [チュートリアル]

私はmiというテキストエディタを愛用しています。

私はmi α版を使っています。α版と言っても、当方の環境では、きわめて安定して動作しています。

ここで配布しているsbHTMLというmi用のモードファイルについて簡単なチュートリアルをご紹介します。

sbHTMLのインストール

miのモードファイルのインストールは実に簡単です。

  1. ダウンロードしたsbhtml.sitを解凍します。
  2. miを立ち上げて、アプリケーションメニュー→「新規モード(インポート)...」を選択します。[図1]
  3. モードファイル「sbHTML」を選択します。[図2]
  4. 新規モード追加確認ダイアログが表示されるので、適当なモード名を入力します。[図3]

アプリケーションメニューは、リンゴマークのアップルメニューの隣にある「mi」と書かれたメニューです。

新規ファイル

sbHTMLモードを追加すると、ファイルメニュー→「新規」に「sbHTML」が追加されます。[図4]

ファイルメニュー→「新規」→「sbHTML」を選択して新規ウィンドウを開きます。[図5]

開いたウィンドウで「sbHTML」モードが選択されていることを確認して下さい。設定メニュー→「モード」あるいはツールバーで確認できます。

テンプレートの挿入と編集

sbHTMLモードには予めテンプレートが設定されています。

command+0(ゼロ)キーあるいはツールメニュー→「S 文書構造」→「N 基本構造 XHTML11」でテンプレートを挿入します。[図6]

テンプレートには基本的なmeta要素が設定されています。スタイルシートやスクリプトのアドレスがxxxxxxxxxxxxxxxxxと設定されていますが、これはダブルクリックで容易に選択できるようにするためです。[図7]

miではツールの内容を簡単にその場で編集する機能がついています。これを利用することで簡単にツールの内容をカスタマイズできます。

ツールメニュー→「S 文書構造」→「N 基本構造 XHTML11」をoptionキーを押しながら選択して下さい

別ウィンドウあるいは別タブでそのツールの内容が表示されるはずです。[図8]

その場で編集して保存すれば、次からは編集したテンプレートが利用できます。ツールの内容が気に入らなければ、どんどんカスタマイズしてしまいましょう。

マークアップ操作

sbHTMLモードのツールには、基本的な要素が予め定義されています。

例えば、以下のように入力された「テスト」というテキスト部分をリストアイテムとして、マークアップしたい時は、ツールを利用すると便利です。

  1. まず、マークアップを適用する部分(この場合「テスト」)を選択します。[図9]
  2. 続いて、ツールメニュー→「L 箇条書き」→「L <li> リストアイテム」を選択します。[図10]
  3. テスト部分がli要素でマークアップされます。[図11]

sbHTMLのデフォルトでは、タブも挿入されます。余計なインデントなど要らないという場合は、先に述べた通り、optionキーを押しながら、ツールメニュー→「L 箇条書き」→「L <li> リストアイテム」を選択して、ツールの内容を編集して下さい。

ツール入力モード

ツール入力モードを利用すると、メニューを利用することなく、ツールを利用できます

つまり、いちいちマウスを使ってメニューを選択する必要がなくなります。

command+Yを押すと、ツール入力モードに入ります。

ツールに割り当てられたキーがウィンドウ上部に表示されるので、それに従って適時キーを押していけば、よいだけです。

例えば、先のようにli要素を挿入したい場合は、以下のように操作します。

  1. command+Yを押して、ツール入力モードに入ります。
  2. 「L:箇条書き」と表示されているので、Lを押します。[図12]
  3. 「L:<li>リストアイテム」と表示されているので、再びLを押します。[図13]

以上の操作で、ツールメニュー→「L 箇条書き」→「L <li> リストアイテム」を選択することができます。つまりcommand+YLLとキーボードだけで操作が行えます。

実体参照変換ツール

sbHTMLには実体参照変換ツールが用意されています。

変換したい部分を選択して、ツールメニュー→「選択範囲を文字実体参照に変換」を選択することで実行します。[図14]

「>」→「&gt;」のような変換処理が行われます。

このエントリーをはてなブックマークに追加

スポンサーリンク

<< image pile :: Mac OS X上で動作するウェブブラウザのまとめ >>