ここ半月の間に、サーバー移転やらMTOS→WPへの移管やらがたくさんありました。
ちなみに、このブログも鯖移転したてホヤホヤです。
今なら自信を持って鯖移転もWP化もできまっせ！
というわけで、今後のために備忘録。

1. まずは移転元サーバーのファイル群を全てバックアップ。
2. MYSQLの管理画面から、データベースの当該テーブルをまるごとエクスポート。
   どのデータベース使ってるかなんかはwp-config.phpに書いてあるよ！
   テーブルは接頭辞でわかるお！
3. wp-config.phpを開いて、移転先サーバーのMYSQL接続情報に書き換える。
4. 移転先サーバーにファイル群を全てアップロード。
5. 移転先サーバーのMYSQL管理画面から、データをインポート。
6. ドメインのDNSネームサーバーを移転先サーバーに変更。
7. DNSが移転先サーバーに切り替わるまでしばし待つ…。
   切り替わったかどうかは、自分はコマンドプロンプトのnslookup使って調べてるよ。
8. DNSが切り替わったら、いつもどおりWPの管理画面へログイン。
   これで通常通り動いていればおｋ！

こっから先はプラグインの設定なので、ひとによっては要らないよ。

1. WP-DBManagerとWP Backup(by BTE)使ってる場合、設定の変更が必要だよ。
   WPの管理画面におおきくエラーが出るので分かるはず。
2. それぞれの管理画面に行って、移転先サーバーに合うようにパスの設定を合わせるだけでおｋ。

以上！
DNSの切替に時間かかるから、この間もやもやするけど、拍子抜けするくらい簡単です。
ある程度知識がある方向けにだいぶ端折っているので、初心者のかたはエロい人がまとめてくれたもっと詳しいまとめを見てやるのがいいよ。

自分のWEBサイトリニューアルをしています。
せっかくなので、新しい技術を沢山取り入れたいと思っています。

その中のひとつが、アイコンフォント。
画像じゃないという点で、色々メリットデメリットはあるみたいです。
とはいえ、画像の切り出しやCSSスプライトを気にしなくて良くなるのは、WEB屋さんにとって大きな利点。
何はともあれ試してみましょう！

今回アイコンフォントに使用したサービスは、こちら。
Font Awesome

どんなことができるの？

Font Awesomeのトップページで書いている、メリットをざざっと訳すとこんな感じ。

• 361個もアイコンあるよ
• CSSでアイコンサイズ、色、シャドウなどやり放題！
• ベクターだから、どんなサイズにも対応するよ
• 商用無料！
• IE7もサポートしてるよ
• Retinaディスプレイにも対応だぜ
• Bootstrapも完全対応！
• チートシートもあるし、インストール型のフォントもあるよ！
• スクリーンリーダーにも対応しちゃってるんだから！

これだけ読むと…ものすごいですね。
使わない意味がわからないってかんじです。

ライセンスはというと…

フォントライセンス　：　SIL OFL 1.1
コードライセンス　：　MIT License

なにこれすごい。

使い方

使い方は超簡単。
管理人はBootstrapを使っていないので、必要なコードはたった一行だけ。
（Bootstrap使ってる人でもたった二行だよ！）

<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">

これをヘッダに入れましょう。

で、アイコンフォントを使用したいところに、下記コードを入れてあげます。

<i class="icon-camera-retro"></i>

はい、完成！

↑実際にアイコンフォントで表示してますよ！

マジ簡単すぎです。
こんな簡単でいいのだろうか。

アイコンはどんなのがあるの？

めちゃくちゃいっぱいあります。
こちらにリストが。

オプション

アイコンフォント、いろいろなオプションがあります。
詳しくはこちらにサンプルコード＆デモがありますのでどうぞ
Now Loadingのぐるぐるまわるやつとか、もはやフォントとは思えないですね…

結論

1分で導入できるので、とりあえず使ってみるべし。

簡単でクオリティ高いアイコンフォントがサラリと使える俺マジカッケー！と、感動出来ます。
一度使ってみると病みつきになってしまうかも。

Font Awesome、FontにAwesomeだぜ！！
お後がよろしいようで…

今日、文字をドットにするやり方がどうしてもわかんなかった。
なにがしたいかってーと、こういう文字を作りたいんですよ↓

Google Fontより。

