2015年2月26日シェアツイートシェアブックマークPHPやHTMLなどを記述するのに高機能なテキストエディタを使うと一気に作業効率が上がります。SublimeTextも人気だけどちょっと難しそう......そんなときには国産の無料で使えるサクラエディタをおすすめします。サクラエディタと言えば、windows上で動作するエディタとしては、国内で最もメジャーなエディタの一つです。何より国産エディタのため、メニューがはじめから日本語なので初心者の方には特にオススメです!マクロやプラグインも使えるので、使いこなせば一気に作業効率がアップすること間違いなし!今回はそんなサクラエディタのインストールからプログラムを書くときにおすすめの基本設定までをご紹介します。No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアですCodeCampとは?(受講生体験記)「エンジニアは女性のキャリアとして魅力的」未経験からの転職体験記リモートワーク×多拠点居住の新しい生き方を実現する。真っ先にやっておきたい設定タブを有効にする自動保存を有効にする編集するファイルごとの設定HTML向けの設定PHP向けの設定Javascript向けの設定CSS向けの設定まとめサクラエディタのインストールサクラエディタのインストールは一般的なWindowsのアプリケーションと同じくとても簡単です。インストーラーをダウンロードし、マウスでボタンをクリックしていくだけです。ダウンロードhttp://sakura-editor.sourceforge.net/download.htmlサクラエディタDownloadページからインストーラーをダウンロードし、保存します。インストール次に保存したファイルをダブルクリックすると、インストーラーが起動します。特別な設定が必要でない限りは「次へ」をクリックしていくだけです。「サクラエディタセットアップウィザードの完了」というメッセージが表示されるとインストールが完了です。「完了」をクリックしてインストーラーを終了し、サクラエディタを起動してみましょう。無料のエディタを網羅的にまとめましたので合わせて御覧ください。初心者にオススメ!フリーのテキストエディタ10選サクラエディタの起動デスクトップのアイコンかスタートメニューの「すべてのプログラム」内、「サクラエディタ」の中の「サクラエディタ」をクリックします。サクラエディタが起動しました!見た目はメモ帳とあまり変わらないと思われるかもしれませんね。プログラム・コーディングに役立つ機能がたくさん詰まってます!真っ先にやっておきたい設定サクラエディタでコーディングをするにあたり、次の設定は必ずやっておきましょう!作業効率に大きく差が出ます!タブを有効にするWebサイトを作成するときはHTMLやCSSなど複数のファイルを同時に編集することになります。多くのウインドウが開いていると作業効率が悪くなりますので、タブ機能を有効にする設定をしましょう。メニューの「設定」の中の「共通設定」をクリックします。「タブバー」の中の「タブバーを有効にする」にチェックを入れます。すると複数ファイルを開いても1枚のウインドウの中でタブになりますので、ファイルを開くたびにウインドウだらけになることがありません。自動保存を有効にする「ファイル」の中の「自動的に保存する」にチェックを入れます。サクラエディタはPhotoshopやIllustratorのようなグラフィックソフトと比べても非常に軽く、安定したソフトです。フリーズやクラッシュの可能性はゼロではありません。そんなときに備えて自動的に保存する機能を有効にしておきましょう。保存間隔を分単位で選べますので、ご自身の作業ペースに合わせた設定を行ってください。CodeCamp提供のWebマスターコース当メディアを運営しているCodeCampではWebマスターコースを現役エンジニアのマンツーマンレッスンという形で提供しています。実際にWebサービスをを開発するのでポートフォリオとしても使用できる無料レッスン受講後の申し込みで10,000円クーポンをプレゼントしています!ぜひお試しください。続いて、Web制作でよく扱うファイルの種類ごとの設定をします。メニューより「設定」を選び、「タイプ別設定一覧」をクリックします。次に、編集したい言語の設定を選択し、「設定変更」をクリックします。すると言語ごとの設定変更画面が表示されますので、ここでより使いやすい設定に変更します。HTML向けの設定デフォルトの文字コードをUTF-8に「ウインドウ」をクリックし、「文字コード」をUTF-8に変更します。今後制作するWebサイトのほとんどはUTF-8ですので、デフォルトの文字コードを変更しておくとうっかりShift_JISで作ってしまうというトラブルを避ける事ができます。Shift_JISやEUCのファイルを開いたときに勝手に文字コードが変更されるようなことはありませんのでご安心ください。PHP向けの設定PHPは初期状態では設定が定義されていませんので、設定を定義するところからはじめます。強調キーワードの設定メニューより「共通設定」を選びます。共通設定画面が開きますので、「強調キーワード」をクリックします。次に「セット追加」をクリックし、「キーワードのセット追加」欄に「PHP」と入力します。入力が終わりましたら「OK」をクリックします。続いて「インポート」をクリックします。するとファイル選択画面が開きますので、「C:\ProgramFiles(x86)\sakura\keyword」フォルダまで移動します。このフォルダ内にデフォルト以外の強調キーワード定義ファイルが保存されています。この中の「PHP.KWD」を選択しましょう。すると強調キーワード一覧にPHPの関数が表示されました。これで関数が色分けされて表示されます。タイプの定義ただ、強調キーワードの定義だけではPHPファイルを開いた時にその定義が適用されません。「タイプ別設定一覧」よりPHPを追加し、ファイル形式と強調キーワードの定義とを関連付けます。メニューの「設定」をクリックし、「タイプ別設定一覧」を選びます。「追加」をクリックすると新しく設定が追加されます。新しく追加された設定を選択した状態で「設定変更」をクリックします。「スクリーン」欄の「設定の名前」を「PHP」に変更し、次に「ファイル拡張子」に「PHP」と入力します。これでPHPファイルを開いた時にこの設定が適用されるようになります。続いて「カラー」をクリックし、「強調キーワード」の項目を「PHP」に変更します。これはPHPファイルを開いた時に、先ほど設定したPHPの強調キーワード定義を適用させるという設定です。これでPHPの関数が色分けされ、見やすくなります!開発もしやすくなりますね。Javascript向けの設定Javascriptの設定方法もPHPの場合とほぼ同様です。強調キーワードの設定メニューより「共通設定」を選びます。続いて、「強調キーワード」をクリックしてください。次に「セット追加」をクリックし、「キーワードのセット追加」欄に「Javascript」と入力します。入力が終わりましたら「OK」をクリックします。続いて「インポート」をクリックします。するとファイル選択画面が開きますので、「C:\ProgramFiles(x86)\sakura\keyword」フォルダまで移動します。このフォルダ内にデフォルト以外の強調キーワード定義ファイルが保存されています。この中の「JavaScript.kwd」を選択しましょう。すると強調キーワード一覧にJavascriptの関数が表示されました。これで関数が色分けされて表示されます。「タイプ別設定一覧」よりJavascriptを追加し、ファイル形式と強調キーワードの定義とを関連付けます。メニューの「設定」をクリックし、「タイプ別設定一覧」を選びます。「追加」をクリックすると新しく設定が追加されます。新しく追加された設定を選択した状態で「設定変更」をクリックします。「スクリーン」欄の「設定の名前」を「Javascript」に変更し、次に「ファイル拡張子」に「JS」と入力します。続いて「カラー」をクリックし、「強調キーワード」の項目を「Javascript」に変更します。これでJSファイルを開いた時に関数や変数がわかりやすく色分けされて表示されるようになりました!CSS向けの設定CSSも初期状態では設定が定義されていません。そこで、インターネットで配布されているCSS3向けの定義をダウンロードして使用します。サクラエディタ用CSSシンタックスハイライトを公開します血統の森+はてな上記ページより圧縮ファイルをダウンロードし、解凍します。サクラエディタに戻り、メニューの「設定」を選び、「タイプ別設定一覧」をクリックします。ここで「インポート」をクリックし、先ほど解凍したファイルの中の「CSS.ini」を選択します。新タイプ名:CSS色選択:そのままインポートという設定で「OK」をクリックします。すると「CSS」という設定が追加されていることが分かります。ここまでの設定が完了した状態でCSSファイルを開くと、きちんと色分けされて見やすく表示されるようになります。これでCSSファイルの編集もしやすくなりました。まとめWeb制作者がサクラエディタを使いはじめるときにやっておきたい設定の手順についてまとめました。設定画面を見て気づかれた方も多いかもしれませんが、サクラエディタはとても細かく柔軟なカスタマイズが可能です。マクロ機能もとても強力で、上手く使えば手作業だと面倒な操作も一瞬で終わらせることができます。家事も仕事もプログラミングも。使い方を徹底解説プログラミング学習プログラミングツール育児も仕事も諦めたくない!欲張りな私がプログラミングを習得するまでプログラミング学習NoSQLとは?リレーショナルデータベース(RDB)との違いを徹底比較プログラミングツールプログラミング習得から起業へ。2020年版】社会人でも通いやすいプログラミング教室5選|選び方の基準も解説プログラミング学習プログラミングスクール・サービス「エンジニアは女性のキャリアとして魅力的」モノづくり好き理系女子がWebエンジニアへ転職するまで受講生インタビュープログラミング未経験で介護師からエンジニアへ。家事も仕事もプログラミングも。受講生インタビュープログラミング習得後、フリーランスに転身。受講生インタビューフリーランス塾講師からエンジニアへ26才で転職。先生の支えがあって成長できました。学習ガイドtwitterLINE。