のれん沼

語学やゲームや日々思うことについてタラタラ書いてます。

はてなブログのChrome拡張機能で絶対入れたほうがいい「Chrome Add-on for Hatena」【自分用】

h2タグを設定したいけど一々HTML編集画面に移って設定するのはメンドクサイ! 何かいい方法はないかなぁ…

今日はそんな悩めるブロガーさん向けの記事です。(半ば自分用でもあります)

 

 

この記事を読むと

・H2タグを簡単につけられるChrome拡張機能がわかる

 

 

皆さん、ブログを書くときに"見出し"ってつけてますか?

f:id:noirened:20181212113326p:plain

見出しをつけると、話題の区切り目がわかりやすくなるので絶対つけた方がいいのですがそのつけ方がなかなか面倒です。

 

そこで、その作業を超簡単にできる「Chrome Add-on for Hatena」という拡張機能を紹介したいと思います。

 

そもそも、はてなブログの大見出しは<h2>でなく、<h3>!?

そうなんです。

ブログを書いていると左上に"見出し"っていうのがあるんですけど。

f:id:noirened:20181212113847p:plain

それの大見出しを選択すると、<h3>タグが設定されてしまうんです。

そこでソースコードを見てみると、

<h1>...タイトル

<h3>...大見出し

<h4>...中見出し

であり、h2タグがないことが分かりました。

 

あまり関係ない、という見解もありますがh2が抜けていると検索順位にも影響しうるみたいです。これは大変だ!!

 

だからと言って、一々HTML画面に行って<h3>を<h2>に書き直すのはメンドクサイですよね…

f:id:noirened:20181212122448p:plain

ここから見出しの文章を探すのは大変

そこで「Chrome Add-on for Hatena」の出番です!!

 

はてなブログ専用のGoogle Chrome拡張機能「Chrome Add-on for Hatena」のできること

すごい説明口調な見出しになっちゃってますね。すみません…

 

chrome.google.com

上のリンクからダウンロードできます。

 

www.notitle-weblog.com

この拡張機能を作ったシロマさんの記事です。

 

さてこの拡張機能ですが、これ一つでいろんなことができるんです。

その中でも実用的な機能をいくつか紹介します。

f:id:noirened:20181212114826p:plain

これが実際の画面です

<h2>タグをワンクリックで設定できる

これが最大の強みだと思っております。

先ほども述べましたが現在はてなブログで<h2>タグを設定する方法は、

見出しを書く

タグが<p>になっているのでHTML編集画面に移動し<h2>に変更する

 

なのですが、

 

この拡張機能では、

見出しを書く

見出しをドラックして"<h2>"ボタンをクリックする

 

これだけで<h2>タグが設定されます。クッソ楽ですこれ。

 

目次をつけられる

"目次"ボタンをクリックすればカーソルの時点で目次が設定されます。

これははてなブログ上でもできますね。

 

背景をグレー化する

こんな感じで背景をグレー化させて、文章を強調させられます。

強調させたい文章をドラック選択し、"背景をグレーにする"ボタンをクリック!

 

他にも<p>にクラスを付与できたりするのですが、少しHTMLの知識が必要になってくるので割愛します。

 

「Chrome Add-on for Hatena」ははてなブログをするんだったら必須の拡張機能!

僕は普段学校で記事を書くのですが、その都度これをダウンロードするくらいこれを使っています。

タグ付けやクラス付けは結構めんどくさく、ストレスになることが多いのでその作業を軽減させてくれるこの拡張機能はおすすめです!

 

chrome.google.com

 

↑よければポチっとお願いします!

ではでは~