Bloggerの記事作成に役立つ便利なWebツールまとめ

2022年7月11日月曜日

ブログカスタマイズ

t f B! P L


今回はBloggerの記事作成にあたり、知ってると便利なWebツールをご紹介します。

Bloggerは無料のブログサービスのため、Wordpressなどの有料ブログと比べてしまうと少し不便な部分がありますが、これらのツールを使うことで、より効率よく記事作成ができます。

それでは、いってみましょう。

HTML整形ツール(プチ・デバック機能付き)

普通に記事を書く場合はほとんどの人が「作成ビュー」で書かれると思います。

もちろん作成した内容は「HTMLビュー」に切り替えれば反映されるのですが、インデント(改行)が全くされていません。

この状態で、別途HTMLの埋め込みをしようと思うと、該当する部分がわかり辛く、どこに貼ればいいか全く分かりません。

それを改善してくれるのがこのツール。


使い方は至ってシンプルで「HTMLビュー」で表示されている内容をそのままコピペして変換し、整理されたコードをそのまま貼り付け直すだけです。

ちなみに、HTMLの整形ツールは他にも同じようなものがありますが、変換後をコピペした際に、レイアウトが若干崩れてしまうものがありました。

私の書いた内容になりますが、これが一番レイアウトの崩れがなく対応できたので、まずはこれを使ってみるのがよいかと思います。

ブログカードタグ作成ツール

よく色々な方のブログを見るとリンク先がURLやテキストだけでなく、ボックスのようなもので表示されている事があると思います。

Bloggerのデフォルト機能では作れませんが、こちらもHTMLタグを生成してくれる便利なツールがあります。


ブログカードを作りたいリンク先のURLを貼り付けると埋め込み用のHTMLタグを生成してくれます。

サイトによっては上手く表示されないものもあるので、そこは割り切って使用しましょう。

はてなブログの機能を使う荒業も?

「はてなブログ」を使用したことのある人であればご存知かもしれませんが、はてなブログは記事内にリンクを貼ろうとすると、自動的にブログカードに変換してくれる機能があります。

なので、作成したブログカードのHTMLタグをコピーしてBloggerで使う、という荒業もできなくはありません。

ただし、こちらははてなブログのサービスを利用していないとできません。

無料とはいえアカウントの登録等は必要なので、そこが手間でなければこちらも一つの方法かもしれません。

ソースコード・HTMLタグ生成ツール

たまにブログのカスタマイズに関する内容も書いたりするので、記事内にhtmlタグを表示させたい時があります。

そんな時に役立つのがこの「srctohtml

ここにコードとして表示させたい内容をコピペすると、自動的にへHTMLタグに変換してくれます。

後はHTMLビューにして、そこに変換されたコードを貼り付ければ完了です。

こんな感じ
  • <!-- Google-code-prettifyを追加 -->
  • <script src= "https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"/>
  • <!-- /Google-code-prettify -->

最初はテーマのHTML部分を触ったりする方法もやってみたのですが、他のレイアウトにも影響してしまう可能性もあるので、結果的に一番楽なのはこれかなのではなって感じです。

また、背景色や行番号なども設定できたりするので、自分のブログのデザインに合わせてカスタマイズすることも可能です。

まとめ

というワケで、今回はBloggerを運営するうえで、便利なツールについてご紹介しました。

Bloggerは無料ゆえに、どうしてもWordPressに比べてかゆいところに手が届かない部分がありますが、それを補ってくれるツールはたくさん存在します。

今後も便利そうなツールが見つかれば順次紹介してこうと思いますので、よければ参考にしてみてください。

このブログを検索

ブログ アーカイブ

連絡フォーム

名前

メール *

メッセージ *

その他

QooQ