今日は久々?に一人飲みで酔虎伝。木曜だから混んでると思い、電話入れてから行ったけど、結局今日はすごく空いてた。店の人いわく、月曜から昨日までは結構入ってて今日は中日かなぁって感じだそうだけど、木曜にこんなにすいてるのってなかなかない。自分もこの店お気に入りだけど、月曜からでも確かに混んでる。
今日もいかバターごはん。なんかまた食べたくなっちゃう系。んで泊まり。
なかもとてれび・鏡のブログデータをすべてなかもTOP!にも取り込んで、なかもとてれびのネームサーバーも移行先レンタルサーバーのものへ変更、メールも移行し、たぶんこれで、web関係のものはすべてレンタルサーバーへの移行が完了した感じ。
ついでにブログ開始前の古いなかもとてれびのデータがローカルにあるので、それもサーバーにアップして、過去のなかもとてれびも見れるようにした。過去のなかもとてれびには古い日記があったりして、懐かしい。一部動かないような場所もあるけどね。
これで、移行元のレンタルサーバーは解約してもいい状況になったので、一安心。
なかもとてれび・鏡の移行のつづき。MT5からWordpressへの移行の情報などを調べてるうち、あっと思わせるものが!それはいきなりサーバーを移転するのではなく、ローカルにサーバーを立てるというもの。
まさに目から鱗だった。もともとなかもとてれびは自宅サーバーで開始したのだ。ローカルで思う存分試行錯誤しながら完成させて、最後にレンタルサーバーにアップすればいいんだよ!あー、なんで気付かなかったんだろう?
ということで、ローカルサーバー構築には、XAMPPを使用。XAMPPはApache、MySQL、PHP、Perlがセットになったディストリビューションでローカルで動かす分にはすぐ環境が作れる。まずデータベースを作成しWordpressをhtdocsディレクトリーに入れてMT5からの移行開始。
①MTの記事をエクスポート
もともとMT3.3だったのをMT5.2に上げたのは記事のエクスポート機能を使いたかったからだが、MTのツールにあるはずの「記事のエクスポート」がなぜか表示されていない。プラグインが必要なのか?といろいろ調べたけどそうではないらしい。もしやと思いダミー記事を作成してみたら「記事のエクスポート」が表示されるようになった。既存のデータベースを残してアップグレードする方法は、厳密にいえばアップグレードではなく新規作成のデータ移行方式。インポートされた記事しかない状況だと、記事一覧には表示されるが内部的には記事がないと思っちゃってるということか。これで記事のエクスポートは無事完了。
画像ファイルが保存されたディレクトリーもFTPでダウンロードしておく。
②Wordpressのパーマリンク設定
パーマリンクをMTのものと合わせる。なかもとてれび・鏡の場合は/yyyy/mm/投稿名.phpなので
カスタム構造: /%year%/%monthnum%/%postname%.php
③Wordpressにインポート
WordPressのダッシュボードのツールにあるインポートで、MTのデータをインポートする。インポートの画面で選択するのは、「Movable TypeとTypePad」。ただしインポートファイルの最大サイズが2MBまでとなっているのでこの制限をなくすために、Wordpressのインストール・ディレクトリーにある.htaccessに以下を追記する。
#Change upload limits
php_value memory_limit 34M
php_value post_max_size 33M
php_value upload_max_filesize 32M
php_value max_execution_time 600
#Change upload limits end
追記したらインポート。
次に画像ディレクトリーも適切な場所にコピー(記事データが参照できるように適切な場所へ)する。
これで一応サイトは見れるようにはなる。少なくとも記事は表示される。が、ここからが一番面倒だった。画像が表示されない、サムネイルは表示されてもリンク先画像が表示されない、など。
④画像リンクURLの修正
画像が表示されない原因は、MTのエクスポートデータの中を見たり、Wordpressが表示したページのソースを見たりすれば判断できた。要は画像リンクURLが実際の画像のパスと合っていないのだ。この修正はエクスポートデータを直接編集(文字列の置換などを使って)してインポートしなおす方法で実施したが、なかなかいっぺんにはうまくいかないので何度もそれの繰り返し。ある程度できたところであとはWordpress上で修正とすればよいか。
⑤記事の見栄えの修正
なかもとてれび・鏡で作った記事は画像配置のために表などをよく使っているがそのタグはそのまま移行される。とどうなるかというと、表のセルの大きさ(幅など)がめちゃくちゃになって表示されてしまい、なんだこれ?状態。うーん。困ったけどこれ直すのって1つずつやるしかないな。気が向いたらだけど。ブログテンプレートに合わせた記事の作成は、昨今のレスポンシブデザインのテーマ適用とかを考えた場合はよくないなと感じる。これってなかもとてれび・鏡に限った話ではなく、移行完了した当ブログもまったく同じ。もういまさらムリって感じである。
WordPressでは、ダッシュボードの一般設定で、Wordpressアドレス(Wordpressをインストールしたアドレス)とサイトアドレス(ブラウザから指定するサイトのアドレス)が設定できるのだが、nakamo.topではそう設定してもうまくいかなかった。あれ?前からそうだったっけ?
ということで調べてみたら他にもやらないくてはいけないことがあったので、そのメモ。アクセスカウンタ見ても他にアクセスしてる人まだいないっぽいから、なかもTOP!のアドレスはこれまでのnakamo.top/wordpress/からただのnakamo.topに変更。
①ダッシュボードの一般設定でサイトアドレスを変更
②index.phpの変更
wordpressがインストールされたディレクトリにあるindex.phpを以下のように更新して、サイトのディレクトリーに移動。
変更前:require( dirname( __FILE__ ) . ‘/wp-blog-header.php’ );
変更後:require( dirname( __FILE__ ) . ‘/wordpress/wp-blog-header.php’ );
今日なかもび!にyoutubeにアップしてある動画を埋め込んだときのこと。なかもび!はレスポンシブル・デザインに対応したテーマを使っているが、埋め込んだ動画部分がブラウザに合わせてサイズが変動しないことに気付いた。
ということで調べてみると、CSSを使えば対応できることが分かったのでそのメモ。
①埋め込んだiframeタグをdivで囲む。
例:
<div class=”aaa(適当なクラス名)”><iframe ________></iframe></div>
②CSSにクラスを設定する。
例:
.aaa(適当なクラス名) {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.aaa(適当なクラス名) iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
とこれで対応できた。ただひとつ問題が。今使っているテーマがバージョンアップされたらCSSも上書きされるため、バージョンアップの都度CSSを変更しなくてはならない。とそこで活躍するのが、Wordpressの子テーマの機能ということも分かった。子テーマとはテーマ(親テーマ)の内容を定義しなおし上書きすることができるテーマであり、これを利用すれば親テーマがバージョンアップされても定義しなおした内容は子テーマとして保持されるというわけである。
今回はCSSだけ変更してみたのでそのメモ。
①子テーマ用のディレクトリを作成
テーマディレクトリ(wordpress/wp-content/themes)以下に子テーマ用のディレクトリ(子テーマ名で)を作成する。
②style.cssの作成
親テーマを上書きするためのstyle.cssを作成する。下記例にあるTheme NameとTemplateが必須項目で、これを記述すればWorkdressが子テーマとして認識する。@import urlは親テーマをインポートするための文言。そのあとに上書きしたい部分を記述する。作成したcssを①で作成したディレクトリにアップロードする。
例:
@charset “utf-8”;
/*
Theme Name: 子テーマの名前
Template: 親テーマの名前
Description: 親テーマの子テーマです
Author: 自分の名前など
Version: 0.1.0
*/
@import url(“../親テーマの名前/style.css”);
.aaa(適当なクラス名) {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.aaa(適当なクラス名) iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
③子テーマの有効化
WordPressで子テーマを有効化する。
これでうまくできた。
お遍路さんの旅-第4回 高知2回目の旅のしおりが完成しました。初案はボツ、新たに作成しなおし。
四国八十八ヶ所霊場の第27番札所から第36番札所、龍河洞、高知城、桂浜を巡る計画です。
旅のしおりをよいものとするために、出発までに充実化しながら少し気にかけていたこと。それはネットから入手した画像の利用。境内図とかルートマップとか、まぁ個人利用だからつつかれることはないとは思うけど、やはりその辺はある程度やっとかないとまずいかな。
ということで、とりあえずGoogleマップ/Earthの画像には著作権表示を入れて作成しなおし。境内図もGoogle Earthを使って自分で加工して作成。これでもまだ多少気になるものもあるけど、ここまでかなぁ。
旅のしおり更新に伴い、なかもび!も充実化、というか消失前とは少し変えてみた。それぞれの寺院の簡単な説明ページを作り、それをしおりから参照する方式。それで、実際にその寺院に行った後にそこでの写真をページに更新するといい感じになるなと。旅のしおりを作るときに下調べが必要となるため、旅に行ったときにもある程度知識を持った形にできる。
ということで、なかもび!と、旅のしおり、更新充実化中。