これ。
これが作りたいの。
日本語フォントでこれがやりたいの。

IllustratorでもPhotoshopでもやり方がわかんなかった。

以下ためしたこと↓

• カラーハーフトーン
• ハーフトーン
• モザイク
• 格子のパターンでマスクかけたりなんだり

色々組み合わせればどうにかできそうなんだけど、全然頭が回らず…
結局手作業でちまちまドットを配置しました。疲れた。

Aiで、パスに対して整列するスクリプトがあるそう。
それとドット組み合わせれば簡単に出来たのかなあ。

うーん、わからーん。

ここ2日で、5個のブログをMTOS4.xからWordPressに移行しました。
WPテンプレ作りからだったから、むっちゃ疲れた。
本番環境触るのって心臓に悪いよね…

移行自体は簡単で、基本的にはこちらの神マニュアル通りに進行すればOKです。
2012年いまさらMTからWPにブログを移転してみたら、簡単すぎて驚いた

何点か気をつけるべき箇所があったので、メモっとく。

記事投稿URL

MTでエクスポートしたファイルを開いて、BASENAME: のところをチェック。
実際のブログ記事URLは「post-xxx.html」なのに、「post_xxx.html」で出力されていることがある…というか、自分の場合全部そうなってた(つД`)
気づかずそのままインポートして、最後に気づいて、記事全消しして再インポートするはめに…
「post_xxx.html」になっていたら、テキストエディタの置換機能でただしいURLに直すべし。

フィードのURL

フィードのURLが変わっているので、WEBサイトなどでRSS自動読み込みにしている場合は修正が必要。
MT時代のフィードからは.htaccessでリダイレクトかけとくとよろし。

GoogleやBingのWEBマスターツールに登録している場合

各検索エンジンのWEBマスターツールに、MT時代のsitemap.xmlを手動で登録している場合、そっちも忘れずに直しておきましょう。

とりあえずこんなもんでしょうか。

思っているよりサラリと移行できたなぁというのが最終的な感想。
まだちょっとだけ残作業あるので、勢いでやっつけてしまいたいです。

WordPressのデータベースを自動でバックアップしてくれる、WP-DBManagerというプラグインを使っています。
定期的にバックアップを取ってくれて、しかもそいつをメールで送ってくれるというすぐれもの。
非常に重宝してたのですが、ある時を境にぱったりとメールが来なくなってしまいました。

プラグインのバグかなーと思ってしばらく放置していたのですが、一向に直らないので重い腰を上げて原因調査。
意外なところに落とし穴はありました。

…とまぁ、引っ張った所でタイトルで答え言っちゃってるんですけどね。
問題はスパムコメントでした。

どのようにして原因究明したかというと…

まずはデータベースのバックアップを保管しているサーバー内のフォルダにFTPでアクセスしてみました。
あらら、きちんとバックアップがありました。
動いていないと思ったプラグイン、実は地道に動いていてくれたみたいです。

ですが、バックアップのファイルの容量が、なんかおかしい。
正常に動いていた日々は5MBくらいなのに、3つ前くらいから50MBくらいになってます！
メールで送られて来なかった原因はこれかー！

なんでこんなに容量が肥大しちゃったのか調べるため、WP-DBManagerのDatabaseという項目をチェック。
データベース内の情報がだーっと出てきます。
その中のData Usageの項目を見ると…
「XX_commentmeta」や「XX_comments」というテーブルが、明らかに容量がおかしくなってました。
（XXは設定したWordPressの接頭語が入ります）

テーブルの名前見れば、コメント関連のデータだということはあっさりわかります。
ブログにコメント自体はそんなに無かったのですが、問題だったのはスパムコメント。
Akismitがスパムと認定してくれていたコメントが、3000を超えていましたｗｗ

そうとわかればスパムを消すのみ。
スパムを全部消して、WP-DBManagerのOptimize Databaseからデータベースを最適化してあげました。

なんということでしょう。
匠（WP-DBManager）の技により、あっさりとデータベース肥大化の問題は解決です。

念のためWP-DBManagerのBackup Databaseから、バックアップを走らせてみると、容量は元の5MBあたりに戻っていました。
これで次回のスケジュールからちゃんとメールでも送られて来ることでしょう。

また同じ事が起きないように、Akismitの設定で、「一ヶ月以上前の投稿につけられたスパムを自動削除する」にチェック入れました。
その他にも、気がついた時に自分で消去するようにします。
スパムコメント、こまめに消さなきゃダメだねー。

スマホ専用サイト、ずっと前から勉強しなきゃなー…と思っていたもののなかなか手を出す機会がなく。
このたび、ようやく作る機会に恵まれたので、色々備忘録的に書いておきます。

もうスマホ専用サイトなんて作んないでしょ～、時代はレスポンシブでしょ～？

はい、そうですよね…。

でもね！
スマホ特有の癖とかさ！
わかってたほうがさ！
後々レスポンシブ作るときも楽じゃんね！ね！！

Map系

Mapはgoogleマップの埋め込みコードでばっちり表示される。
勝手にスマホ用に最適化してくれるぽい。
かんたん。

ホームスクリーン用のアイコンを作成

faviconのスマホ版みたいなのを作る。
大きめのサイズで作っておけば、それが縮小されて使われる。
144×144以上の正方形でPNG形式がよろし。
自分は200×200で作った。
iPhoneアイコンの角丸は自動で設定されるので、正方形にしとくのが色々とめんどくさくない。

んで、下記コードをheaderに貼り付ける。
Linkのhrefはhttp://からのフルパスが吉。

↓ iPhone光沢あり
<link href="http://サイトのURL/favicon.png" rel="apple-touch-icon" />

↓ iPhone光沢なし
<link href="http://サイトのURL/favicon.png" rel="apple-touch-icon-precomposed" />

電話番号をタッチすると自動的に発信可能にする

↓ header内にこれを
<meta name="format-detection" content="telephone=no" />

↓ リンクさせたい電話番号はこれで囲む
<a href="tel:電話番号">電話番号</a>

ページ内スクロール

自作jQueryだとAndoroidでうまく動かないことがあるので、smoothScroll.jsを仕込む。
単独で動く嬉しいjs。
MITライセンスです、開発者様ほんとうにありがとうございます。

先日、WordPress.comから引っ越してきた訳ですが。

いやあ、仕事やらプライベートやらで毎日WordPressいじってるけど、引越しとかしてみると意外と知らない機能とかあるもんだ。
以下備忘録。

All in one SEOだけでGoogle Analyticsのタグがつけれる。

AnalyticsもAll in one SEOもずーっと使ってたのに、全く知りませんでした。
All in one SEOの設定画面にある、Analyticsのコードを設定するだけ。
なんだこれ超絶便利。

WPのインポート/エクスポート超簡単

WordPress → WordPressの引越しだったからか、えらい簡単だった。
一番めんどくさい、画像なんかのメディアコンテンツも自動的に引越し作業してくれるし。
もう本当に、今までのWEB屋の苦労は一体…_:(´ཀ`」 ∠):_
ほんと感動したー。

