絶対パス、相対パス

アサブロをダウンロードする際に気を付けなければならないのは、CSS（Cascading Style Sheets ）ファイルである。
アサブロのテンプレートを使っているので、アサブロのCSSを読み込むのだが、このCSSは絶対パスで書かれている。

というわけで、アサブロに直接CSSを取得しに行ってしまうのだが、google driveとアサブロは違うサイトである。違うサイトからCSSファイルを取得することは、セキュリティ的に問題があるので、ほとんどのブラウザでCSSを取得してくれない。XSS（クロスサイトスクリプティング）になってしまうからだ。（解説記事はこちら［柔軟すぎる］IEのCSS解釈で起こるXSS ）

で、同じサイトにCSSファイルを移設する必要があるのだが、ここで出てくるのが、絶対パスと相対パスの違いだ。

Website Explorerで、そのままダウンロードすると、CSSファイルのパスは書き換わらないので、http://s.asablo.jp/css/がそのまま書かれている。

アサブロの場合、ブログの記事自体は、http://darkmark.asablo.jp/blog/ といったような、パスなので、Web Explorerは、/blog を基準パスとして文字列の置換をする。

具体的には、http://darkmark.asablo.jp/blog/ が、./blog/に置き換わるわけだ。

そこで、CSSを/blogと並列に、置くようにならべて、http://s.asablo.jp/css/　を、../css/ に置き換えてやる必要がある。

Website Explorerでは、設定で、外部サイトを内部サイトとして置き換える設定があるが、うまく使いこなすことができなかったため、秀丸を使ってgrep置換した。

こうすることで、CSSが./css/から参照されるようになったのだが、大きな問題が出てきた。
アサブロのパスが、日付ごとに下記のようにアーカイブされているのだ。

/blog/2014/07/04/7379927
（この7379927は、記事のIDで、実際にはパスとしてURL上出るのだが、Website Explorerでは、HTMLファイルとして保存してくれている。）

こうなると、この記事からの相対パスは、../../../../css/にしなければならず、/blog/以下を一括置換では対応しきれない。

ま、地道にフォルダ一個ずつたどって置換すればよいのだが・・・・
ダウンロードする前に気づけばよかった。

(追記)
下記の順番で置換すれば、年数ｘ１２＋αぐらいの回数で置換が終了する。
（私の場合、１２０回くらいだったが、２０秒で１回は終了するので、１時間程度の作業で済む。
したがって、マクロを組んだり、ツールを探したりせず、地道にやりました。）

１．/blog/ を対象に置換（サブフォルダは対象にしない）　　　　　　　../css/
２．/cat/ を対象に置換（サブフォルダ対象にする）                           ../../../css/
３．/年/月/ フォルダを対象に置換（サブフォルダ対象にしない）     ../../../css/
４．/blog/を対象に置換（サブフォルダ対象にする）　　　　　　　　　../../../../css/

３がかなり時間がかかりますが、これで全部変換されます。
あと、/blog/archive.html に関しては、Javascriptを使っているようなので、

<meta http-equiv="content-script-type" content="text/javascript">
<script src="http://s.asablo.jp/js/expandimage.js" type="text/javascript"></script>
<script type="text/javascript" src="http://s.asablo.jp/editor/watermark_min.js?20110407_2"></script>

を削除する必要がありました。