読者です 読者をやめる 読者になる 読者になる

はてなブログ開発ブログ

はてなブログの新機能など開発に関する情報、公式のお知らせを発信します。

サイドバーの記事一覧モジュールで、記事タイトルの表示文字数を指定できるようにしました(ほか1件)

はてなブログでは、サイドバーに追加できる記事一覧モジュールにおいて、指定した文字数に記事タイトルを切り詰めて表示できる機能を追加しました。また、Markdownの脚注記法に対応しました。

サイドバーの記事一覧モジュールで、記事タイトルの表示文字数を指定できるようにしました

はてなブログのサイドバー(PCおよびレスポンシブデザイン)には、「最新記事」「関連記事」「注目記事」といった記事一覧モジュールを配置できます。この記事一覧で、表示する記事タイトルの文字数を指定できるようにしました。記事タイトルに長短があっても、記事一覧モジュールの見栄えをほぼ一定にデザインできます。

ダッシュボードの「デザイン設定」画面で、「カスタマイズ」タブの「サイドバー」からそれぞれの記事一覧モジュールを選択すると、設定ダイアログに「タイトルを表示」という項目が追加されています。デフォルトではタイトル「全体」を表示しますが、「文字数を指定する」を選択して「表示する文字数」を指定すると、長いタイトルを先頭から指定した文字数で切り詰めて表示します。

記事一覧モジュールで記事ごとに表示するタイトルの文字数を指定できる

記事一覧モジュールで記事ごとに表示するタイトルの文字数を指定できる

サイドバーへのモジュールの追加・設定については、ヘルプ「サイドバーにモジュールを設置する」や、以前の告知などを参照してください。

サイドバーの「最新記事」をカスタマイズできるようにしました - はてなブログ開発ブログ

※現在のデフォルトテーマ「Life」をはじめとする1カラムレイアウトのデザインテーマや、レスポンシブデザイン対応のテーマをスマートフォンで表示した場合、サイドバーは記事本文の横ではなく下に配置されます。

Markdownの脚注記法に対応しました

はてなブログの記事編集画面で利用できるMarkdownモードで、Makrndownの脚注記法に対応しました。例えば、次のように記述します。

Markdownモードでの脚注記法[^1]に対応しました。

[^1]: ここに脚注の内容を記述できます。

どうぞご利用ください。

これは次のようにフォーマットされます。

Markdownモードでの脚注記法1に対応しました。/どうぞご利用ください。/1. ここに脚注の内容を記述できます。

はてなブログの記事編集画面で利用できる編集モードについては、ヘルプ「編集モード」などを参照してください。

Markdownについて

Markdown(マークダウン)は、簡易な記法でWeb文書を記述できる軽量マークアップ言語です。GitHubなど、Webエンジニアリングの現場を中心に広く利用されています。はてなブログでは、オリジナルの記法や、GFM(GitHub Flavored Markdown)の一部に対応しています。今回サポートした脚注は、PHP Markdown Extra由来の記法です。

※記事編集画面の入力補助ツールバーにある「脚注」ボタンなどでは、Markdownモードでもはてな記法の脚注をサポートしています。はてな記法とMarkdownの脚注に互換性はなく、それぞれ個別にフォーマットされます。

カレンダー形式で公開記事を確認できるダッシュボードの機能「こよみモード」を公開しました

はてなブログは11月7日(月)、これまで公開した記事をカレンダー形式で一覧できる「こよみモード」を公開しました。自分のブログの更新状況を確認したり、過去の投稿記事を振り返ったりできます。どうぞご利用ください。

新機能「こよみモード」

こよみモードの見た目

