はてなブログの記事をインポートしたらHタグをSearch Regexで変換しよう

はてなブログの記事ページは、HTML要素のh1h2など「Hタグ」が若干おかしい事になっているのは知っていますか?

はてなブログではブログタイトルにh1タグが使われていますが、個別記事のタイトルにもh1タグが使われています。

1ページにh1タグが2箇所あることになり、個人的にはアカンと思うのですが、仕様なのでどうすることもできません。

ゴリさんゴリさん

h1タグってSEO的には「1ページに対して1個まで」じゃなかったか?

さらに言及しておきたい点はもう1つ。

はてなブログの記事執筆画面では、整形できる見出しは「大見出し、中見出し、小見出し、標準」の4パターン。

それぞれ選択すると適用されるタグは次の通り。

  • 大見出し=h3
  • 中見出し=h4
  • 小見出し=h5
  • 標準=p

タグを気にせずに記事を書いていると、h2タグが忘れ去られてしまいますね。

意識してh2タグを入れたい場合は「HTML編集」の画面で直接h2タグを書き込む必要があります。

もし「タグをまったく意識せずに続けたはてなブログ」からWordpressへサイトを引っ越しする場合は、h3~h5までのHタグを1つ繰り上げることをおすすめします。

  • h3→h2
  • h4→h3
  • h5→h4

1記事ずつ修正するには、膨大な量をこなさなければならない為、非常に大変です。
そこで、Search Regexを使って、タグを一括変換するやり方をご紹介します。

この方法は、データベースを直接書き換えるため念の為バックアップを取りましょう。

Search Regexとは

WordPress内の記事データを一括変換を行うためのプラグインです。

任意の文字列で検索し、ヒットした文字列を別の文字列に一括で置換することができます。
複数の記事を同時に修正可能なので、膨大な量の修正が必要なときに重宝します。

管理メニュー「プラグイン>新規追加」から「Search Regex」と検索し、インストール、有効化します。

Search Regexの使い方

管理メニュー「ツール」内に「Search Regex」が追加されています。

まずは「Regex:」にチェックを入れます。

ここにチェックを入れると、正規表現による検索が有効になります。

「正規表現って何?」という方は、とりあえず「正規表現」というテクニックがある事だけ認識すればOK!
とりあえず、使い方まで理解する必要はありません。

詳しく知りたい方は、まずこちらのサイトからどうぞ。
サルにもわかる正規表現入門

ぶっちゃけ僕はほとんど理解できてませんw

WordPressをカスタマイズする際や、Javascriptなど書く時には、時々正規表現は使われます。

H3→H2に変換する

最初に、h3タグをh2タグへ繰り上げます。

それぞれ、次のテキストをコピペします。

Search pattern

|<h3>(.+)</h3>|

Replace pattern

<h2>$1</h2>

 

コピペができたら、「Search」ボタンを押します。

Results画面に検索でヒットした文字列が表示されました。
赤くなっている部分が検索でヒットした文字列です。

次に「Replace」ボタンを押します。

Results画面に、変換後の文字列が追加されました。
赤い部分のh3タグがh2タグに変換されているのを確認しましょう。

余計な文字まで変換されていたり、全然違う文字列まで赤く表示された場合、Search patternとReplace patternをもう一度見直し・入力し直してみてください。

変換する文字列を間違えた場合、表示崩れなどを起こす原因になり得る為、十分ご注意ください

よく確認し、問題が無ければ最後のボタン「Replace & Save」を押します。
このボタンを押すと、文字の置換が完了します。

あとは、同じ手順でh4→h3、h5→h4の変換を行いましょう。

 

コメント

お気軽にコメントをどうぞ。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

ウェルスナビで損失?