MENU

ブログをもっと楽に記述!ショートカットの設定はしておきましょう!

スポンサーリンク

はてなブログやWordPressで記入するときもそうですが、タグを辞書登録しておけば色々とはかどります。辞書登録はWindowsだとIMEの登録パットから、MacだとことえりやGoogle日本語入力の設定から可能です。


辞書登録はだいたいこんな感じになっています。
f:id:noon8:20150519091430p:plain


登録する単語にタグを、よみにショートカットとして使うひらがなやローマ字を入力しておきましょう。


登録しておくと便利なタグ

実際に登録しておくと便利なタグを紹介します。僕の場合、hタグを登録しています。”に”と入力すればh2タグが、"さ"と入力するとh3タグが出てくるようになっています。

また、"ふぉ"と入力すると、フォントの文字の大きさのタグが表示されるようになっています。フォントの文字調節はあまり使わないので、よく使う文字を中に入れておけばよいでしょう!
f:id:noon8:20150519091436p:plain


文字背景と色

文字色の変更は、はてなブログでは自由にできます。なので、文字背景や文字背景と文字色の複合されたタグを登録しておくととても便利になります。

黄色の文字背景を入力する際は、このようなタグを使えばよいでしょう。

<span style="background-color:#FFFF00">背景色</span>


しかしやや長すぎると思えば、CSSで以下のように設定しておくと、文字列も短く済みます。今回は#FFFF00=yellowとしていますが、blueであったり、redであったり他の色も指定しておくことで、より便利になると思います。こちらをCSSにコピペしましょう。

.yellow {background-color:#FFFF00;}


そしたら背景色が黄色になった文字を入力することが可能です。
背景色

<span class="yellow">背景色</span>

背景の色を黄色にして、文字の色を赤にしたい!という方もいるでしょう。そんな時は、CSSで以下を設定しておきましょう。

.yellowred {background-color:#FFFF00; color:#FF0000;}


こうすることで、背景が黄色になり、文字が赤になったものを入力することが可能です。
黄色背景、赤文字

<span class="yellowred">黄色背景、赤文字</span>


他に使えそうなタグ

他にも画像にURLを入力したい!という時の場合に、

<a href="リンク先のURL"><img src="画像のファイル名" alt="画像の説明文"></a>

上記のタグを登録しておくと便利です。


また、タグは関係ありませんが、自分のメールアドレスなども同時に登録しておくと便利ですよね。たぶん殆どの人が登録をしていますでしょうが、一応参考までに...


まとめ

以上より、ブログをもっと楽に記述するためにショートカットを設定しておこう!でした。


はてな記法やMarkdownは確かに楽ですが、全てがそれらの記法で完結するわけではないので、こうしたタグは覚えておくというより、登録をしておいたほうが良いと思います。