ハウリンの雑念だらけで生きている

ゆるゆると書いていきます

はてなブログ、文字装飾(色・サイズ変更・アンダーライン・リンク・目次など)のカスタマイズ。


スポンサーリンク

こんにちは、ハウリンです。

今回は、文字装飾ツールバーの使い方を紹介したいと思います。 

記事が黒い文字ばかりだと読みにくいですし、つまらないですよね。

ツールバーを使うといろいろな事が出来ます。

強調したい部分に色がついていたり、大きくしたりすると分かりやすくなりますし、メリハリがつくのでお勧めです。

   

       f:id:twistinhaurin:20200810180819p:plain

 

 

 

 

文字を太くする 

太くしたい文字をドラッグして指定します。

f:id:twistinhaurin:20200811133927p:plain

文章がしょうもない事には触れないで下さいね(;´∀`) 

 

ツールバーの赤枠で囲った所をクリックすると。

f:id:twistinhaurin:20200810211717p:plain

 

夏に食べたいものと言えばいろいろありますが、

やっぱりそうめんじゃないでしょうか。

冷やし中華でもいいかも。

「そうめん」太字ではっきりしました(^O^)/ 

 

 

文字に色をつける

色をつけたいところをドラッグして指定します。

 

赤枠で囲った所をクリックすると、色のパレットが出てくるので好きな色を選んでクリック。 

f:id:twistinhaurin:20200810211950p:plain

夏に食べたいものと言えばいろいろありますが、

やっぱりそうめんじゃないでしょうか。

冷やし中華でもいいかも。

 

太字と組み合わせると

夏に食べたいものと言えばいろいろありますが、

やっぱりそうめんじゃないでしょうか。

冷やし中華でもいいかも。

更にはっきり強調されました(^O^)/ 

 

 

文字を傾ける

日本語の文章に斜体を使用しようとしても何も変わりません。

何で変わらないのか最初分からず悩みまくりました💦

多くのブログでは「メイリオ」というフォントが使われているらしく、メイリオが使われている日本語の文字を斜体にしようとクリックしても斜めにはならないのです。

これは、日本語には斜めにする文化がないからだそうです。

じゃあ英語はどうなの?とやってみると

「今一番行きたい所はThailandです。」の

Thailand」の部分を指定して、赤枠の所をクリック。

f:id:twistinhaurin:20200810212936p:plain

 

今一番行きたい所はThailandです。 

斜めになりました(^O^)/

 

 

打ち消し線(打消)をいれる

消したい部分に線を入れるという事です。

 

打ち消し線を入れたい部分を指定して、赤枠の所をクリック。

f:id:twistinhaurin:20200810212950p:plain

夏に食べたいものと言えばいろいろありますが、

やっぱりそうめんじゃないでしょうか。

冷やし中華でもいいかも。

「冷やし中華」 に打ち消し線が入りました(^O^)/

 

 

アンダーラインを引く

アンダーラインを引きたい部分を指定して、赤枠の所をクリック。

f:id:twistinhaurin:20200810213004p:plain

夏に食べたいものと言えばいろいろありますが、

やっぱりそうめんじゃないでしょうか。

冷やし中華でもいいかも。

「やっぱりそうめん」にアンダーラインが入りました(^O^)/

 

 

文字のサイズを大きく(小さく)する 

大きく(小さく)したい部分を指定して、赤枠の所をクリック。

f:id:twistinhaurin:20200810213015p:plain

中(150%)にすると・・・(太字と組み合わせてます(`・ω・´)b)

夏に食べたいものと言えばいろいろありますが、

やっぱりそうめんじゃないでしょうか。

冷やし中華でもいいかも。

「そうめん」の主張が強くなり

 

更に、大(200%)にすると・・・

夏に食べたいものと言えばいろいろありますが、

やっぱりそうめんじゃないでしょうか。

冷やし中華でもいいかも。

相当「そうめん」食べたいんだなぁと思えます。 

 

小(80%)にすると・・・

夏に食べたいものと言えばいろいろありますが、

やっぱりそうめんじゃないでしょうか。

冷やし中華でもいいかも

 「冷やし中華でもいいかも」が控えめになりました(^O^)/

 

 

見出しと目次を作る

見出しにしたい部分を指定して、赤枠の所をクリック。

f:id:twistinhaurin:20200810213015p:plain

「大見出し」「中見出し」「小見出し」とでてくるので指定します。

このブログでの「大見出し」は⇩になります。

f:id:twistinhaurin:20200813155841p:plain

 

「中見出し」だと⇩こんな感じ

