Sumirexxx

今日もiPhone片手に出かけます

ブックマークレットが登録できない?そんなときはこの方法で回避!

iPhone

GWはほとんどをWordPressに捧げています。すみれっくす@sumirexxx_wpです。

今日は以前から書きたいと思っていた、ローカル環境とサーバー環境を合わせる方法について書きたいと思います!

なんで2つの環境が必要なの?

そもそも、なぜ2つの環境が必要なのでしょうか?ブログは1つなのに・・・。

まず、ブログとかシステムには必ず本番環境=みんなが目にする画面(今見ていただいてるのがそうです)があります。

でも例えばちょっとだけヘッダーのイメージを変えたいな、アイコンを追加したいな、と思ったとき。

すぐに本番環境を書き換えてもしもエラーになったら・・・。バックアップも取っていなかったら・・・。

いくら自分が作成したブログとは言っても、そのブログを続けている期間に比例して、最初から作り直すのは大変ですし2度と同じ記事を見れないことになります。

そんなこわーい状態にならないためにも、まずはローカル環境(自分のPCの中だけで見れる)でテストをして、OKであれば本番環境にあげて、

晴れて皆さんに見ていただくという手順は必ず用意した方がいいと思います!

でも途中から逆になっちゃった

…と、こんなに偉そうに言っていますが本当は私も最初はローカル環境の重要性に気がつかなくて本番環境でガリガリと書いていました。

画面が変になることもしばしば…(`・ω・´)

そのうち、「するぷろ」というiPhoneでブログが書けちゃう超便利アプリに出会い、どんどんローカル環境との距離は広がっていきました…。

そのかわり、サーバー環境には日々の私の書きたいことがどんどんと蓄積されていきました。

だからつまり、本番環境がテスト環境みたいになっちゃったんです。

2周年を迎えて記事が多くなってきた

そんなこんなで、完全に環境の差が出来上がってしまいました。

見た目も違えば記事も違う!これじゃだめだー!

2周年を迎えるのを期に、まずはこのローカルとサーバー環境の修正から始めることにしました。

ローカル環境からサーバー環境への移行

このサーバー→ローカルへのデータ移行の仕方の記事が少ないと思いませんか??

ローカル→サーバーは山ほどあるのに…。

サーバーからローカルに移行する人なんてまずいないんですかね。

何にも知らないところからWordPressを初めて、やっと形になってきたのにここでローカルを見捨てることなんてできない!

とにかく私はめっちゃ苦労して、いまのやり方までたどり着きました。

まずはサーバー環境からデータを取得する!

その前に、まずは必ずサーバーもローカルも、バックアップを取っておいてください。

なくしたものは取り戻せません。よろしくお願いします。

サーバー環境にログイン!

自分が登録したサーバーのphpAdminまで行きましょう。

私はロリポップを使っているのでその手順を載せます。

<ロリポップの場合>

ログイン画面からユーザー専用ページへ

Lolipopuログイン

ドメインとパスワードを入力

ドメインとパスワード

データベースを選択

データベース選択 2

ようやくphpAdminの文字が!!始めたばかりの頃は、ココまでくるのに何時間もかかりました。

Phpadmin開く

ブラウザに飛んで、この画面になると思います。

サーバー側phpadmin

ここで登録したユーザー名とパスワードは、ロリポップ登録時に設定したメールに記述されていると思います。

私はWordPress専用ノートを作って書き写しました。(まだEvernoteを使ってなかったのかなぁ?)

環境周りのユーザー名やパスワードは混乱しやすいので、はやる気持ちを抑えて、ひとつひとつきちんと管理しておくと後が楽ということを知りました。

これで無事にphpAdminにたどり着けました!いま3分の1くらいです!

次に自分のサーバーを選択して、エクスポートを開きます。念のためですが、今は「サーバー環境」をいじってますよ〜。

エクスポート 3

エクスポート画面になったら、ここからの設定はけっこう大事です!

エクスポート方法:「詳細」を選択します。まだ実行は押さない。

これから書いてあること以外はすべてデフォルトのままいじりません。

詳細 2

下にスクロールして、「出力をファイルに保存する」を選択します。ここで作ったSQLファイルを、

ローカル側のphpAdminにインポートするためです。

出力

追加コマンドの「DROP TABLE/VIEW/PROCEDURE/FUNCTION/EVENTコマンドの追加」にチェック

生成オプション

これでエクスポート設定は終わりです。「実行する」を押すと、SQLファイルが出力されます。

実行

SQLファイルを編集する

長くなってきましたが頑張りましょう。半分くらいきました。もうちょっとです!

エディタで先ほどエクスポートしたSQLファイルを開いて、ブログのアドレスで検索をかけてみましょう。

‘http://sumirexxx.com’という感じでシングルクォーテーションで囲まれている部分もあるので、一部で検索かけるのが良いです。例)sumirexxx.com

検索検索たくさん

検索をかけて確認したら、これをローカルアドレスに一気に置換します。

検索文字列:http://(自分のブログアドレス)

例)http://sumirexxx.com

置換文字列:http://localhost:8888/(ローカルフォルダ名)

例)http://sumirexxx.com

置換

注意!必ず保存して!!

騙取したままで気が済んでいると、この先の手順で私のようにローカル真っ白になります。ガ━━(;゚Д゚)━━ン!!

かならず保存してから次に進んでください。

超あせった(`・ω・´)

