こんにちは、カプリです。
ワードプレスを使ってブログやサイトを作成するなら、オフラインの環境かクラウド上で作業したほうがいいです。
というのは、ワードプレスに文章を直接書いているとインターネットやサーバーに問題が発生した場合、記事が飛んでしまうことがあるからです。
なのでコンテンツを作成するなら、オフラインの環境かクラウド上でデータの管理ができるツールを使ってみてください。オフラインの環境で作業する場合は、Crescent EVeがおすすめです。このエディタはWindows専用ですが動きが早く機能が充実しています。
またオンラインの環境ならばEvernoteが使いやすいかと思います。この文章作成ツールはクラウド上でデータを管理できるため複数のデバイスで同じ内容を確認できるので非常に便利です。
今回はオフラインの環境で効率よく作業をするためのツールCrescent Eveのインストールと使い方をご紹介します。
Crescent Eve（無料）
Crescent Eveのインストールと使い方の解説動画になります。とても簡単なのでぜひこの動画の手順どおりにやってみてください。では早速、始めていきます。
抜群に使いやすいのがCrescent Eveです。HTML5に対応しているだけでなく、優れた機能がいくつも付いています。にも関わらず、動作がびっくりするほど軽いので驚きです。
Crescent Eveの便利な機能
ホームページの作成では、HTMLタグを書き込む「タグ打ち」という方法をつかって記事を書いていると思います。でも、コードを書き忘れてしまうことはありませんか。
こういった記入漏れを防ぐには、Crescent Eveが便利です。使い方が本当に簡単なので初心者の方にもおすすめのテキストエディタです。
まずはCrescentをダウンロードして下さい。
画面上部の右端をクリックすると、初期設定では標準テキストになっています。まずはここからドキュメントのタイプを選択します。
ドキュメントのタイプはHTML5を選んでみてください。標準テキストになっていると便利な機能を使うことができません。
ここに文章を書いていきます。たとえば下のように書いて、ここに＜p＞タグを埋め込むには、コードを埋め込みたい文章を選択してから「Ctrl」+「1」(Windows)か「Command」+「1」(Mac)を同時に押します。
すると、下のようにコードを埋め込むことができます。
また文法チェックをするのであれば「ツール」から「文法チェック」をクリックするか「F7」のキーを押して下さい。
すると画面の一番下に文法チェック結果が表示されます。なので、HTMLのエラーを最小限に抑えることが出来ます。また文法チェック結果を隠すときには「Esc」を押してください。
また「ツール」から「Crescent Eve起動時の設定」をクリックすると以下のような設定ができます。
先ほど「Ctrl」+「1」というショートカットキーを使いましたが、Crescent Eveにはいくつかのショートカットキーが用意されています。
「キー割り当て」の項目があるので、ここでコマンドのキーを確認することができます。頻繁に使用するコマンドがある場合は、覚えておくと便利です。
次に文字数のカウント機能を説明します。記事全体の文字数を知るには、Windowsなら「Ctrl」＋「A」、Macなら「command」＋「A」で全体をセレクトします。文章の一部の文字数を調べるなら、その部分をセレクトしてください。
ただし、タグも1文字としてカウントされてしまうので文字数を調べるときはタグの削除が必要です。そうしたら「ツール」をクリックして「文字数をカウント」をクリックします。
すると以下のように文字数が表示されます。
それから頻繁に利用する文字列のショートカットキーを作成することも出来ます。ショートカットキーを作るには「ツール」から「定型句の挿入」をクリックして「定型句の編集」をクリックします。
初期設定では、下のように1つ入力されています。「1」につづいて見出しの＜h2＞を作成する場合は、＜h2＞$selected_text$＜/h2＞と記入します。すると見出しの＜h2＞＜/2＞のショートカットキーが作れます。ショートカットキーは「Ctrl」＋「2」の組み合わせです。
頻繁に使用するものはショートコードを作ってみてください。このくらい抑えておけば十分に活用できるのではないかと思います。またもっと詳しい説明は「ヘルプ」の「Crescent Eveを10倍活用する方法」で確認することが出来ます。
以上がCrescent Eveのインストールと使い方の説明です。補足ですが、画面の表示を確認しながらコンテンツを作成したいという方もいらっしゃると思います。
Bracketsというコードエディタを使えば、記事を書きながらリアルタイムで確認できるのでご紹介します。
Brackets（無料）
BracketsはGoogle Chromeと連携していてライブビュー機能が使えるコードエディタです。編集しながらリアルタイムで記事の内容を確認することができるので便利です。またコードの打ち間違いを圧倒的に減らしてくれる機能がついているので本当に助かります。
このテキストエディタは、PhotoshopやIllustratorでおなじみの、Adobe（アドビ）社によって作られたもので、初心者の方から上級者の方まで利用できます。
Adobe（アドビ）社のコードエディタとして有名なのはDreamweaverでしたが、Dreamweaverには、Bracketsの要素がふんだんに入っています。なのでBracketsのユーザーインターフェイスがAdobeの中心になっていくのかもしれません。
BracketsにはHTMLタグの補完機能だけでなく、CSS3やJavaScriptの補完機能も付いています。たとえばHTMLファイル上で「d」と打つだけで、入力されると思われるHTMLタグの候補がパッと表示されます。ですので作業を効率化することができます。
Bracketsの簡単な使い方
まずはBracketsをダウンロードします。
Windowsからアクセスした場合は、Windows用がダウンロードできますし、MacからアクセスしているならMac用が自動でダウンロードされます。
Bracketsのアプリケーションを開くと以下のように表示されます。まずは管理画面右上にある「拡張機能マネジャー」（アタッシュケースみたいなアイコン）をクリックしてプラグインをインストールしていきましょう。
Bracketsでは、いくつものプラグインを導入することができます。その中でも「Emmet」と「Brackets Snippets」というプラグインはおすすめのプラグインです。
Emmetは、HTMLコードやSCCコードなどを書くときに、短縮化されたコードを書くことで自動的にコードを打ち出してくれるプラグインです。
Brackets Snippetsは、よく使うコードを登録しておいて、ショートカットキーを入力することで簡単にコードを呼び出すことができるプラグインです。ただ、Emmetにはショートカットキーがいくつも用意されているので、それだけでも十分かと思います。
頻繁に利用するコードがEmmetに入っていない場合は、Brackets Snippetsを利用してみてください。
まずは検索に「Emmet」と入力して「インストール」をクリックします。
しばらくすると「インストールは成功しました」と表示されます。「閉じる」をクリックして下さい。
次に同じ手順でBrackets Snippetsもインストールします。
インストールが完了したら画面を「閉じる」をクリックします。
次に作業するフォルダを指定します。「Getting Started」をクリックして「フォルダを開く」を選択します。
書類（ドキュメント）にある新規フォルダをクリックします。
「Bracketswork」というフォルダを作成してから「開く」をクリックします。
すると以下のように表示されます。
上の「Bracketswork」をクリックするとアップルマークのとなりに「Brackets」⇒「ファイル」が表示されます。この「ファイル」から「新規作成」をクリックします。
すると画面左に「名称未設定-6」と出ていますが、この数字は始めて作成する場合は「1」になっています。
画面右下のステータスバーにあるファイルタイプを「TEXT」から「HTML」に変更します。この設定をすることで、記事の内容をリアルタイムで確認することが出来ます。
ここにテキストを書いていきます。先ほどEmmetをインストールしているので「Cheat Sheet」を使ってコードを入力します。
まずはサイトの頭から書き始める場合は「Cheat Sheet」のHTMLを見てみます。
すると書き始めのショートカットキーは「！」になっているので「!」を入力して「tab」をクリックします。
するとコードが自動で表示されます。
「ドキュメント」にタイトルを入れてから文章を入力します。
次に「名称未設定-6」をクリックして「名前を付けて保存」をクリックします。
名前を「index.html」に変更して「保存」してください。保存する場所は「Bracktswork」です。
次にピカリと光った雷のようなマークをクリックして下さい。
すると、Chromeのブラウザが開いて、作成している記事がリアルタイムで表示されます。文章を編集した場合は、保存しなくてもすぐに反映されるので、表示の確認をするには非常に便利です。
以上がBracketsのインストールと使い方の説明です。
まとめ
この記事では、2つのテキストエディタの基本的な使い方について紹介しました。ここで書いた機能のほかにも、優れた機能がついているので、ぜひ利用してみてください。
またオンラインの環境で作業をするのであればクラウド上でデータを管理できるツールがいいです。おすすめはEvernoteで、無料と有料のプランが用意されていますが、無料のプランで十分使えます。
それでは最後までお読み頂いてありがとうございました。