ぐーたら主婦ブログをはじめる

テーマは節約と家事全般、ときどきダイエット

はてなのテーマ『マテルアルぽっぷ』がワードプレスみたいで素敵!

SPONSORED LINK

今日はブログをはじめてちょうど11か月目。

本当はブログ開設1周年に合わせて全面改装をするつもりだったのに、どうしてもがまんできなくなって先駆けリニューアルです。

といってもPC版だけです。

閲覧者の割合はスマホ8割り、PC2割なんですけどね。

f:id:rararutan:20180814181629j:plain

スマホ版に関してはわたしの中では完成形なので、変えるつもりはありません。

なので、ロゴとプロフィールアイコンをココナラで依頼して作ってもらいました。

これだけでも結構、雰囲気変わるかな、と。

テンプレートの話題だけで2,000文字を超えてしまったので、ココナラでの話題は次回に持ち越しです。

まるでワードプレス?マテルアルぽっぷ!

まずはテンプレートのご紹介です。

こちらのテンプレートはわたしがよく遊びに行くブロガーさんが使っているのを見かけてから、ずっと気になっておりました。(現在は違うテンプレートに変えられておられます)

え?なにこれ?ワードプレス?

 って思いませんか?

完成度高すぎです。

はてなテンプレートもここまで進化したのか!と感激しましたね。

いつもテンプレートを変えたときに見出しとか引用枠とか目次とか、元々のイメージと合わせるためにちょいちょいいじっておりましたが、今回はほぼノータッチです。

配色設定と、プロフィール画像を大きくしたかったので、その辺だけちょこっといじりましたけど。

あとはもう変えたい場所がないぐらい素敵だったので、そのまま使える~と感激していたのですが、1点だけ大きな問題をかかえておりました。

大見出しのデフォルトがH2に!

なんとこちらのテンプレート、大見出しがH2の設定だったんです。

はてなの書き手の方ならご存知でしょうが、はてなでの一番大きな見出しの設定はなぜだかH2をすっとばしてH3になります。

このため、ワードプレスに移行された方は大変苦労をされるそうです。

 

見出しの順序について、SEOに影響するとかなんとかって話もありますが、それに関してはGoogleの中の人が「影響しない」と明言していることから、あまり気にしないでおりました。

ただし、ユーザビリティの観点においては

H2→H3→H4…

と表示させるのが本来のありかたです。

 

でもまあ、どうせずっとはてなにいるだろうし。

わたしがはてなをやめるときはブログをやめるときだし。

と考えて、見て見ぬふりを決め込んでおりました。

なので今回も、CSS側を書き換えて誤魔化そうと思っていたのですが、なんか唐突にH2の存在が気になってしまって。

 

なんでしょうね。

今まで空気のようなどうでもいい存在だったのに、ちょっとしたきっかけから気になって気になってどうしようもない存在に!

そんな経験、だれでもあるでしょ?

まさしくそれなんですよ。

もうH2君が気になって気になってしょうがない。

このままでは、夜も眠れずに夢にまで出てくるに違いない!

というわけで、すべてを書きかえる決断を下しました。

おすすめ文字列一括置換フリーソフト

マクロとかスクリプトなんてものはちんぷんかんぷんですから、すべて手作業です。

手持ちのテキストエディタではまとめての置き換えができずに面倒だったので、置き換え専用ソフトをダウンロードしました。

使い方はびっくりするぐらい簡単です。

f:id:rararutan:20180814170249p:plain

置換リスト欄には以下のように入力すると、上から順番に変換してくれるので、文字列がかぶってしまうこともありません。

<h3>@<h2>
</h3>@</h2>
<h4>@<h3>
</h4>@</h3>
<h5>@<h4>
</h5>@</h4>

クリップボードからの直接変換に対応してますから、コピペして「置き換え」ボタンをポチッと押すだけです。

区切り文字に使うテキストがデフォルトでは「/」になっているので「@」かなんかに変えときましょう。

バックアップはお忘れなく

作業前にはかならずバックアップを取ってください。

間違って貼り付けて保存しちゃったら、元に戻すのが困難になります。

ダッシュボード設定詳細設定エクスポート

実は作業中、1回だけミスってやらかしましたが、無事にバックアップデータから元に戻すことができました。

はてなブログ編集用のChrome拡張ツール

次におすすめしたいのがこちらです。

www.notitle-weblog.com

このツールがあれば、HTML側で編集しなくても、今後はH2の大見出しを簡単に挿入することができます。

H2を使わないにしても、このツールをいれておけば痒いとこに手が届きます。

とくに「書式を初期化」が便利仕様。

f:id:rararutan:20180814165717p:plain

Chrome Add-on for Hatenaの特徴

  1. 見出しをH2に変換
  2. 目次を入れる(これははてな側にもありますね)
  3. 今日の日付を挿入
  4. テキスト・画像の左・中央・右揃え
  5. 背景をグレーにして強調
  6. 書式を初期化
  7. pタグにクラスの付与
  8. 「記事を書く」「記事を管理」へのリンク

おしまいに

見出しタグの置き換えについては、この方法で正しかったのかどうなのか、実はあまり自信がありません。

もっと簡単で早くて便利な方法を知ってるよ!という方がおられましたら、コメント欄にて教えてくださいませ。

もしかしたら目からうろこの方法があったりするかもしれません。

 

ちなみに、作業にかかった時間は総記事数116で1時間30分ぐらいです。

(途中ミスってロスが発生しておりますが)

1記事当たり46秒の計算になりますね。

 

てか、11カ月で116記事しか更新してないって少ないですよね。

これが毎日更新で300記事超えとかだったら、さすがにやってないかも。

100記事ちょっとだからこそ、がんばれた!ような気がします。

細かいことが気になる性格で、現時点で100記事前後のユーザーさまがおられましたら、はやいうちの対処をおすすめします。