f:id:twistinhaurin:20200813160257p:plain

 

「小見出し」だと⇩こうなります。

f:id:twistinhaurin:20200813160704p:plain

私はあまり「小見出し」まで作る事はないのですが、いろいろ試してみると楽しいかもしれません。

 

 

見出しを作ったら「目次」を作成してみます。

「目次」を表示させたい所にカーソルを置き、

赤枠の部分をクリック・・・

f:id:twistinhaurin:20200602144318p:plain

 そうすると

f:id:twistinhaurin:20200602144726p:plain

と表示されます。

編集画面では⇧上の表示だけですが、プレビューにはちゃんと簡単な「目次」が出来上がってます。

f:id:twistinhaurin:20200602152208p:plain

「中見出し」は1つずれて表示され、「小見出し」は更に1つずれて表示されます。


この記事の上の方にも「目次」がありますが、もう少し「目次」をカスタマイズしたい方は⇩こちらをご覧ください。 

www.haurin-zatunenlife.com

 

 

 

箇条書きにする

リストを書き出したりする時に「・」を使って揃えたりしますが、「箇条書き」をクリックして揃えた方がSEO的にも良いみたいです。

 

例えば

f:id:twistinhaurin:20200811144415p:plain

こんな風に指定して

何回も言いますが内容がしょうもないのはスルーして下さい (;´∀`)

赤枠の所をクリックすると

f:id:twistinhaurin:20200813161423p:plain
 

 「・」が表示されて、箇条書きに表示されました。

f:id:twistinhaurin:20200811145129p:plain

 

しまった!!あと1行追加したい!という時は、カーソルを「カレー」の最後に置いて

f:id:twistinhaurin:20200811145129p:plain

「Enter」をクリック。

f:id:twistinhaurin:20200813165436p:plain

リストを追加できる様になりました(^O^)/

※テーマによって表示されない場合があります 

 

 

番号付きリストを作る

箇条書きを作る時と同じように、「番号付きリスト」にしたい部分を指定して、赤枠の所をクリック。

f:id:twistinhaurin:20200811150612p:plain

番号が付いたリストになりました(*^^*)

f:id:twistinhaurin:20200813163751p:plain

こちらもリストを増やしたい時は、カレーの最後にカーソルを置いて「Enter」をクリックすれば増やせます。

※テーマによって表示されない場合があります 

 

 

外部リンクを貼る

 ⇩こちらで詳しく載せてます。

www.haurin-zatunenlife.com

 

 

続きを読むを使う

トップページが「全文形式」の場合「続きを読む」機能を使うと便利です。

ブログのトップページに新しい記事から表示されていますが、全文表示ではなく1部分まで表示させて、残りは「続きを読む」をクリックしてから見れる様にします。

 

ここまで表示させたい所の下にカーソルを合わせます

f:id:twistinhaurin:20200811161246p:plain

 

 赤枠の所をクリック。

f:id:twistinhaurin:20200811155530p:plain

 

 そうすると、この様に点線が表示されます。

f:id:twistinhaurin:20200811161546p:plain

 

トップページを見てみると

f:id:twistinhaurin:20200811162810p:plain

「続きを読む」が表示されました(*^^*)

 

 

引用文を使う

引用文としたい分を指定します。

f:id:twistinhaurin:20200811170105p:plain

 

赤枠の所をクリック。

f:id:twistinhaurin:20200811163231p:plain

 

 編集モード画面には下の様に表示されますが、

f:id:twistinhaurin:20200811170736p:plain

 

プレビュー画面で、文章が囲まれていたら引用成功です(^O^)/

f:id:twistinhaurin:20200811170753p:plain

 

 

 脚注をつける

脚注にしたい部分を指定して、 

f:id:twistinhaurin:20200813153034p:plain

 

赤枠の所をクリックすると、  

f:id:twistinhaurin:20200811171605p:plain

 

編集画面では(( ))で挟まれた表示になります。

f:id:twistinhaurin:20200813153331p:plain


プレビューを見てみると *1 と表示され

f:id:twistinhaurin:20200813153604p:plain

 

記事の一番下に⇩表示される様になりました(^O^)/

f:id:twistinhaurin:20200813154001p:plain


 あとがき

今回ツールバーの使い方を記事にしてみて、改めていろいろな事が出来ると思いました (*^^*)

文章を上手く書ける方だったら使いこなせるのではないでしょうか?

私は使いこなせてませんけど・・・

それでは、最後まで読んで頂いてありがとうございました。

このブログが少しでも役立てば嬉しいです。