PC-More

PCの便利化、Windowsのフリーソフトや、カスタマイズ方法の紹介。

タグ手打ち HTMLタエディター 「StyleNote」

タグを手打ちで入力される方にお勧めなHTMLエディタ、「StyleNote」をご紹介します。

今回ご紹介するのは、バージョン5で、フリーソフトリンクウェア)です。

ダウンロード

こちらの「StyleNote」のダウンロードページを開き、「DOWNLOAD NOW」をクリックし、ファイルを保存します。 ※保存方法が分からない場合はこちら
画像
(※ページのデザインは異なる場合があります。)

展開(解凍)

保存した圧縮ファイル「sn〜」(.zip)ファイルを展開(解凍)します。 ※展開方法が分からない場合はこちら

実行

展開して出来たフォルダを開き、中にある「sn5」(.exe)ファイルを実行します。
画像

使い方

StyleNoteは機能が多いので、基本要点だけ解説します。

詳細はこちらのStyleNoteの公式マニュアルをご覧ください。

HTMLファイルの新規作成

StyleNoteが起動したら、一番右の欄HTMLソースを書き込み、完成したら、ツールバーの左から2番目の保存ボタンをクリックします。
画像

出た保存画面で、左の欄で保存場所を選び、「ファイル名」の欄でファイル名を入力し、「保存」をクリックします。
画像

更に新規作成したい場合は、ツールバーの一番左のボタンをクリックするか、上部メニューの「ファイル」をクリックし、「新規作成」をクリックします。
画像
画像

既存のファイルを開く

上部メニューの「ファイル」をクリックし、「ファイル名を指定して開く」をクリックします。
画像

出た画面で、左の欄で場所を選び、右の欄開くファイルを選択し、それをダブルクリックするか、「開く」をクリックします。
画像

スニペット(ユーザー登録タグ、定型文)

スニペット」という機能を使うと、ユーザーが登録したタグを使用する事が出来ます。方法は以下の通りです。

ライブラリー」タブをクリックし、「+」をクリックします。
画像

ご自身が分かりやすい、そのスニペットの「名称」を入力し、メインの欄に開始タグ閉じタグを書き込み、間を普通に1回クリックします。
画像

同じ場所を右クリックし、出たメニューから、「スニペット制御命令」をクリックし、「実行後の選択範囲位置 - $selected_text」をクリックします。
画像

間に「$selected_text」が挿入されればOKです。「保存する」をクリックして保存します。
画像

スニペットが登録されました。
画像

スニペットを使用するには、まず、HTMLソースの入力欄で、スニペットで囲みたい部分を、マウスでクリックしたままなぞって、色を反転させます。
画像

スニペット」をダブルクリックして展開し、使用したいスニペットダブルクリックすると、色が反転した選択部分がスニペットで囲まれます。
画像

StyleNoteのレイアウトの変更

StyleNoteのレイアウトを変更するには、上部メニューの「表示」をクリックし、入っているチェックを外したり、入れたりしてみてください。

外す時は、念の為に名前を覚えておいてください。