Twenty TwelveのニコちゃんマークはWordPress.comのみ？

この記事で書いた、Twenty Twelveがかわゆい、というお話。
引っ越してきたら、同じテーマを使っているはずなのに消えていた。
WordPress.comの機能なのかしら。

URLの変更してもだいたい勝手に引き継がれる

これもめっちゃくちゃ驚いた。
設定画面で記事のURLrule変更しても、勝手にリダイレクトしてくれる。
基本的に生地IDで管理しているのか…
.htaccessが毎回一度で動かずヽ(｀Д´#)ﾉ ﾑｷｰ!!となってるWEB屋には非常にありがたい。

WordPress、本当に素晴らしいCMSだわー。
今後も推し推しでいきたいところ。

nivo-sliderっていう、jQueryのスライドショープラグイン。
かなり使い勝手がよくって、よくお世話になってる。

今日もいつものようにnivo-sliderでスライドショーを…と思ったら、見事にハマッてしまったのでメモ。

何の変哲もなく、普段通りに設定したのに、アニメーションが変。
しかも、前の画像がかぶって表示されている。

設定変えたり、js最新にしたり色々やったけど、結局問題だったのはスライドする画像。
今回使用したのは透過png。
背景を透過していたために、普段ならキレイにアニメーションされる部分が透けてしまっていた様子。

どうやら、透過pngはスライドにしないほうがいいみたい。
背景を透過処理せず、普通のpngにしたらうまくいきましたとさ。