※以下の記事の続きです。こちらを先にお読みください

●０ インストールと準備

　公式サイト https://atom.io/ からダウンロードしてインストールしましょう。この辺りは自分でお願いします。で、インストールしてみると以下のような黒が基調の画面になります。プログラムとかやる人はこれで打つのがスタンダードみたいですね。

　おそらく文章を書く人は、ワード形式の、白画面に黒い文字、の方が慣れてると思いますので、色々と設定をしていく。そのやり方の解説がこの記事というわけです。

　さて、実際に設定していく前に、「プラグイン」ってなにか、という説明をしましょう。RPGにたとえると、インストールしたばかりのAtomは、なにも装備してないキャラクター。ここに武器防具を装備していく＝見た目を整えたり、いろんな機能を追加していくわけです。その装備が「プラグイン」で、「拡張機能」って訳せば分かりやすいでしょうか。それではどこで装備を買うか。atomの中から検索してダウンロード出来ます。世界中のいろんな人が、装備を作ってくれてるんですね。開発者のいる国の方向を向いて感謝しつつダウンロードしていきましょう。では具体的なやり方を。

●１　見え方の設定

　では最初に、atomの画面の見え方を変更します。Atomの左上のメニュー、File→Settingsに進みましょう。

　出てきた画面で + Install を選び、右側のThemesをクリックして色が変わったら（この画面の色、画像とは違う配色になってるかもしれません）one-light-ui-adwaitaというテーマ（見た目がワンセットになってるもの）を試しに選んでみましょう。同様に ulysses-syntaxもインストールしてみてください。

　今度は左のタブの Themes を選び、先ほどインストールしたテーマを適用してみます。タブに出てくるので選ぶだけですね。uiはユーザーインターフェースの略かと。

　僕はUlyssesを独自にカスタマイズしたテーマを使ってます。もし欲しいようならご連絡ください。選択すると、勝手に表示が切り替わります。これでだいぶ文章エディタっぽくなってきたのではないでしょうか。

　さて、もう一つ設定を。再び左上のfile → stylesheet と選択すると、なにやらプログラムっぽい文章が出てきます。

　これも、あちこちの見え方、文字とか色とかを調整するデータですね。なんか難しそうですが、恐れるに足りません。この記事の一番最後に、Style.less と囲んだ文章を載せておきますので、そいつをコピーして内容に上書きペーストして保存しましょう。それだけ。捕捉すると、font-family ってところが「メイリオ」になってます。これを変えるとフォントが変化します。好きなものにして、Macだったら　ヒラギノ角ゴ　とかにすればよいのではないでしょうか。このファイルを色々いじると見え方も変わるので、慣れて来たらあちこち変更してみても良いかと思います。

●２　パッケージのインストール+設定続き

　それでは次に、いろいろな便利機能を入れていきましょう。ここまでの作業で「全部英語かー……」となってたみなさんに朗報。最初に入れるのは日本語メニューの拡張機能です。インストールの仕方は、さっきのテーマとおんなじ。File→Settings で出た画面から Install→右側のタブをpackagesにして、japanese-menu を検索し、install ボタンを押します。ぽちっとな。これでメニューやらいろいろが日本語になるはずです。もしならなければ、Atomを一度終了して再起動してみましょう。

　ほかにお勧めなのが mini-map （文章全体を表示するマップを出す） などです。以下に僕が使ってるパッケージを張り付けるので、とりあえず入れてみてください。説明は各自確認してくれ。

　さて、次に一番かんたんなところ。もうメニューが日本語になってるはずなので、左上の ファイル →環境設定 →設定 と進んで個人設定をしましょう。説明も日本語になってるはずなのでここはお好きなように。色々変えながらどうなるか試してみてください。ソフトラップは入れた方が良い。

　これで文章を書いてみると、一つ困ったことに、文字が折り返されず延々と右側に伸びて行ってしまうと思います。そこで、上のメニューバーから、表示→自動折り返しの切り替え を選んでおきましょう。これで大まかな設定は終了です。

●３ 実際に書く：マークダウン方式とファイル同期

　では、いよいよ執筆に進みましょう。ここでは、クラウド同期をすることを見越して、ドロップボックス内にデータを置くことにします。dropboxのアカウント開設はグーグル先生に聞いて頑張ってみてください。出来たら、Dropboxの中に親フォルダを作ります。名前はATOMでもなんでもOK。そのフォルダの中に、テキストドキュメントを置いてみてください（右クリック →新規作成 →テキストドキュメント）

　名前はなんでも構いません。出来たら、今度はAtomからファイル→フォルダを開くを選択し、先ほどのフォルダを選びます。すると、以下のような画面になるので、先ほど作ったテキストファイルを開いてみます。

　これで、ファイルを編集できるようになりました。これで基本機能はOKですね。書いてセーブし、一度ファイルを閉じてまた開き、編集ができていることを確認しましょう。