ローカルにインポートする!

次に先ほど編集したSQLファイルを、今度はローカル環境にインポートします。

同じような要領で、今度はローカル側のphpAdminにログインします。

MAMPだったらこの画面から簡単に行けます。

MAMP

ローカルサーバーのphpAdminへ!

ローカル

インポートするデータベースを用意します。

新規作成するか、前に使っていたデータベースを使います。

DB設定

インポート画面へ。

先ほど使うと決めたデータベースを選択して、インポートタブを開きます。

ローカル環境へ置換したSQLファイルを選択して、このまま何も設定せずに実行します。

インポート

インポートが正常に完了しました!

インポート完了

最後にこのファイルも見ておこう

wp-config.phpファイルです。

ココがローカルになっていないとたぶん(じゃなくて絶対)エラーになってしまいます。

Wp config php 2

それから84行目のWP-DEBUGを「true」に変えておくと、何かエラーががあったときに教えてくれます。

たいてい文字化けしてるけど、ファイルの位置と行くらいはわかります。

確認

エラー表示

ローカル環境に接続してみよう!

ローカル環境完成

さて、長かったですがどうですか??サーバー環境と同じになりましたか?

ずっと書きたかった記事がようやく書けました。

これが広く困っている人まで伝わるといいのですが…。

環境の違いで動かなくならないことを祈ります。。。

今までで一番長い記事だったー(´∀`)

最後まで読んでくれた方、ありがとうございました。

ブックマークレット、便利ですよね。
ShareHTML,AppHTMLなどブログを書く上ではかかせないツールです。

このブログでもそんな便利なブックマークについて、5回に渡って登録方法をご紹介したこともありました。

ブックマークレット | sumirexxx

この時は登録できてたんです。この時は…。

いつからかは定かではありませんが、ブックマークレットの不調には薄々気が付いていました。MyScriptsに登録したAppHTMLが動かない!!!

AppHTMLで生成したコードが、プレビューで見ると、表示されてない。

その後何度登録してみてもできなくなり、結局はSfariのブックマークから立ち上げる始末。(なぜか検索ハブからは出来たんだけど、なんとなくMyScriptsとMyShotcuts+viwerのコラボで使いたかったんです;)

そんな迷える私が尊敬してやまない、なまら春友流の春友さんのブログにこんな衝撃的な記事が!!!
なんと…ほかにも使えない人がいたんだ。
できない記事を見たことがなかったけど、春友さん以外にもいるようです。

原因はエンコードだった。(たぶん)

どうやらURLエンコードされているかどうかが肝心みたい。
それと改行。}とか¥とかがきちんとエンコードされてないとだめみたいですね。

うーん。これが原因ぽいとわかったところで解決法がわからない。

解決方法みつけた

【AppHTML エンコード】でググったら解決方法を書いてくださっている方が!!!

iPhone/iPadアプリ紹介AppHTMLをカスタマイズしてみました – W&R : Jazzと読書の日々

なるほど~。いったんSafariに登録したやつを使うんですね。やってみます。

やり方は以前にも書きましたので、今回は割愛。問題なくできました。

自分でもちょっと実験してみようと思い、エディタとスクリプト登録アプリを組み合わせて試してみました。
実行の手順はすべてこの順番です。

  1. サファリからAppHtmlメーカーを開く
  2. ブックマークレットを生成を押下してコピー
  3. それぞれのアプリで編集(http://iphone-diary.com/?)をカットする
  4. 編集したブックマークレットをアプリに登録して通知センターから実行

結果

MyScriptsからブックマークレットが動くかどうか

  • ATOKPad  → × 動かない
  • ThumEdit → × 動かない
  • Draftpad → × 動かない
  • Textfoucs → × 動かない
  • するぷろ → × 動かない

MyShortcuts+Viewerからブックマークレットが動くかどうか

  • ATOKPad → ○ 動く
  • ThumEdit → ○ 動く
  • Draftpad → ○ 動く
  • Textfoucs → ○ 動く
  • するぷろ → ○ 動く

検索ハブ

  • ATOKPad → ○ 動く
  • ThumEdit → ○ 動く
  • Draftpad → ○ 動く
  • Textfoucs → ○ 動く
  • するぷろ → ○ 動く

見事に…。
ちなみに、【Safariで一回エンコード】はさせてません。
なるべくて数が少なく済んで、ちゃんと動くやり方です。試してみてください!

そんな感じで満足してたら良記事ざくざく!今日はツイテル!!!

つぎにみつけた記事がこちら。

通知センターからAppHTMLを使えるようにしてみた | Today’s Stack

こんなブックマークレットも発見しました。

AllAppStoreHtml – AppStoreアプリを一括検索して指定アプリのHTMLタグを出力するMyScripts用スクリプト | 代助のブログ

これすごく便利~!

ブックマークレット3つ作らなきゃいけないところ、1つで済んじゃうんですね!
最高です!使わせていただきます。

ここまでできたら、あとは通知センターに登録するなりseeqやQuickrに登録するなりして快適なブックマークレットライフを送れるといいですね(人゚∀゚*)

Posted from するぷろ for iOS.

この記事をシェアする

<