はてなブログ開発ブログ

はてなブログからの公式のお知らせを発信します。

サイドバーに設置できるHTMLモジュールを、はてな記法やMarkdownでも編集できるようにしました

はてなブログでは、サイドバーに設置できるHTMLモジュールの機能を拡張し、はてな記法やMarkdownといった簡易マークアップ言語でも編集できるようにしました。

HTMLの記述に不慣れな方でもサイドバーを手軽にカスタマイズできるよう、HTMLモジュールの編集モードとして「はてな記法」と「Markdown」が選択できます。それぞれ、はてなブログの編集モードと同じ記述方法で、サイドバーにコンテンツを配置できます。どうぞご利用ください。

「HTML」モジュールについて

HTMLモジュールは、ブログパーツやソーシャルプラグインをサイドバーに設置する際に利用します。配布されているブログパーツ等のHTMLコードをそのまま貼り付けられるだけでなく、自由にHTMLを記述してテキストや画像をサイドバーに配置することができます。

HTMLモジュールで編集モードを選択するには

  1. ダッシュボードのデザイン設定画面で「カスタマイズ」タブの「サイドバー」を開きます
  2. 「モジュールを追加」をクリックして表示される「モジュールを追加」ウィンドウで、「HTML」モジュールを選択します
  3. 「モード」プルダウンメニューで「はてな記法」や「Markdown」を選択し、配置したいコンテンツをそれぞれの記法で記述してください。なお、デフォルトの「HTML」が従来通りにHTMLを記述するモードです

HTMLモジュールで「記法」を選択

HTMLモジュールで「はてな記法」や「Markdown」を選択できる

HTMLモジュールの編集モードを選択する際のヒント

  • ブログパーツやソーシャルプラグインなど、配布されているHTMLコードをそのまま貼り付けるときには、デフォルトの「HTML」モードを選択してください
  • コンテンツを自由に配置する際に、「HTML」「はてな記法」「Markdown」の中で記述しやすい編集モードを選択してください
  • 「HTML」モードでは、HTMLだけでなくhttp:記法やasin:記法など、はてな記法の一部も記述できます
  • 「はてな記法」モードでは、そのほか表組みやリストなどを含むすべてのはてな記法を記述できます(デザインテーマによっては、サイドバーの表組みやリストは期待した通りにデザインされていない場合があります)
  • 「HTML」モードではテキストを改行する際に明示的にbr要素を追加したり、p要素で段落として記述する必要がありますが、「はてな記法」や「Markdown」では改行や1行空きを入れるだけで自動で適切なHTMLに展開します