　さて、ここで「マークダウン形式」というものについて解説します。テキストファイルは拡張子.txt、マークダウンは.md。マークダウン形式で保存することで、データ容量はほとんど変わらない＝実施テキストファイルなのに、文字にある程度色をつけたり、ということが可能になります。文字修飾の出来ないテキストエディタと、データが重たくなり互換性も下がるリッチテキスト やdocファイルのいいとこどりです。

　やり方は、先ほど作ったファイルを右クリックし、「移動・名称変更」を選びます。そして表示されたファイル名の拡張子 .txtを消し、代わりに.mdにする。これだけ。

　変更したら、実際に試してみましょう。半角の# や > や ** を文字の前につけてみてください。色が変化したかと思います。この就職方法のまとめは以下。

　Atomのマークダウンの文字修飾、実はこれだけしかできません。表示されてる色も変えたり出来るのですが、設定がちょっと複雑です。もし様々な文字の修飾がぜったいに必要、ということであればScrivenerの方がいいかもしれません。僕にはこれで十分でした。これも自分で色々いじって実際に使ってみるのが近道でしょう。

　最後に新しいファイルを作るやり方を。Ctrl + N キーを押すと（あるいは ファイル →新規ファイル）untitled という無題のファイルが作成されます。こいつをCtrl + S で保存すればOK。このとき、拡張子も入力できるので、「新規ファイル.md」と .mdをつければ最初からマークダウンファイルとして保存されます。（何も入力しないとテキストファイルで保存 → 後で変更もできます）

●便利機能：ペイン分割ほか

　小説を書いたり、ブログの記事を書いたりするとき、ほかのテキスト、メモ書きを参考にしたいことは多くあると思います。例えば、プロットや下書きを見ながら、例えば参考文献のメモを見ながら。そんなとき便利なのがペイン分割機能です。説明するより見た方が早い。

　画面が３つに分割されてるのが分かりますね。この一つ一つが「ペイン」です。やり方は簡単。ファイル名のタブのところで右クリックして、「ペイン分割」を選ぶだけ。同じファイルが分割して表示されますが、さらに他のファイルを開くとペイン内に開きます。ペイン数に限りはないようで、画面が許す限り分割することが出来ます。ペインを多くすると、左側のツリー部分が邪魔になってくることがありますが、その場合 Ctrl + \ で格納できます。

●

　この他、僕が愛用している機能としてCSV（＝エクセルみたいな表）を表示・編集できること。PDFを表示できること、画像も参照できること、があります。これの何が良いかというと、参照・編集しなければいけないファイルが、ほぼAtomの中だけで解決できるということですね。エクセルを開いて、PDFファイルも開いて、画像を開いて、ファイルを探す間のエクスプローラーも散乱してて、そのウインドウの大きさを調節して……ってやってる時間をかなり削減してくれます。Atomを使いやすくするためにフォルダを集中させると、そのことでファイルの場所も分かりやすくなって、探す時間も省けるようになるのが良いですね。使い慣れて来たら試してみてください。

　Atomはプログラム用のエディタである、と前の記事に書きました。まだまだ山のような拡張機能があり、その中には執筆に便利なものがあるかもしれません。（例えば、タブをブラウザにする機能、動画再生機能などもあるようです……）僕も、「執筆ソフトとしてのAtom」を使いこなしているとは到底言えません。何か便利な使い方を発見したらぜひ教えてください。

　それではみなさま、Happy Atom Life を。

Styles.less

/*

* Your Stylesheet

*

* This stylesheet is loaded when Atom starts up and is reloaded automatically

* when it is changed and saved.

*

* Add your own CSS or Less to fully customize Atom.

* If you are unfamiliar with Less, you can read more about it here:

* http://lesscss.org

*/

/*

* Examples

* (To see them, uncomment and save)

*/

// style the background color of the tree view

.tree-view {

// background-color: whitesmoke;

}

// style the background and foreground colors on the atom-text-editor-element itself

atom-text-editor {

// color: white;

// background-color: hsl(180, 24%, 12%);

}

// To style other content in the text editor's shadow DOM, use the ::shadow expression

atom-text-editor::shadow .cursor {

// border-color: red;

}

@font-family-p: "メイリオ", "meiryo";

@font-family-m: Consolas, 'Courier New', Courier, Monaco, monospace;

//左ツリー部分のフォントと色//

.tree-view {

font-family: @font-family-p;

background-color: #ffffff ;

}

//左ツリー部分のフォントサイズと幅//

.tree-view ol {

font-size:13px;

padding:0;

}

//左ツリー部分のフォントの行間//

.tree-view li {

padding:0.00em;

}

.editor {

font-family: @font-family-p;

}

//上タブ部分のフォントと色//

.vertical {

font-family: @font-family-p;

}

.scrollbars-visible-always {

/deep/ ::-webkit-scrollbar {

width: 12px;

height: 12px;

&-track {

border: 0px;

border-radius: 0px;

background-color: rgba(179, 179, 179, 1) !important;

}

&-thumb {

background-color: rgba(255, 255, 255, 0.7) !important;

border: 0px;

border-radius: 8px;

}

}

}