こよみモードは、PCからご利用できます。ブログのダッシュボード(http://blog.hatena.ne.jp/)を開き、「ブログの概要」でタブ「こよみモード」をクリックしてください。公開範囲はブログの所有者およびブログメンバーです。他ユーザーのこよみモードを見ることはできません。

カレンダーから記事が投稿できる

記事を投稿した日のカレンダー上に、記事タイトルが表示されます。空欄の日付をクリックすると記事編集画面が開き、いつものように記事を投稿することができます。なお、過去や未来の日付の場合、クリックした日付が記事の投稿日となります。

※未来の日付で投稿した場合、デフォルトで予約投稿になります。そのまま公開したい場合は、編集オプション「指定日時で予約投稿する」のチェックを外し、公開してください。

「あゆみ」で過去に投稿した記事を振り返る

カレンダー右のあゆみには、過去の同じ月に投稿した記事を表示します。表示する記事は、1年につき1件で、こよみモードのカレンダーで表示されている月を起点に5年前までが対象です。

ひと月に複数の記事を書いている場合は、”今日”の日付をもとに一番近い日の記事を表示するため、日によってあゆみは異なります。

こよみモードで、あなたの毎日を書き残そう

こよみモードは、はてなブログ5周年を記念した機能です。2011年11月7日にベータ版をリリースしたはてなブログは、多くのユーザーさまに支えられ、本日5周年を迎えることができました。

今回の5周年を記念して「いままでも、これからも、あなたの毎日を書き残そう」というキャンペーンを実施しています。これは、なんでもない「毎日」や特別な「今日」を書き残す場所として、自身の「いままで」を振り返る場所として、はてなブログをご利用いただきたいという気持ちを込めたものです。

ブログのある毎日に、こよみモードをご利用いただけると幸いです。

ブログのサイドバーの「プロフィール」に最終更新の状況を表示できるようにしました

はてなブログでは、サイドバーの「プロフィール」モジュールに、ブログの最終更新を表示できるようにしました。さらにブログを継続して更新していれば、継続期間も表示します(継続した投稿がない場合には最終更新のみが表示されます)

プロフィールに最終更新を表示する

プロフィールに最終更新を表示する

継続して更新しているブログであることを表示することで、運営者がブログを更新するモチベーションとしたり、興味あるブログの読者になるときにどれくらい更新されるブログなのか目安にできます。どうぞご利用ください。

プロフィールに最終更新を表示するには

デザイン設定画面 の「カスタマイズ」ページで「サイドバー」を開きます。「プロフィール」モジュールを選択し、「最終更新」欄の「表示する」にチェックを入れてください。

プロフィールモジュールの設定画面

「プロフィール」モジュールで「最終更新」を表示する

ブログのサイドバーに表示できるモジュールについては、ヘルプ「サイドバーにモジュールを設置する」を参照してください。

※ブログのサイドバーにモジュールを表示する機能は、PC版(およびレスポンシブデザイン)で利用できます。

ブログのaboutページを自由に編集できるようにしました(ページタイトルについて追記あり)

はてなブログでは、ブログに関する情報を表示するaboutページを自由に編集できるようにしました。

これまではブログを作るときに登録した情報が自動的に表示されていましたが、今回の機能追加により自分で自由に設定することができます。また、編集できる項目が増え、これまで以上に表現の幅が広がりました。自己紹介やポートフォリオの場として、どうぞご利用ください。

aboutページ

新しくなったaboutページ

新しいaboutページは、PC・スマートフォン・iOSアプリで設定・閲覧できます。

aboutページの編集画面へのアクセス方法

ダッシュボードの「設定」画面にある「基本設定」ページから行えます。「aboutページ」の項目にある「aboutページ編集」のリンクをクリックすると、aboutページ編集画面が開きます。

編集画面へのアクセス方法

基本設定画面にある「aboutページ編集」をクリック

aboutページ編集画面が開く

aboutページ編集画面が開く

aboutページ編集画面で設定できる項目

aboutページ編集画面では以下の項目を編集できます。

項目 説明 設定内容
自由記述欄 ブログタイトル下に入る文章 自由に記述できる(記述モードを「HTML・はてな記法・Markdown」から選択できる)
プロフィール ユーザー名(はてなIDおよびニックネーム)と、連携設定を有効にしている外部サービス(Twitter・Facebook)のフォローボタン 表示/非表示の切り替えを選択
リンク メールアドレスとウェブサイトURL それぞれ入力できる
ブログ投稿数 ブログを開設してから今日までに投稿した記事数 表示/非表示の切り替えを選択
ブログ日数 ブログを開設してから今日までの日数 表示/非表示の切り替えを選択
継続期間 その時点で連続してブログを書いている期間 表示/非表示の切り替えを選択
読者 購読者人数ならびに購読者一覧 表示/非表示の切り替えを選択

これまでaboutページに表示されていた「ブログ名」「ブログ説明文」「言語」「公開範囲」「編集モード」の項目は、aboutページへの表示対象から外しました。

※項目の表示順を並び替えることはできません。

aboutページとは

aboutページは、ブログに関する情報が表示されるページで、ブログのフッターやサイドバーに表示されるプロフィールやIDをクリックすると移動できます。aboutページは、ブログのドメイン名に/aboutを付けたURLで、例えば次のようになります。

http://staff.hatenablog.com/about

※aboutページは、非表示にはできません。

【追記】ページタイトルも設定できるようにしました

aboutページ編集画面に「ページタイトル」欄を追加しました。aboutページのページタイトル(title要素)は、デフォルトで「このブログについて - ブログ名」となりますが、このうち前半の「このブログについて」の部分を変更できます。(2016年9月7日追記)

【追記】自由記述欄の書き方について

自由記述欄では「HTML」「はてな記法」「Markdown」から記述モードを選択できます。デフォルトの「HTML」モードでは、段落や改行もHTML(p要素やbr要素)で指定してください。

<p>このブログは、私の日記です。<br>ほぼ毎日更新します。</p><p>よろしくお願いします。</p>

例えば、上記のように記述すると、下記のように表示されます。

このブログは、私の日記です。
ほぼ毎日更新します。

よろしくお願いします。

(2016年9月7日追記)

独自ドメインを利用したブログを他のサービスからはてなブログへ移転する際に、記事のURLを引き継げるようにしました(はてなブログPro)

はてなブログでは、記事を配信するディレクトリをカスタマイズできる機能を、有料プラン「はてなブログPro」ユーザー向けにリリースしました。はてなブログの記事URL(例えばexample.hatenablog.com/entry/2016/09/01/000000のうち、ドメイン名に続くentryの部分を変更できます。

これにより、独自ドメインを利用したブログを他のサービスからはてなブログに移転する際に、元の記事URLを引き継ぐことができるようになりました。それまでのソーシャルシェアやWeb検索、はてなブックマークなどのリンクを維持したまま、はてなブログを利用できます。

※当機能は、独自ドメインのブログを新規にはてなブログへ移転することを想定したものです。また、移転元のURLの形式等によっては、引き継げないこともあります。以下の説明や注意点をお読みのうえでご利用ください。

はてなブログでは、さまざまなサービスから引っ越しやすく使いやすいブログを目指して、今後も改善を進めてまいります。

記事を配信するディレクトリを変更するには

はてなブログの管理画面で、左側のメニューバーから「インポート」を選び、他のサービスやソフトウェアからの移転を開始します。

ブログデータのインポートが完了すると、「URLの引き継ぎ」が案内されます。

URLの引き継ぎ

URLの引き継ぎ

記事を配信するディレクトリをここ」のリンクをクリックすると、新設した「記事のディレクトリ」ページに移動します。ここで、記事を配信するディレクトリをデフォルトのentryから変更できます。移転元のブログにディレクトリ部分がない場合には、ディレクトリを空白にも設定できます。

記事のディレクトリ

記事のディレクトリ

「初期状態に戻す」ボタンを押すと、デフォルトのentryに戻ります。

※ディレクトリとして、はてなブログで使用しているaboutarchiveなどを設定することはできません。

ディレクトリを変更する際の注意点

記事を配信するディレクトリは、新規にインポートした記事だけでなく、ブログ内のすべての記事に影響します。ディレクトリを変更した以降に投稿する記事はもとより、既存の記事のパーマネントリンクも変更されます。

すでに運用しているブログでディレクトリを変更すると(独自ドメインであるかどうかを問わず)、はてなブックマークやはてなスター、ソーシャルシェアなどは移行されません。ただし、以前のURLへのアクセスは、新しいURLにリダイレクトします。変更していたディレクトリを元に戻した場合も同様です。

独自ドメインの記事URLを引き継ぐ仕組み

ブログの記事URLは、一般的に次のような形式をしています。

http://blog.example.com/article/20160801

blog.example.comが、ブログのドメイン名です。記事のパスarticle/20160801のうち、articleが記事を配信するディレクトリで、20160801が記事名です。ブログの設定やサービスによっては、ディレクトリ部分がないこともあります。

このブログから記事をエクスポートし、はてなブログにインポートすると、次のようなURLになります(下記の「URLを引き継いでインポートするコツ」も参照してください)

http://example.hatenablog.com/entry/20160801

はてなブログProに加入し、移転元と同じ独自ドメインを適用すると次のようなURLになります。

http://blog.example.com/entry/20160801

今回の機能によって、記事を配信するディレクトリをentryから移転元と同じarticleに変更することで、記事URLをそのまま引き継ぐことができます。

URLを引き継いでインポートするコツ

記事URLを引き継ぐ仕組みをまとめると次の表のようになります。

URLの部分 引き継ぐ仕組み
ブログのドメイン名 独自ドメインを利用する(はてなブログPro)
記事を配信するディレクトリ 今回の機能により同一に設定する(はてなブログPro)
記事名 ブログデータに指定された値がインポートされる

インポートした際の記事名については、移転元からエクスポートしたブログデータで以下のように指定された値になります。

ブログデータ 影響する値
MovableType形式 BASENAMEフィールドの値
WordPress形式 link要素の値

記事名がうまく引き継がれない場合には、ブログデータのこれらの値を見直してみてください。

※記事名として?p=40のようなパラメーターをそのままインポートできないため、この形式のURLを引き継ぐことはできません。

間違って削除した記事を復元できる「ゴミ箱」機能を公開しました

はてなブログでは、間違って削除してしまった記事を復元できる「ゴミ箱」機能を公開しました。復元できる期間は過去30日間です。どうぞご利用ください。

「ゴミ箱」の管理画面

「ゴミ箱」の管理画面

ダッシュボードの「記事の管理画面」から記事を削除した直後、画面上に「記事を削除しました(ゴミ箱を見る)」というメッセージが表示されます*1。リンクをクリックすると、「ゴミ箱」の管理画面に遷移します。

また、記事編集画面の右下にある「この記事を削除」ボタンをクリックし記事を削除すると、上記のメッセージを含む「記事の管理画面」に遷移します。

「ゴミ箱」へのリンクは、「記事の管理」画面の一番下にもあります。

削除した直後に現れるメッセージ

削除した直後に現れるメッセージ

「記事の管理」画面の一番下にある「ゴミ箱」へのリンク

「記事の管理」画面の一番下にある「ゴミ箱」へのリンク

復元の方法と条件

「ゴミ箱」の管理画面にある「復元する」ボタンをクリックすると、記事の編集画面が開きます。「公開する」および「下書きを更新する」ボタンで保存すると、記事が復元します。

記事の削除から30日間が経過すると自動的にデータが消去され、それ以降は記事の復元ができません。また、削除から30日が経過していない記事を「ゴミ箱」から完全に削除することはできません。

※2016年8月5日以前に削除された記事は復元できません。

【追記】復元した記事の編集モードはすべて「見たまま」になり、変更できません。

なお、PC版、touch版、アプリ版から削除されたすべての記事が「ゴミ箱」に入りますが、「ゴミ箱」の管理画面および復元機能は現状PC版でのみ提供しております。ご了承ください。

*1:メッセージは数秒で自動的に消えます

他のサービスからはてなブログに移転する際に、画像データも一緒に引っ越しできるようにしました。これまでのインポートにも有効です

はてなブログでは、ブログデータをインポートする際に、記事中の画像データをあわせて移行できる機能をリリースしました。移行した画像データは、はてなブログが利用しているウェブアルバム「はてなフォトライフ」の専用フォルダに保存されます。

他のサービスなどからブログを移転するときに、文章だけでなく記事に貼った画像も一緒に引っ越すことができます。どうぞご利用ください。

画像データの移行は、ブログの「インポート」画面で、ブログデータをインポートした後に実行できます。これまでにブログデータをインポートしたことがあれば、同様に過去のデータについても移転元のブログから画像を移行することができます(移転元のブログでデータを削除している場合には移行できません)

※画像データの移行は「一般のブログ」のインポートにおける機能です。はてなダイアリーからのインポートでは、もともと同じはてなフォトライフを利用しているため必要ありません。

ブログデータのインポート時に画像データを移行するには

はてなブログでは、MovableType形式かWordPress形式でエクスポート(バックアップ)したブログデータを、ダッシュボード(PC版)インポート画面からインポートし、他のサービスからブログを移転することができます(はてなブログからはてなブログへの移転を含む)

blog.hatena.ne.jp/my/import(このURLでインポート画面にアクセスできます)

これまでのインポート一覧で「画像データの移行」を開く

インポート画面では、ブログデータをインポートするごとに、日時や記事数が「これまでのインポート」一覧に記録されます。この一覧表の右端に追加された「画像データの移行」オプションを開くと、そのときにインポートしたブログデータについて記事中の画像を移行できます。

※インポートの実行直後には、そのブログデータの「画像データの移行」が開いた状態になっているため、そのまま画像を移行できます。

「画像データの移行」オプション

「画像データの移行」で自分の画像を確認して「移行する」をクリックする

ブログデータにある画像がドメイン・ホスト名ごとにまとめて表示される

ブログ記事には、各種の貼り付けコードも含めさまざまなサイトの画像が掲載されていることがありますが、「画像データの移行」オプションでは、実際に置かれているドメイン・ホスト名ごとに画像がまとめて表示されています。

※過去にインポートした画像を移行する場合など、画像が表示されていないときには「解析する」をクリックしてください。

移転元のブログを選んで「移行する」をクリックする

画像とドメイン・ホスト名を確認し、移転元のブログを選んで「移行する」をクリックします。

同じ場所にある画像が順に処理され、自分のはてなフォトライフのHatena Blog Importフォルダにコピーされます。すべての画像を移行すると該当のドメイン・ホスト名のボタンが「移行完了」となります。なお、画像はコピーされるため、移転元にも残ります。

※移転元のブログに貼られていた他サイトの画像など、自分がアップロードしたわけではない画像を移行してはてなフォトライフにコピーすることは、権利上の問題となることがあります。画像データの移行にあたっては、移転元ブログのドメイン・ホスト名であることを確認してください。

移行の処理は、いったん開始するとブラウザのウィンドウを閉じても継続され、次に「インポート」画面を開いたときに結果を確認できます。

画像データの移行における注意事項

移転元の画像が存在しなかったり、何らかの理由でアクセスできなかった場合には、該当の画像について処理をスキップします。スキップした画像がある場合には、ボタンは「移行停止中」となり、次の機会にあらためて試行できます。

画像データの移行においても、はてなフォトライフの保存容量を越えることはできません。月あたりにアップロードできる容量(無料ユーザーで300MB、Proユーザーで3GB)の9割に達すると、画像のコピーを中断して「移行停止中」状態となります。この場合、次の月になれば移行を再開できます。

同じインポートについて復数のドメイン・ホスト名の移行を実行したり、画像の移行中にインポートの取り消しを行うことはできません。

画像データの移行後にブログデータのインポートを取り消しても、移行した画像データはそのままはてなフォトライフに残ります。削除が必要な場合には、はてなフォトライフの管理画面から作業できます。