今日、自宅サーバ上のGhostからはてなブログへ引っ越しを行った。
どちらもマークダウン形式で記事をかけるため、記事自体の変更は少なくすんだ。
引っ越しの際行ったことのメモ。
記事の移行
手打ち。50個ほどの記事を3時間ぐらい頑張って移行した。
はてなブログのカスタマイズ
以下の3つの設定をした。
アクセス解析、PtEngine
以前から愛用しているPtEngineの設定を行った。
設定の仕方は簡単で、PtEngineの設定画面より、解析コードをはてなブログに設定するだけ。
これを、ここに
貼っつけるだけ。
こんな感じにアクセス解析が行えるようになる。
はてなブログユーザなら無料で使えるらしいので、おすすめ。
ソースコードの強調表示、Prism.js
はてなブログは標準でソースコードの強調表示に対応しているらしいのだが、少し見た目が貧相(?)なので愛用していたPrism.jsを導入した。
<pre><code class="language-css">* {
font: "Meiryo";
color: #FFFFFF;
background-color: #000000;
}
</code></pre>
のように書くと、
* {
font: "Meiryo";
color: #FFFFFF;
background-color: #000000;
}
のようにソースコードを色分けして記載できるようになる。
※Ghostの時はHTML直接書かなくても、Markdown記法のままで書くことができた…。そのうちこの辺自動化するスクリプト書く。
導入の仕方は、
- Prism.JSのウェブサイトより、必要な言語を選んでjsファイルとcssファイルをダウンロードする。
- PtEngineの時と同じように、jsファイルの内容をフッタに書き込む。(
<script>タグで囲うこと) - cssファイルの内容を、フッタの設定の下にある、CSSデザインの欄に書き込む。
ブログで使えるアイコン、icono.css
最後に、CSSのみによってアイコンを表現するCSS、icono.cssを導入した。
導入の仕方は、Prism.JSのCSSファイルの時と同じなため省略するが、導入するとのようなアイコンを記事に埋め込めるようになる。
CSSのみで表現されているので、アイコンの色をいくらでも変更できる。
リダイレクトの設定
以前のブログがらリダイレクトをする設定をしておかないと、せっかくリンクを貼ってくれた人や、ブックマークをしてくれた人などがアクセスできなくなってしまう。
そこで以前の記事からリダイレクトをする設定を行う。
今回はnginx。
以下のような指定をserver欄に追記した。
server {
~省略~
rewrite ^/$ http://新しいブログ/ permanent;
rewrite ^.+/(.+?)/?$ http://新しいブログ/entry/$1 permanent;
}
これにより、http://古いブログ/年/日付/記事名というURLを、http://新しいブログ/entry/記事名と書き換えることができる。
あらかじめ、はてなブログの記事の設定において、カスタムURLという機能を用いて古いブログと同じ記事名を設定しておく必要がある。
