LoginSignup
41

More than 5 years have passed since last update.

HarooPad for Markdown Editor

Last updated at Posted at 2014-05-24

はじめに

HarooPad は Markdown Editor の一つです。これまで試してきた Markdown Editor は Markdown 記法が思い通りにプレビューに反映されなかったり、プレビューのスタイルがずれたりと Markdown Editor して、あと一歩という感じのものがありました。しかし、Haroopad は Kobito と同じように Markdown 記法を正確にプレビューに反映してくれます。HarooPad は公式サイトからダウンロードできます。

HarooPad の特徴

  • Live プレビューができる。
  • プレビューのテーマが多い。
  • HTML に変換できる。
  • マルチプラットフォーム対応(Windows/Mac OS X/Linux)
  • Vim キーバインド

スクリーンショット 2014-05-25 0.53.27.png

エディタの設定

ファイル > 設定 > エディタ > あなたのスタイル > 編集

編集ボタンをクリックするとファイルブラウザが立ち上がって、default.cssを確認することができます。
このdefault.cssmyStyle.cssにコピーして、エディタのスタイルを設定します。

フォントの設定

editor {
  font-family: 'Ricty-Regular' !important;
}

エディタ > あなたのスタイル をmyStyleに変更して再読込ボタンを押すとスタイルが反映されます。

スクリーンショット 2014-05-25 9.24.59.png

ビューワの設定

ファイル > 設定 > ビューワ > あなたのスタイル > 編集

編集ボタンをクリックするとファイルブラウザが立ち上がって、default.cssを確認することができます。
このdefault.cssmyStyle.cssにコピーして、エディタのスタイルを設定します。

フォントの設定

テキストにはプロポーショナルフォント、コードには等幅フォントを設定しました。

* {
  font-family: "Helvetica Neue",Helvetica,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;
}

code {
  font-family: "Bitstream Vera Sans Mono","Courier",monospace;
}

ビューワ > あなたのスタイル をmyStyleに変更して再読込ボタンを押すとスタイルが反映されます。

スクリーンショット 2014-05-25 9.24.49.png

ウェブフォント

@importをサポートしているので、Google web fonts も利用できます。

aaa
@import url(http://fonts.googleapis.com/css?family=Open+Sans);

editor {
  font-family: "Open Sans" !important;
}

Syntax Highlight

HarooPad はコードブロックに言語を指定できます。ただし、Qiita Markdown のようにファイル名を指定することはできません。

```ruby
# コード
```

シンタックスハイライト可能な言語一覧

言語 キー
Python python
Python’s profiler output profile
Ruby ruby
Haml haml
Perl perl
PHP php
Scala scala
Go go
XML xml
HTML (with inline css and javascript) xml
Lasso lasso
Markdown markdown
AsciiDoc asciidoc
Django templates django
Handlebars handlebars
CSS css
SCSS scss
JSON json
JavaScript javascript
CoffeeScript coffeescript
ActionScript actionscript
VBScript vbscript
VB.NET vbnet
HTTP http
Lua lua
AppleScript applescript
Delphi delphi
Oxygene oxygene
Java java
C++ cpp
Objective C objectivec
Vala vala
C# cs
F# fsharp
OCaml ocaml
D d
RenderMan RSL rsl
RenderMan RIB rib
MEL (Maya Embedded Language) mel
GLSL glsl
SQL sql
SmallTalk smalltalk
Lisp lisp
Clojure clojure
Ini file ini
Apache apache
nginx nginx
Diff diff
DOS batch files dos
Bash bash
Makefile makefile
CMake cmake
Axapta axapta
Oracle Rules Language ruleslanguage
1C 1c
AVR Assembler avrasm
VHDL vhdl
Parser 3 parser3
LiveCode Server livecodeserver
TeX tex
BrainFuck brainfuck
Haskell haskell
Erlang erlang
Erlang REPL erlang-repl
Rust rust
Matlab matlab
Scilab scilab
R r
Mizar mizar
Mathematica mathematica
AutoHotkey autohotkey
FIX fix

公式サイト

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
41