中年おじさんが100%ネットで生計をたてていく方法 https://noritacraving.com ブログの作り方やネットでお金を生み出す方法を解説します Mon, 18 Jan 2021 02:01:07 +0000 ja hourly 1 https://wordpress.org/?v=6.4.3 https://noritacraving.com/wp-content/uploads/2017/04/cropped-rogo-32x32.png 中年おじさんが100%ネットで生計をたてていく方法 https://noritacraving.com 32 32 Googleアドセンスでのads.txtファイルの問題を修正 https://noritacraving.com/ads-txt-issues https://noritacraving.com/ads-txt-issues#respond Mon, 02 Sep 2019 09:02:27 +0000 https://noritacraving.com/?p=3256 サイトにGoogleアドセンスを設置している方で、アドセンスの管理画面上に【要注意 – 収益に重大な影響が出ないよう、ads.txt ファイルの問題を修正してください。】
と出ている方はいませんか?

私もこの警告が出たのですが問題を修正することが出来ました、
もしそんな警告が出ていて対処方法がわからないと言う方は此方の記事を読んで見てください。

ある日Googleアドセンスの管理画面に警告

Googleアドセンスの管理画面を見てみると何やら管理画面上に【要注意 – 収益に重大な影響が出ないよう、ads.txt ファイルの問題を修正してください。】と表示されているではありませんか、
どういう事なのか意味が解りませんが、取りあえず右側にある【今すぐ修正】をクリックしてみました。

重大な影響

 

 

ads.txt ファイルのダウンロード

【今すぐ修正】をクリックすると、画面が変わりads.txtファイルをダウンロードするように促されるので、
【ダウンロード】のテキストをクリックしてads.txtをダウンロードします。

ダウンロードしたads.txtファイルの文字コードがUTF-8になっていることを確認します。

文字コードUTF-8確認

ads.txtの意味が理解できていないので【ダウンロード】右上の【ads.txtガイド】をクリックして説明を見てみます。

 

 

ads.txtとは何か?

【adsAds.txt に関するガイド】に書いてある説明を読んで見ると、(Ads.txt に関するガイド

自サイトに ads.txt を作成することで、自サイトの広告枠の販売者を厳密に管理して、偽の広告枠に収益が流れるのを防ぐことが出来るそうです、
また購入者が偽の広告枠を判別できるらしいので、サイトの運営者も偽の広告枠に収益が流れるのを防げるため、その分収益を伸ばせると言うメリットがあるらしいです。

ads.txtの設置は必須ではないらしいとのことですが、Googleアドセンスの管理画面に表示され続けるのも気持ち悪いので設置することにしました。

 

 

ads.txtファイルの設置

ダウンロードしたads.txtファイルには(google.com, pub-0000000000000000, DIRECT, f08c47fec0942fa0)のような記述があります、
0000000000000000には、アドセンスのアカウントIDが入りますが、ダウンロードした時にアカウントIDはすでに入力されていますので、記述をいじることはありません。

このads.txtファイルを(Ads.txt に関するガイド)によるとサイトのルートドメイン(ドメイン名の一つ下の階層)にアップロードします。

私はさくらのレンタルサーバ を使っていますのでこちらにログインしてファイルマネージャーを開きます。

ファイルマネージャーを開く

 

 

ファイルマネージャーを開いたらads.txtファイルを設置したいドメイン名をダブルクリックします。

ドメイン名クリック

 

 

一つ下の階層が開いたら【アップロード】をクリックします。

アップロードをクリック

 

 

ポップアップウインドウが開くので【ファイルを追加】をクリックします。

ファイルを追加

 

 

クリックするとポップアップウインドウが開くのでダウンロードしてあったads.txtファイルを選択して右下の【開く】をクリックします。

ads.txtファイルを開く

 

 

次にアップロード開始のボタンをクリックします。

アップロード開始をクリック

 

 

アップロードが完了したら閉じるをクリックします。

完了ご閉じるをクリック

 

ads.txtファイルが正しくアップロードできているか確認

アップロードしたads.txtファイルが正しく設置されたかどうか確認するには、
こちらのサイトにアクセスします。(Ads.txt 管理

サイトにアクセス

 

 

サイトにアクセスしたら検索窓にads.txtファイルを設置したサイトのURLと末尾に/ads.txtを加えて入力して【チェック】をクリックします。

URLを入力

 

 

チェックを入力すると検証結果が出ます。
赤で四角く囲った所がになっていればOKです。

画面上に(“ISO-8859-1” は誤った文字コードです。utf-8で作成してください。)と言うエラーが出ていますが、
半角英数字でads.txtファイルが設置されていれば問題ではないようです。(AdSenseヘルプ)

結果が出る

 

 

他にもチェックできるサイトがあるのでそちらの方でも検証してみる事にします。
先ず(ads.txt Guru)にアクセスします。

サイトにアクセス

 

 

アクセスしたしたら最初の検索窓に自サイトのURLの最後に/ads.txtと付け足して入力し【GO!】のボタンをクリックします。

URLを入力

 

 

【Perfect!】になっていればads.txtは正しく設置されています。

Perfect!になっていればOK

 

 

最後に

これでads.txtの設置は正しくできました、反映されるまでには時間が掛かるのでしばらく待って見てください。

: 変更が AdSense に反映されるまでに数日かかる場合があります。
サイトの広告リクエストが多くない場合は、最長で 1 か月ほどかかることがあります。

 引用:Ads.txt に関するガイド

というような説明がありますが実際には私の場合では一日もかからないで反映されたと思います。

 

 

]]>
https://noritacraving.com/ads-txt-issues/feed 0
データーベース接続確立エラーが出てサイトが確認できなくなった時にやる事 https://noritacraving.com/database-connection-error https://noritacraving.com/database-connection-error#respond Fri, 17 May 2019 08:00:57 +0000 https://noritacraving.com/?p=3184 サイトを開いたら画面が真っ白で【データベース接続確立エラー】とだけ表示されていたらどうしますか?

何もわからなければ慌ててしまってどうしていいのかわかりませんよね。

ここでは真っ白画面でデータベース接続確立エラーと表示が出てしまったときに、
どうして対処すればいいか解説しています。

【データベース接続確立エラー】の原因は?

私もこの状態になった時は慌ててしまいましたが、
「自分が何かやったかな?」と考えた時に、そういえばと言う事がありました。

思い当たることは前日にデータベースのパスワードを変えたことでした、
その時はサイトを開いてみなかったのでそんなことになっているとは知らず翌日まで放置状態でした。

翌日アクセス状況を見るためにGoogleアナリティクスでサイトの状況を見たところ、
アクセス数が半分まで落ち込んでいたので「あれおかしいな?」と思いサイトを開いたところ、
下記画像のような状態になっていました。

データベース接続確立エラー

 

 

「これはまずいことになっているぞ!」と思い、原因は何なのか考えてみたところ、思い当たる事ではデータベースのパスワードを変えたこと位だったので「それが原因かな?」と思いましたので、
レンタルサーバーの(私の場合さくらのレンタルサーバ です)コントロールパネルにログインして見てみます。
コントロールパネルへログイン2019/03/27コントロールパネルβ版が正式版に変わって新しいコントロールパネルに変わりました。(旧バージョンにも代えられます)
ドメイン名、パスワードを入力してログインボタンをクリックします。

 

 

【wp-config.php】の記述が合っていない場合

サーバーコントロールパネルが開いたら、ホーム画面にあるファイルマネージャーをクリックします。

作業をする前には必ずバックアップをしてください。

此方の記事が参考になります。👇
【WordPress】BackWPupプラグインでバックアップしたデータの復元方法
BackWPup定期的にバックアップを取るプラグイン

ファイルマネージャーのボタンをクリック

 

 

なぜファイルマネージャーを開いたかと言うとデータベースのパスワードを変えたときに、ここにある【wp-config.php】に新しいパスワードが反映されているかどうかの確認をしようと思ったからです。ここに新しいパスワードが反映されていないとエラーになって不具合が起きてしまいます。

ファイルマネージャーが開いたらエラーが出たサイトの【wp-config.php】を開きます。

wp-config.phpを開く

 

 

【wp-config.php】を開いたらデータベース名、データベースのユーザー名、データベースのパスワード、の項目がありますので、
項目に書かれている文字列があっているかどうか確認します。

私の場合やはりパスワードが変更されず前のパスワードのままでした、
パスワードの変更は前にも行いましたが、コントロールパネルのデータベースパスワードを書き変えれば、
【wp-config.php】も自動的に変更された気がしたのですが・・・(記憶違いだったか?)

データベースパスワードをチェック

 

 

【wp-config.php】の【MySQL データベースのパスワード】を現在のパスワードに書き換えて、【保存】をクリックしてから【×閉じる】ボタンをクリックします。

パスワード書き換え

これでサイトにアクセスしてみたところ無事サイトが表示されていました。

 

 

もし変更したパスワードも忘れてしまった場合はコントロールパネルにあるデータベースのパスワードをもう一度新規のものに変えて、
【wp-config.php】の【MySQL データベースのパスワード】を書き換えるか、【wp-config.php】の【MySQL データベースのパスワード】に現在表示されているパスワードをコントロールパネルにあるデータベースのパスワードにすれば良いでしょう。

(データベース名、データベースのユーザー名、ホスト名は初期設定のままにしておいてください。)

コントロールパネルのデータベースパスワードを変える方法は、(さくらのレンタルサーバーの場合)
コントロールパネルにログインしてホーム画面の【データベース】をクリックします。

コントロールパネルのデータベースをクリック

 

 

データベースの設定画面に変わったら【設定】ボタンをクリックします。

設定ボタンをクリック

 

 

パスワード入力画面に変わりますので入力覧に、半角英数字8文字以上でパスワードを入力します、
下の覧には上で入力したパスワードと同じ文字列を入力します。

最後に【変更する】ボタンをクリックします。

変更ボタンをクリック

これでデータベースのパスワード変更は完了です。

 

 

データベース接続確立エラー】が出てしまった時には、
【wp-config.php】の【MySQL データーベースのパスワード】とコントロールパネルのデーターベースパスワードが合っているか確認して見て下さい。

【データベース接続確立エラー】の原因で一番多いのが、
コントロールパネルのデータベースパスワードとファイルマネージャーの【wp-config.php】のデータベースパスワードが合っていない事です。

 

 

データベースのテーブルが破損した場合

次にデータベースのテーブルが破損したときにも【データベース接続確立エラー】の表示が画面に表示されます。

この場合の対処法は、レンタルサーバーのコントロールパネルにログインしてホーム画面のデータベースをクリックします。(上記参照)

データベースの設定画面に変わったら【phpMyAdminログイン】をクリックします。

コントロールパネルのphpMyAdminログインをクリック

 

 

【phpMyAdmin】の画面に変わったらデータベースの【ユーザー名】、【パスワード】を入力して【実行】をクリックします。

phpMyAdminへログイン

 

 

データベースの画面が表示されます。

データベースの画面

テーブルの修復を行う前に何か不具合があると困りますので、データをバックアップしておきます。
此方の記事も参考にしてみてください。👇
【WordPress】BackWPupプラグインでバックアップしたデータの復元方法
BackWPup定期的にバックアップを取るプラグイン

 

 

左側にあるデータベース名から該当のデータベース名をクリックします。

上部にあるエクスポートのボタンをクリックします。

フォーマットの所は【SQL】でいいです。

最後に【実行】のボタンをクリックします。

エクスポートボタンをクリック

 

 

エクスポートしたファイルがPCにある事を確認できればOKです、
これでデータベースのバックアップは完了です。

PCにエクスポート

 

 

データベースのデータがバックアップ出来たら破損したデータベースの修復を行います。

【phpMyAdmin】左側の該当するデータベース名をクリックします。

破損したデータベースの修復

 

 

上部にある【構造】の項目になっていると思いますので、
破損しているテーブルにチェックを入れます。(すべてにチェックしてもいいです。)

テーブルにチェックを入れる

 

 

次に【チェックしたものを】のプルダウンメニューをクリックして、【テーブルを修復する】をクリックします。

テーブルを修復するをクリック

 

 

【SQLは正常に実行されました。】と出たら、テーブルの復元は完了です。

テーブルの修復完了

 

 

サーバー側で起こっているトラブルの場合

サーバー側でのトラブルが発生した場合でも【データベース接続確立エラー】は起こります。

サーバー側で起こっているトラブルの場合此方ではどうすることもできないのですが、
障害に関するメールが届いていないか又はコントロールパネルのお知らせや障害情報を見てください。

もし該当することがあればサーバー側で起きている問題なので処理が終わるまで待つしかないでしょう。

コントロールパネルのお知らせを見る場合は、
(さくらのレンタルサーバ の場合)ホーム画面の【インフォメーション】に該当箇所があればクリックしてみる、
該当箇所がない場合は【障害情報・メンテナンス情報】をクリックして該当することがあるか見てみましょう。

コントロールパネルのお知らせを見る

 

 

最後に

データベース接続確立エラー】が出たときの対処法としての主な例を上げてみましたが、このような状況になると慌ててしまうと思われますが、先ずは落ち着いて原因はどこにあるのか理解してから復旧作業に取り掛かってください、それと作業する前には必ずバックアップを取ることを忘れないでください、復旧するはずのサイトが飛んでしまったのでは全く意味がありませんから。

]]>
https://noritacraving.com/database-connection-error/feed 0
Googleアドセンスで推奨するAMPを導入してサイトを最適化する方法 https://noritacraving.com/amp-introduction-method https://noritacraving.com/amp-introduction-method#respond Fri, 25 Jan 2019 09:00:39 +0000 https://noritacraving.com/?p=3057 私のサイトに掲載している広告は Googleaアドセンスですが、Googleaアドセンスの管理画面を見たところ最適化の提案にAMP(Accelerated Mobile Pages)の導入を進めていました。

AMPを導入するとページの読み込み速度が断然早くなり表示速度が上がるため、訪問者の離脱率が下がりアクセスが上がると言う事らしいので、導入する価値がありそうと思い早速サイトにAMPを導入することにしました。

ここでは、サイトにAMPを導入して、Google アナリティクスの設置とGoogleアドセンスを表示する方法を解説しています。

AMPとは

AMP(Accelerated Mobile Pages)とはGoogleとTwitterで共同開発されていて、スマホなどのモバイル端末の表示速度を劇的に高速化してくれます。

但しデメリットもあり高速化するために、カスタマイズしたサイトでもデザイン装飾やサイドバーなどが表示できなくなってしまい、あっさりとした画面になってしまいます。
これにより訪問者がストレスを感じることなく記事を読み進めることができ、検索での順位が上がる可能性があるので仕方ない事かなとも思います、まだまだ開発途中と言う事なのでこれから改善されていくと思われます。

 

 

AMP導入にプラグインを使う

Googleアドセンスの最適化での提案では、AMPを導入するにあたり【AMP for WordPress】と言うプラグインでAMP化することを進めてますので、この【AMP for WordPress】でAMPを導入することにします。

管理画面左にある【プラグイン】から【新規追加】を選択して、検索窓にAMP for WordPressと入力して今すぐインストールをクリックします。

インストールボタンをクリック

 

 

インストール完了後【有効化】をクリックしてプラグインを有効化します。

プラグインを有効化

 

 

プラグインを有効化させたら管理画面左側に【AMP】のアイコンが表示されますので選択して【General】をクリックします。

 

Generalをクリック

 

画面が変わります、【Template Mode】はデフォルトでは【Native】にチェックが入っていてこちらを推奨していますが、アドセンス広告の表示が出来なかったため私は従来の【Classic】にしました。

【Supported Templates】では投稿のタイプが選べますが、私はなるべくエラーが出るのを少なくしたい事もあり【投稿】のみにチェックを入れました。

最後に【変更を保存】のボタンをクリックします、これでサイトのモバイル表示でのAMP化が完了です。

設定して変更ボタンをクリック

AMP化したサイトの確認

プラグインを有効化したら、サイトがAMP表示されているかどうかチェックして見ましょう。

AMP化したサイトを表示するには記事のURLの最後に/ampを付け足します。AMP化したサイトを表示する

 

 

サイトのAMP化が正常に行われたか確認するには、AMPテストを行います。⇒AMPテスト

ここにアクセスしてAMP化したサイトのURLを貼り付けます、エラーが出なければAMP化は成功です。

AMPテストを行う

 

 

この画面が出ればAMP化は正常に行われました。

AMP化が正常かどうか

 

 

AMP化したサイトにGoogleアナリティクスを設置する

次にAMP化したサイトのアクセス解析を行うためにGoogleアナリティクスを設置します。

今サイトに設置されているGoogleアナリティクスではAMP化したサイトには反映されない為また新たにAMP化したサイトへの設置が必要になります。

AMP化したサイトへの設置にはプラグインにコードを書き込むだけです。

【Googleアナリティクス】のホーム画面一番下にある歯車マークアイコンの【管理】をクリックします。

Googleアナリティクスを導入していない方はこちらの記事をどうぞ⇒初心者向きGoogleアナリティクスの使い方

Googleアナリティクスの管理画面で設定

 

 

管理画面に変わったら真ん中プロパティ設定のトラッキング情報を選択してトラッキングコードをクリックします。

トラッキングコードをクリック

 

 

クリックすると画面が変わりトラッキングIDが表示されるのでそちらをコピーしておきます。

トラッキングIDをコピー

 

 

次に【Wordpress】の管理画面に行き【AMP】のアイコンを選択して【Analytics】をクリックします。

Wordpressの管理画面AMPアナリティクスをクリック

 

 

アナリティクスコードを入力する画面になります。

【Type】にはgoogleanalyticsと入力して【JSON Configuration:】にアナリティクスコードを書き込み、下にある【Save】ボタンをクリックすれば完了です。

アナリティクスのコードを書き込む

【JSON Configuration:】入力するコードは【Google アナリティクス】のこちらを使用しています。⇒AMP ページにアナリティクスを追加する

色々なタイプがあるようですが私は【ページトラッキング】を使用しました。

<amp-analytics type="googleanalytics">
<script type="application/json">
{"vars": {"account": "UA-XXXXX-Y"},"triggers": {"trackPageview": {"on": "visible","request": "pageview"}}
}
</script>
</amp-analytics>

トラッキングIDの【UA-XXXXX-Y】は上記【Googleアナリティクス】でコピーした自分のコードを入れなおしてください。

これでGoogleアナリティクスの、AMPでのアクセス解析が反映されるようになりました。

 

 

AMP化したサイトでGoogleアドセンスを表示させる

AMP表示したサイトでは一般のGoogleアドセンスのコードでは広告を表示することができません。
AMP表示のサイトにGoogleアドセンスの広告を表示させるには、AMPバージョンのコードを作製して機能させる必要があります。(ここでは自動広告の設定方法を説明しています。)

AdSenseヘルプ⇒AMP 自動広告の設定方法参照。

先ずは、Googleアドセンスの管理画面にログインして【広告】をクリックします。

Googleアドセンスの管理画面にログインする

 

 

【広告】をクリックしたら上にある【AMP 自動広告】をクリックします。

AMP 自動広告をクリック

手順1から3までを実行します、手順1では広告フォーマットをオンにして【新しいフォーマットを自動的に取得する】にチェックを入れます。

手順2、3では所定の場所にコードを貼り付けます。

 

<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>

2の手順では、上記コードをAMP HTML の<head></head> タグの間に貼り付けます。

やり方は、【Wordpress】管理画面左側にあるメニューバーの【プラグイン】から【プラグイン編集】を選択します。

Wordpressの管理画面からプラグイン編集を選択

 

 

【プラグイン編集】画面が開いたら、【編集するプラグインを選択】の▼プルダウンメニューをクリックしてAMPを選択します。

編集するプラグインを選択からAMPを選択

 

 

AMPを選択したら右側に表示されているファイルの中から【templates】をクリックします。

templatesをクリック

 

 

下に表示されている中から【html-start.php】を選択します。

html-start.phpを選択

 

 

【html-start.php】を開いたら上記コードを<head></head> タグの間に貼り付けます。

 

 

次に【single.php】にGoogleアドセンスの【AMP 自動広告】手順3で表示されているコードを貼り付けていきます。

<amp-auto-ads type="adsense"
              data-ad-client="ca-pub-○○○○○○○○">
</amp-auto-ads>

先ほどのWordpress【プラグイン編集】⇒【AMP 】⇒【templates】から【single.php】を選択します。

single.phpを選択

 

 

</article>の上部に手順3のコードを貼り付けます。

手順3のコードを貼り付ける

AMP テストで有効が出れば成功です。

これでAMP化したサイトにGoogleアドセンスの【自動広告】を表示することができるようになりました。

 

 

AMPを導入した結果は?

AMPを導入した後のサイトに何か変化はあったかと言うと、私の場合導入した当初アクセスが上がることはなく、逆に下がると言う結果になってしまいました。

GoogleサーチコンソールでAMPの状態を見てみると、何種類かのエラーも出てしまっていてこれが原因かなと思いつつも何も対処しないで放置していたら、そのうちエラーが解消されていました。

2週間ぐらいでアクセスが戻り最近ではモバイルでのアクセスが徐々に増え始めています。

AMPを導入した結果はモバイルでのアクセスが多少増えたかな位で今のところそれ程の変化は感じられないと言った所でしょうか。

Googleが推奨しているAMPですからそのうち変化があることを期待しつつ継続していこうと思います。

 

 

最後に

AMPはまだ開発途中とのことですからプラグインも改良されてサーチコンソールでのAMPエラーも解消されて行けば扱いやすくなると思われます。

モバイルでのアクセスが益々多くなって来ていますのでページスピードが遅いと訪問者の離脱率も高くなりますから、AMPを導入することは必要になって来ると思います、但しエラーが出た場合の対処方法が解らないという方が多いのではないでしょうか(私もそうですが)、そんな時はGoogle ウェブマスター向け公式ヘルプ フォーラムで質問すると解決できる場合がありますよ。

Googleが中心になって立ち上げたAMPですから、Google検索ではAMPを導入しているサイトの方が優位のはずですので、導入するメリットは大いにあると思います。

Googleアドセンスをサイトに表示させている方はGoogleで推奨するAMPを導入してみてはいかがでしょうか?

AMPプラグインをバージョンアップした時には、挿入したコードが消えてしまいます、もう一度入れなおす必要がありますので注意してください(私です)。

]]>
https://noritacraving.com/amp-introduction-method/feed 0
さくらサーバースタンダードプランのCGIモードをモジュールモードへ移行 https://noritacraving.com/module-mode-from-the-cgi-mode https://noritacraving.com/module-mode-from-the-cgi-mode#respond Sun, 30 Sep 2018 08:11:53 +0000 https://noritacraving.com/?p=2886 さくらのレンタルサーバでは、2018年4月18日から今までのCGIモードに変わり、PHPモジュールモードが、スタンダード・プレミアムで利用できるようになりました。

今までの表示速度が大幅に改善されて最大16倍も早い処理結果になったそうです、一時はさくらサーバーの速度に不満がありエックスサーバーに変えようかとも思いましたが・・・

スタンダードプランでPhPモジュールを導入する

さくらサーバーもPHPモジュールを導入したことからコストパフォーマンスが高いさくらサーバーのままでいいかなと思います。

私の入っているスタンダードプランでは【www3701.sakura.ne.jp 】以降の番号のサーバーを利用している場合のみPHPモジュールモードの利用が可能ですが【www3701.sakura.ne.jp】 以前の番号のサーバーでは利用が不可能です、【www3701.sakura.ne.jp】 以前の番号でも使用できるかどうかは検討中とのことなのでどうなるかと期待してましたが、使用可能になるまでには時間が掛かるか使用可能にならない可能性もあるため、新規に契約しなおすことにしました。

急がない方は今の契約が切れてからモジュールモードに切り替えた方がいいかもしれませんね、ただサイトの表示速度でアクセス数も変わるのでアクセス数を増やしたいのであれば早めに切り替えた方がいいと思います。

 

サーバー番号でモジュールモードが使えるかどうか確認する

まず自分が使っているサービスの(スタンダードプラン)サーバ番号がモジュールモードを利用できるかどうか確認をしてみます。

さくらインターネットサーバコントロールパネルへログインして【サーバ情報の表示】をクリックします。

サーバー情報の表示をクリック

 

 

サーバ情報の表示画面に変わったら、【サーバに関する情報】をクリックします。

サーバーに関する情報をクリック

 

 

【サーバに関する情報】のホスト名が【www3701.sakura.ne.jp 】以降の数字になっていればモジュールモードの利用が可能です、私の場合はそれ以前の数字なので利用することができません。

モジュールモードの利用が可能かチェックする

【www3701.sakura.ne.jp 】以前の数字の方がモジュールモードを利用するには、今の所新規に契約しなおすしかないようです。(スタンダードプラン)

 

 

スタンダードプランを新規に契約する

【さくらのサポート情報】にはスタンダードプランを利用していて、サーバ番号が対象ではない場合サーバアップデートについては現在検討中となっていたので、そのうち対処してくれるだろうと思っていましたが対処する気配がなさそうです。

さくらから来たメールを見ると、クーポンコードを使い新規契約すると初期費用と利用料金1ヶ月分が割引になるらしいので、此方を使って新規に契約することにしました。(本当はこのまま移行しない状態で対処してほしかったですが…)

いつもさくらインターネットをご利用いただき誠にありがとうございます。

弊社では、さくらのレンタルサーバ スタンダードプランで、WordPressをはじめ
とするPHPで動作するアプリケーションの高速化対応(PHPモジュールモードの提供)
を2018年4月18日以降の新規お申し込み分より実施しております。

本メールでは、日頃のご愛顧に感謝し、高速化プランへお乗り換えがお得になる
乗り換えクーポンをお送りいたします。

◆ クーポン情報 ◆━━━━━━━━━━━━━━━━━━━━━━━━━━━

 クーポンコード     :○○○○
 有効期限        :2019/7/31

 クーポン利用可能プラン :さくらのレンタルサーバ スタンダード
 値引き金額       :1,544円(初期費用+ご利用料金1ヶ月分)

 <クーポン発行対象サービス>

 

 

移行前に注意する事

  1. 今現在利用しているサーバーで【PHP7.○○】 (○○の部分はバージョンアップで変わります)が正常に動作するか確認をしておく。
    phpバージョン7へ切り替え
  2. 移行前にサーバー上のデータとデータベース上のデータのバックアップを作成しておく。
    FTPソフト(WinSCP)でPCのデータをサーバーに送る方法
    BackWPup定期的にバックアップを取るプラグイン
  3. 新規契約の際クーポンコードを(スタンダードプラン)入力し忘れると割引が適用されないので気を付けてください。
  4. 旧サーバーでドメイン削除を行ったら2時間待ってから新規サーバーに追加してください。

 

 

乗り換え先のサーバーを申し込む

さくらのレンタルサーバ申し込みへアクセスします。

さくらのレンタルサーバ スタンダード

申し込み画面で月額515円の【スタンダード】を選択して【お申込みボタン】をクリックします。

スタンダードを選択

 

 

【さくらレンタルサーバーお申込み画面】に変わったら、自分の好きな初期ドメイン名を半角英数字で入力して【お支払方法の選択】ボタンをクリックします。

初期ドメインを入力

 

 

会員認証の画面に変わります、ここではさくらサーバーからさくらサーバーの移行ですので、会員IDは持っていますから【ログイン】ボタンをクリックします。

ログインボタンをクリック

 

 

【会員ID】、【パスワード】を入力して【ログイン(認証)】ボタンをクリックします。

会員ID、パスワードを入力

 

 

【お支払選択】画面に変わりますので、支払いパターン、支払い方法を選択して、メールで送られてきたクーポンコードのある方はコードを入力したら、【お申込内容の確認へ】のボタンをクリックします。

申込内容を選択して確認ボタンをクリック

 

 

【お申込内容の確認】画面に変わります、内容を確認し約款に同意出来れば【同意する】にチェックを入れ【この内容で申し込む】のボタンをクリックします。

同意するにチェックを入れボタンをクリック。

これで新規申し込みは完了です。

 

 

サーバー上のデータとデータベース上のデータをダウンロード

新規申し込みが終わったら移行するサイトのデータをPCにダウンロードします。

此方の記事を参考にしてみてください。

 BackWPup定期的にバックアップを取るプラグイン

【WordPress】BackWPupプラグインでバックアップしたデータの復元方法

FTPソフト(WinSCP)でPCのデータをサーバーに送る方法

ここではFTPを使ってサーバー上のデータをダウンロードします、データベース上のデータはphpMyAdminからダウンロードしました。

 

 

サーバー上のデータをPCにダウンロードする

ここではFTPでサーバー上のデータをダウンロードしていきます。

FTP(ここではWinSCPを使用しています)を起動させて移行したいサイトのフォルダをそのままPCにドラッグ&ドロップでアップロードします。

此方の記事が参考になります⇒FTPソフト(WinSCP)でPCのデータをサーバーに送る方法

これでサーバー上のデータをPCにダウンロードすることができました。

 

 

データベース上のデータをPCにダウンロードする

さくらのサーバーコントロールパネル にログインして【データベースの設定】をクリックします。

【データベースの設定画面】に変わったら【管理ツールログイン】をクリックします。

 

 

【phpMyAdmin】のログイン画面でユーザー名、パスワードを入力して【実行】をクリックします。

phpMyAdminのログイン画面でユーザー名、パスワードを入力

 

ログインしたら上にある【エクスポート】のボタンをクリックします。

エクスポートボタンをクリック

 

 

エクスポート画面に変わったら【簡易】、【詳細】ボタンの【詳細】にチェックを入れます。

詳細にチェック

 

 

【詳細】にチェックを入れると色々な項目が下に表示されますが、ここではデータベースを選択する設定だけ行います。

移行したいデータベースを選んでクリックするか全て移行する場合は全選択をクリックします。(ここでは1つ選択しました。)

【フォーマット】は【SQL】になっていると思いますが、それでOKです。

移行したいデータベースを選

 

 

最後に一番下の【実行】ボタンをクリックします。

これでデータベース上のデータがPCにダウンロード出来ました。

 

 

新規サーバーにデータベースを作成する

PCにデータをダウンロード出来たら次に新規サーバーにデータベースを作成します、さくらサーバーの新規コントロールパネルにログインして【データベースの設定】をクリックします。

 

 

【データベースの新規作成画面】に変わったら【データベース名】、【接続用パスワード】を入力して、同意するにチェックを入れます、最後に【データベースを作成する】をクリックします。

データベース名、接続用パスワードを入力

 

 

これでデータベースの作成は完了です。

 

 

新規サーバーにデータを移行する

新規契約したサーバーにPCへダウンロードしたサーバー上のデータとデータベース上のデータを移行します。

 

データベース上のデータを移行する

此方の記事が参考になります⇒【Wordpress】BackWPupプラグインでバックアップしたデータの復元方法

上記で新規サーバーに作成したデータベースにPCにダウンロードしたサーバー上のデータを移行します。

さくらサーバーのコントロールパネルにログインして、【データベースの設定】をクリックします、【データベース一覧】が表示したらデータを移行したいデータベースの【管理ツールログイン】をクリックします。

 

 

【phpMyAdmin】のログイン画面に変わりますので新規作成時のユーザー名、パスワードを入力して【実行】をクリックします。

phpMyAdminへログイン

 

 

ログインしたら新しく作ったデータベースをクリックして開きます。

新しく作ったデータベースをクリック

 

 

データベースが開いたら上にある【インポート】のボタンをクリックします。

インポートのボタンをクリック

 

 

インポート画面に変わったら【ファイルを選択】をクリックするとダイアログボックスが開きますので、フォルダのある場所を指定して【開く】のボタンをクリックします。

ファイルを選択をクリック

 

 

【開く】ボタンをクリックしたら、下にある【実行ボタン】をクリックします。

これでPCからデータベースへのアップロードが完了です。

 

 

サーバー上のデータを移行する

ここではFTPで(WinSCP)で新規サーバーへの移行を行います。

FTPソフト(WinSCP)でPCのデータをサーバーに送る方法

【WinSCP】を起動させるとダイアログボックスが開きますので【新しいサイト】をクリックして、新規サーバーのホスト名、ユーザー名、パスワードを入力したら【保存】をクリックします。WinSCPを起動後新しいサイトをクリック

 

 

(さくらサーバーの場合)さくらのサポート情報

コントロールパネルの 【サーバ情報の表示】から【 FTP設定に関する情報】でもわかります、パスワードはコントロールパネルのログイン時に使うパスワードです。

 

 

【WinSCP】の保存をクリックしたらダイアログボックスが開きますので【OK】のボタンを選択して下にある【ログイン】ボタンをクリックします。

WinSCPの保存をクリックしてOKボタンを選択

【ログイン】ボタンをクリックすると、ダイアログボックスが開きます、先ほど【新しいサイト】で設定したパスワードをもう一度入力して【OK】をクリックします。

認証されればサーバーの接続は完了です。

 

 

サーバーの接続が完了したらPCにダウンロードしてあったデータを新規サーバーにアップロードします。

ドメイン直下にしたい場合は赤で囲った階層の【www】のフォルダにサーバー上のデータをドラッグ&ドロップでフォルダごと入れます。

 

サーバー上のデータを新規サーバーに移行出来たら、FTPからでもコントロールパネルのファイルマネージャーからでもいいので、移行したフォルダを右クリックして開きます。

(ここではコントロールパネルのファイルマネージャーから開いています。)

移行したフォルダを右クリックして開く

 

 

前のサーバーの情報が入っている【wp-config.php】を開いて記述を変えます。

右クリックで【編集】を選択します。

wp-config.phpを開いて記述を変える

 

 

【wp-config.php】が開いたら新規サーバーに作ったデータベースの【ユーザー名】、【パスワード】、【ホスト名】を記述しなおします。

プラグインの関係で他にも前のデータベースの記述がある場合はそちらも新規サーバーの記述に変えます。

新規サーバーに作ったデータベースのユーザー名、パスワード、ホスト名を記述

 

 

新規サーバーへドメインを移行する

上記作業が完了したら新規サーバーへの移行準備が完了できましたので、今までのサーバーから新規のサーバーへドメインを移行していきます。

 

今までのサーバーからドメインを削除する

今まで使っていた旧サーバーから新規のサーバーへ移行するには旧サーバーに登録してあったドメインを削除する必要があります。

旧サーバーのコントロールパネルにログインして、ファイアウォールを有効にしている方はまずこちらを無効にします。

【Webアプリケーションファイアウォール】をクリックして【Webアプリケーションファイアウォールの設定 】画面で、【利用しない】にチェックを入れ【変更】ボタンをクリックします。

これでファイアウォールが無効になりました。

 

 

ドメインを削除するために【ドメイン/SSL設定】をクリックして開きますが、SSL設定を解除しないと【削除】するボタンが使えないので、【削除】ボタンの上にある【変更】ボタンをクリックします。

 

 

 【ドメイン詳細設定】の画面に変わります、【共有SSL、SNI SSLを利用しない】にチェックを入れて【送信】ボタンをクリックします。

 

 

これでドメイン【削除】のボタンが使用できるようになりましたので、【削除】ボタンをクリックします。

 

 

ドメイン削除の画面に変わり承諾を求めてきますので、【送信】をクリックしてドメインの削除を行います。

 

 

ここでドメインの削除が終わったら、新規サーバーに直ぐにドメインを移行したい所ですが、直ぐにはドメインの移行はできないです、私は大丈夫だろうと直ぐ新規サーバーにドメインを移行しました、画面では新規追加できていたため、サイトにアクセスしてみましたが表示されませんでした。(もしかしたら少し待てば表示されていたのかもしれません)
「やってしまったー」と思い新規追加したドメインを一度削除して次の日に再度新規追加したところ、「指定されたドメイン名は登録されています」と赤文字が出てしまいドメインの新規追加が出来なくなってしまいました。

この原因の対処方法を色々検索したところ、ゾーン設定を解除すればいいと言う事らしいのでこの方法を試してみる事にしました。

皆さんはこのようなミスはしないと思いますが、私のような方もいないとも限りませんのでやり方を解説しておきます。

この方法はさくらで取得したドメインに限ります。

先ずはさくらの会員メニューに【会員ID】、【パスワード】を入力してログインログインボタンをクリックします。

さくらインターネット会員認証

 

 

会員メニューのトップ画面でドメインの確認をクリックします。

ドメインの確認をクリック

 

 

新規に追加するドメインのゾーン編集をクリックします。

ゾーン編集をクリック

 

 

【ゾーン表示】の画面に変わったら【削除】ボタンをクリックします。

この作業を行って次の日ドメインの新規追加をしてみたら無事追加することができました。

結果的には三日近くサイトの表示が出来なくなると言うミスをしてしまいました。

「ドメインの再設定は2時間待って行ってください」とのことなので、ここは余裕をもって行った方がよさそうですね。(私の事です)

 

 

ドメインを新規追加する

既定の時間が過ぎたら(2時間)新規サーバーにドメインを追加していきます。

新規サーバーのコントロールパネルにログインして【ドメイン設定】の【ドメイン/SSL設定】をクリックします。ドメイン/SSL設定をクリック

 

 

【ドメイン一覧】の画面で【新しいドメインの追加】をクリックします。

 

 

私の場合さくらで取得したドメインなので、「2.さくらインターネットで取得したドメインを使う」を選択して【お選びください】のプルダウンメニューをクリックして、対象のドメインを選択します。

ドメインを選択したら【送信する】ボタンをクリックします。

他社で取得したドメインの場合やり方が違うのでこちらを参考に行ってください。⇒さくらのサポート情報

 

 

先ほど選択したドメイン名が表示されます、選択したドメインに間違えがなければ【送信する】ボタンをクリックします。

 

 

【ドメイン追加 最終確認】の画面に変わりますので、【送信する】ボタンをクリックします。

 

 

これで新規サーバーへのドメイン追加が完了しました。

なお「反映には数時間から48時間程度のを時間が必要となります。」との説明がありますが私の場合20分程度で反映されたので、状況によって変わってくると思われます。

 

 

ドメインの新規追加が完了したら【ドメインSSL設定】で対象となるドメインの【変更ボタン】をクリックして、【SNI SSLを利用する】にチェックを入れSSL設定を有効にしておきましょう。

まだサイトのSSL化を行っていない方はこちらの記事を参考にしてみてください⇒さくらサーバーの無料SSLでサイトを常時SSL化する手順

 

 

表示速度の向上は出来たか

モジュールモードに乗り換えた原因としてはWordpressの高速化を図りたいと言う事だったので、どの位高速化したのかPageSpeed Insightsでテストしてみました。

移行する前の旧サーバーで直前の【PageSpeed Insights】のデータを取っていなかったので比較できないのですが、それほど大きく変わっていないようにも思います、しかし体感的にはサイトにアクセスした時やページの切り替え、管理画面の切り替え時など確実に表示速度が上がっていると実感できました。

PageSpeed Insightsでテスト

結果的には他の機能も増強していると言う事なので新規サーバーへの移行は正解だったと思います。

 

 

最後に

新規サーバーの乗り換えはそれ程難しい物ではありませんが私のように早く切り替えようとマニュアルを無視してやると逆に余分な時間が掛かってしまうので慌てずに落ち着いて時間に余裕を持った作業を心がけてください。(慌てて作業をして私のようなヘマをすると時間の無駄になってしまいますので。)

お試し期間が2週間あるのでどの様なものか体験して決められるので先ずは体験してみてはどうでしょう?

さくらのレンタルサーバ スタンダード

]]>
https://noritacraving.com/module-mode-from-the-cgi-mode/feed 0
WordPressカスタマイズ時の【CSS追加】と子テーマの作成方法 https://noritacraving.com/css-add-child-theming https://noritacraving.com/css-add-child-theming#respond Tue, 31 Jul 2018 12:52:04 +0000 https://noritacraving.com/?p=2784 サイトのカスタマイズをするに当たってテーマのコードの修正や書き足しを行う必要があります。

直接テーマのコードを修正したり書き足したりするとテーマのアップデート時に変更した箇所が失われてしまいます。

そうならないために子テーマを作ってテーマの修正変更をすれば変更した箇所が確実に保持されます、WordPress 4.7以降のバージョンでは、・・・

子テーマを作る理由

サイトのカスタマイズをするに当たってテーマのコードの修正や書き足しを行う必要があります。

直接テーマのコードを修正したり書き足したりするとテーマのアップデート時に変更した箇所が失われてしまいます。

そうならないために子テーマを作ってテーマの修正変更をすれば変更した箇所が確実に保持されます、WordPress 4.7以降のバージョンでは、管理画面の【外観】⇒【カスタマイズ】⇒【追加CSS】からデザインを変えることもできますが、あくまで補助的なものであるため、本格的にCSSの修正やphpファイルの変更をするのであれば子テーマを作るほうがいいと思います。

 

 

管理画面からのCSS追加

テーマをカスタマイズするには管理画面から直接テーマの編集をすることもできますが、テーマのアップデートをすると編集したコードがリセットされてしまいます、WordPress 4.7以降のバージョンでは、【追加CSS】の機能が追加されたので直接テーマの編集をすることなくCSSの修正をすることができます。

またテーマのアップデート後にも修正したCSSは引き継がれます、ただしテーマを変えてしまうと【追加CSS】で変更や修正をした箇所は反映されません。

【追加CSS】は補助的に利用するものであり、本価格的なCSSの編集をするのであれば子テーマを作成してCSSの編集をしたほうが良いでしょう。

【追加CSS】の機能を使用するには管理画面左側のメニューから外観⇒カスタマイズを選択します。

カスタマイズを選択

 

 

画面が変わりますので【追加CSS】のボタンクリックします。

テーマによっては【追加CSS】の項目がない場合もあるようです。

CSS追加ボタンをクリック

 

 

コードを入力する画面が出ますのでここに追加修正したいコードを入力すれば反映されます。

この方法だと子テーマを作る手間をかけることなくデザインの編集が可能になります、もしテーマのデザインを少し変える程度ならばこちらを使ってカスタマイズしたほうが便利かもしれませんね。

CSSコードを記述する

 

 

プレビュー画面を見ながらカスタマイズできるので、カスタマイズ後の様子をすぐに見ることができます。

プレビュー画面を見ながらカスタマイズ

 

 

子テーマの作り方

子テーマは、 1つのディレクトリと、最低2つのファイル(style.css と functions.php) から構成されます。

子テーマを作成するにはまず最初に子テーマディレクトリを作成していくところから始めます。

まずは子テーマを作るための親テーマをインストールしておきます、またはインストール済みのテーマや今現在使っているテーマでもOKです。

この記事では【Wordpress】にすでにインストールされているWordPress公式テーマ【Twenty Seventeen】で子テーマを作ってみますね。

私が使っているレンタルサーバーは【さくらのレンタルサーバ】ですのでこちらを使ってやってみたいと思います、どのレンタルサーバーも操作の仕方はそれほど大差ないと思います。

サーバコントロールパネルにログインしたら【ファイルマネージャー】を選択します。

FTPを使ってもこの工程で作成できます。

FTPの使い方をかいた記事はこちら⇒FTPソフト(WinSCP)でPCのデータをサーバーに送る方法

ファイルマネージャーを開く

 

 

ファイルマネージャーが開いたら子テーマを作成したいフォルダを選択して開きます。

小テーマの作成フルダを開く

 

 

フォルダが開いたら次に【wp-content】フォルダを開きます。

wp-contentを開く

 

 

フォルダが開いたら【themes】フォルダを開きます。

themesフォルダを開く

 

 

フォルダが開いた階層に子テーマフォルダを作成します。

【表示アドレスへの操作】の▼プルダウンメニューをクリックして【フォルダ作成】を選択します。

新しいフォルダの作成

 

 

ダイアログボックスが開きますので子テーマの名前を入力します。

ここでは【Twenty Seventeen】の子テーマなので【twentyseventeen-child 】としましたが、自分がわかりやすければ何でも良いです。

入力できたら【OK】のボタンをクリックします。

わかりやすい名前を入力

 

 

これで新しいフォルダ【twentyseventeen-child】の作成できましたが、このままではフォルダの中が空のため表示されません。

新しいフォルダの完成

 

 

WordPress管理画面からテーマを見てみるとインストール済みだが「スタイルシートが見つかりません。」となっています。

ファイルマネージャーに戻り【twentyseventeen-child】の中にstyle.cssのファイルを作ります。

画面表示ができない

 

 

【style.css】ファイルの作成

【twentyseventeen-child】のフォルダを開いて【style.css】のファイルを作成します。

新しく作成したフォルダを開く

 

 

フォルダが開いたら【表示アドレスへの操作】の▼プルダウンメニューをクリックして【ファイル作成】を選択します。

表示アドレスへの表示からファイル作成を選択

 

 

空白の画面になりますので【style.css】のコードを記述します

/*
 Theme Name:twentyseventeen-child
 Theme URI:http://example.com/twentyseventeen-child/
 Description:twentyseventeen-child-Theme
 Author:norita
 Author URI:http://example.com
 Template:twentyseventeen
 Version:1.7
 License:GNU General Public License v2 or later
 License URI:http://www.gnu.org/licenses/gpl-2.0.html
 Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
 Text Domain:twentyseventeen-child
*/

これはWordPress公式サイトに書かれている記述をもとに作成したものですが、実際には水色の親テーマと小テーマの記述があれば良いので、面倒くさい方は簡単にしてしまいましょう。

コードの記述が終わったら【保存】のボタンをクリックします。

style.cssコードを記述

 

 

ダイアログボックスが開くので【style.css】と入力してOKをクリックします。

ファイル名style.cssと入力

 

 

WordPress管理画面からテーマを見てみると小テーマの表示が確認できます。

子テーマが表示されるか確認

 

 

プレビュー画面を見ると【functions.php】の作成をしていないため表示が変です、先程のファイルマネージャーに戻り【functions.php】の作成を行います。

functions.phpの記述がないため表示がおかしい

 

【functions.php】ファイルの作成

上記で作成した【style.css】と同じ階層に【functions.php】のファイルを作成します、【表示アドレスへの操作】のプルダウンメニューをクリックして【ファイル作成】を選択します。

表示アドレスへの作成からファイル作成を選択

 

 

コードを記述する画面に変わりますので【functions.php】のコードを記述します。

こちらもWordPress公式サイトを参考にして記述していきます。

<?php
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-style',
get_stylesheet_directory_uri() . '/style.css',
array('parent-style')
);
}
?>

 

 

コードを記述したら【保存】のボタンをクリックします。

functions.phpコードを記述して保存をクリック

 

 

ダイアログボックスが表示されたら【functions.php】と入力して【OK】ボタンをクリックします。

ファイル名を記述してOKをクリック

 

 

これで【twentyseventeen-child】に【style.css】と【functions.php】のファイルが作成できました。

2つのファイル作成

 

 

子テーマの有効化

WordPress管理画面から【twentyseventeen-child】テーマのプレビュー画面を見ると正常な表示に変わりました。

子テーマのプレビュー画面

 

 

これで子テーマの作成ができましたので子テーマの有効化をクリックしてして完了です。

有効化をクリック

 

 

スタイルシート以外のファイルを子テーマに置く

子テーマの場合はデザインを指定する【style.css】だけではなくサイトの構成などを変えたい場合などに親テーマのファイルを全て上書きできます、ここが管理画面の【追加 CSS】とは違ったところです。

やり方は、親テーマから変更したいファイルを子テーマに置くだけです。

先ほど作成した子テーマ【twentyseventeen-child】(この記事での設定では)と同じ階層にある親テーマ【twentyseventeen】を開きます。

【子テーマを作ったサイト名】⇒【wp-content】⇒【themes】⇒【twentyseventeen】(この記事での親テーマ)に行きフォルダを開きます。

親テーマのフォルダを開く

 

 

フォルダを開いたら変更したいファイルをクリックして【指定の場所に複製】を選択します。

変更したいファイルを選択

 

 

ダイアログボックスが開きますので【twentyseventeen-child】(この記事の設定では)を選択して【OK】ボタンをクリックします。

子テーマを選択

 

 

「以下のファイル・フォルダ等はすでに存在しています」となりますがこれは親テーマの事だと思われますので【はい】のボタンをクリックします。

はいを選択

 

 

これで子テーマに【header.php】のファイルを置くことができました。

子テーマは親テーマのすべてのファイルを上書きする事ができます、また親テーマに存在しないファイルを、子テーマに含める事が出来ます。

子テーマに選択したファイルを複製

以上が子テーマを作る方法です、これで親テーマがアップデートしてもテーマの変更は消えることなく保持されます。

 

 

最後に

子テーマ作成をする場合デザインだけの場合なら管理画面の【外観】⇒【カスタマイズ】⇒【追加CSS】から変更ができますのでこちらを使うほうが簡単かと思いますが、サイトの構成などを変えたい場合には子テーマを作ってのカスタマイズになるかと思います。

テーマに直接カスタマイズを施してしまうと、テーマのアップデート時には変更した内容は全て消えてしまいます、致命的なエラーやセキュリティーの面からアップデートしなければ良いという訳にはいかないので、カスタマイズするなら管理画面から【追加CSS】使ってのカスタマイズか、本格的なカスタマイズを行うなら子テーマを作る事を選択しましょう。

]]>
https://noritacraving.com/css-add-child-theming/feed 0
ステージングサーバー上でサイトのテストができるSnapUpの使い方 https://noritacraving.com/snapup-how-to-use https://noritacraving.com/snapup-how-to-use#respond Sat, 30 Jun 2018 14:54:43 +0000 https://noritacraving.com/?p=2651 自サイトをカスタマイズしたり更新したりする場合になにか不具合がないかどうか公開する前にテスト出来る機能がさくらのレンタルサーバで無料で提供されています。

バックアップ機能も備えていてレンタルしているサーバーに保存されるのではなく他サーバーに保存されるのでレンタルしているサーバーの容量が圧迫されることはないので負担がありません。

このSnapUpをつかえばテストサイトを作ってサイトの検証作業をすることなくサイトのテストができるので便利な機能だと思います。

ここではSnapUpの導入方法や使い方を解説します。

さくらインターネットの【バックアップ&ステージング powered by Snapup】を使ってみる

2018年1月25日よりさくらインターネットで株式会社ユニマルと業務提携して【バックアップ&ステージング powered by Snapup】を提供開始しました。

バックアップ&ステージングとはどんな機能なのでしょう?

  • スナップショット機能:コピーしたデータをスナップショットという単位でバックアップします、サーバ上のデータ、データベース上のデータをまとめてスナップショットが取れます。
  • ステージング機能:本番同様のテストを行うためのサーバのことで、 レンタルサーバとは別のサーバ上でテストができるのでどんな操作をしても実際のサイトには影響はありません。
  • リリース機能:別サーバーでテストしたページをそのまま本番サーバーにリリースすることができます。

Snapupではこのような機能がありテストサイトを新たに作ることもなくバックアップも同時に行ってくれます、このサービスは無料で使えますからぜひ活用しましょう。

細かい説明はさくらのサポート情報を参照してください。

 

 

Snapup導入方法

Snapupはエックスサーバー、ヘテムル、カゴヤ・ジャパンなどのレンタルサーバーでも対応していますが、ここでは【さくらのレンタルサーバ】での導入方法を説明します。

まずは、【さくらインターネットサーバコントロールパネル】にログインして「運用に便利なツール」の【バックアップ&ステージング】をクリックします。

 

 

バックアップ & ステージングの設定画面に変わるので【利用開始】のボタンをクリックします。

これでSnapupの利用が可能になりました。

 

 

次に【Snapupで開く】のボタンをクリックします。

 

 

Snapupを開くとホスト名が表示されたアイコンがありますのでクリックします

 

 

画面が変わりますので左側にある【サイトを追加する】をクリックします。

 

 

【サイトを追加する】画面になります、上からサイト名を入力します、サイトタイプには真ん中の【Wordpress】を選択します。

【対象パス】は下にある【WPパスを選択】から対象のパスを選択して入力します。

最後に追加をクリックします、これでサイトの追加が完了しました。

 

 

サイトの追加が完了すると以下の画面が表示され「実行しますか?」と聞いてくるので【OK】をクリックします。

  • スナップショットの取得
  • ステージングサーバーの作成
  • ステージングサーバーへのスナップショットのセット

以上の項目を自動で行います。

 

 

【スナップショット取得中】の画面が出ます、全てにチェックマークが入れば完了です。

 

 

「Snapupを使い始める準備ができました!」の画面になったら、【ステージングサイトを開く】のボタンをクリックします。

 

 

これでWordPressのスナップショットの取得が完了しました。 

 

 

スナップショットのスケジュール設定

スナップショットの取得が完了したら次に同じ画面の右下に【スケジュール設定】のボタンがありますので定期的にスナップショットをとる設定をしておきましょう。

【スケジュール設定】のボタンをクリックします。

 

 

【サイト設定】の画面に変わります最初に自動でスナップショットを取る日を毎週にするか毎日にするかを設定します。

更新する頻度により実行する感覚を決めればいいと思います。

次に実行する曜日と時間帯を決めます、あまり影響はないと思いますが、実行している間サイトの表示速度が遅くなることも考えられますのでサイトへのアクセスが少ない曜日と時間帯を選んでチェックを入れます、毎日を選んだ方は当たり前ではありますが曜日は指定できません。

設定が終わったら保存をクリックします。

 

 

スナップショットを手動で作成する

上記では自動でスナップショットを定期的に作成する設定方法でしたが、ここではスナップショットを手動で作成する方法を解説します。

先ず管理画面上の【スナップショットを追加、作成する】をクリックします。

 

 

以下の画面に変わりますので【本番サーバーから取得】をクリックします。

 

 

【スナップショットを追加する】画面に変わりますので、適当なコメントを入力して(何でもいいです)【実行】をクリックします。

 

 

【スナップショット取得中です】と表示が出ますので取得が完了するまで少し待ちます。

全ての項にチェックが入ればスナップショットの取得は完了です。

 

 

新しいステージングサーバーの作成

新しいスナップショットを取得したらステージングサーバーも新しくしてサイトの検証などを行います。

Snapupの管理画面から新しく作成したスナップショットをクリックします。

 

 

下に表示された【ステージングサーバーへセット】をクリックします。

 

 

「よろしいですか?」の表示が出るので【OK】のボタンをクリックします。

 

 

【ステージングサーバーにセット中です】と表示が出ますのでセットが完了するまで少し待ちます。

 

 

管理画面右側のステージングサーバーに新しく作成されたスナップショットが表示されます。

 

ステージングサーバーにセットしたサイトを開く

次にステージングサーバーにセットしたサイトを開いてみます。

一番上に表示されているサイトのURLをクリックします。

 

 

本番サイトと同じサイトがステージングサーバーのURLで表示されました。

 

 

phpMyAdmin へのログイン方法

【STAGING SERVER】のphpMyAdminへログインするにはユーザー名とパスワードが必要ですが、本番サーバーのphpMyAdminとはユーザー名、パスワードとも異なったものになります。

【STAGING SERVER】の下にある「認証情報を確認する」ボタンをクリックすると、URL、ユーザー名、パスワード情報がありますので、【phpMyAdmin】のURLをクリックします、「認証情報を確認する」ボタンの上のphpMyAdmin】ボタンでもいいです。

phpMyAdminのログイン画面に変わります、先程の認証情報にあったユーザー名とパスワードを入力して【実行をクリックします】。

 

 

これで【STAGING SERVER】のphpMyAdminへのログインが完了しました。

 

 

ステージングサーバーのサイトをカスタマイズしてみる

ステージングサーバーのサイトをカスタマイズしてみたいと思います。

ここでは【style.css】をいじってサイトの色や背景を変えてみます。

【STAGING SERVER】画面の下側にある【ファイルマネージャー】のボタンをクリックします。

 

 

【SnapUp File Manager】の画面に変わったら【 wp-content】をクリックして開きます。

 

 

【 wp-content】が開いたら【 themes】をクリックします。

 

 

自サイトで使っているテーマを右クリックして開くを選択します。

 

 

テーマが開いたら【style.css】を右クリックして編集を選択します。

後は【style.css】のカラーコードを変えるだけです、その他のデザインもここで変えることができます。

ただし、ステージングサーバのファイルマネージャーから【style.css】にコードをコピペしようとしても何故か出来ないのでコードを自分で書かなければなりません、一応この方法も書きましたが、不慣れな方には(私もそうです)不便ですのでステージングサーバーのURLでWordpressの管理画面に入り【外観】⇒【テーマの編集】⇒【style.css】へコードをコピペした方が良さそうです。

 

 

ステージングサーバーのサイトURLでWordpressの管理画面にログインするにはステージングサーバーのサイトURLに【/wp-login.php】または【/wp-admin/】を付け足します。

 

 

ログイン画面に変わったら本番サイトと同じユーザー名とパスワードを入力して【ログイン】ボタンをクリックします。

 

 

ステージングサーバーサイトの管理画面が表示されます。

 

 

次に管理画面左側のメニューから【外観】⇒【テーマの編集】⇒【style.css】に行きコードの修正や書き足しを行います。

ここではカスタマイズする方法は割愛します。

失敗したり、やり直ししたい場合は新たにスナップショットを作成してステージングサーバーにセットすれば良いため、失敗を気にせずテストできるのでかなり使える機能ではないかと思います。

PCでサイトを表示すると変わった感じもしますが、スマホで表示すると変わった感じはあまりないので今まで通りでいいかなとも思いますが、苦にならずいろいろ試せて便利な機能ですよね。

 

 

テストして必要なくなったサイトの削除は【Snapup】管理画面から削除したいスナップショットの右側にある歯車マークのアイコンをクリックします、【削除】ボタンが表示されますのでボタンをクリックします。

 

 

「よろしいですか?」と聞いてきますので【OK】ボタンをクリックすれば完了です。

 

 

本番サーバーへのリリース方法

本番サーバーへのリリースをする前には不具合に備えて新しいスナップショットを作成しておきましょう、また本番サーバーへリリースする場合、スナップショット作成時までサイトの情報は戻ってしまうため最新のスナップショットをリリースするようにしてください。

【Snapup】管理画面から本番サーバーへリリースするスナップショットをクリックします。

スナップショットが開いたら【本番サーバーへリリース】のボタンをクリックします。

 

 

「よろしいですか?」と聞いてきますので【OK】ボタンをクリックすれば完了です。

 

 

最後に

【 Snapup】はスナップショットでサーバー上のデータとデータベース上のデータをバックアップしてくれる機能があります、バックアップするプラグインは知られていますがステージングサーバでサイトを表示する機能まで備えているプラグインはないと思います。

今までカスタマイズする場合、なにか不具合があったら嫌だなと思いながらやっていたことも、ステージングサーバーのサイトでテストできるので気兼ねなく試せてとても便利だと思います。

サイトのカスタマイズが気に入ればそのまま復元できるしとてもいい機能だと思います、ましてやこの機能が無料で使えるのですから有り難いことです、まだこの機能を利用して間もないですが、この機能はこれからも利用していくと思います。

]]>
https://noritacraving.com/snapup-how-to-use/feed 0
さくらサーバでMySQL5.5をMySQL5.7にバージョンアップ https://noritacraving.com/mysql5-5-version-upgrade https://noritacraving.com/mysql5-5-version-upgrade#respond Wed, 23 May 2018 02:49:33 +0000 https://noritacraving.com/?p=2575  さくらのレンタルサーバでは【MySQL5.5】から【MySQL5.7】へのバージョンアップを推奨しています。

【MySQL5.7】の提供開始以降にサイトを立ち上げた方は関係ない話ですが、【MySQL5.7】の提供開始以前にサイトを立ち上げた方は旧バージョンのサポートが終わっているので、不具合が起きた時さくらのレンタルサーバで対処できないそうです。

まだ旧バージョンでサイトを運営されている方は【MySQL5.7】へバージョンアップすることをおすすめします。

さくらのレンタルサーバ から【MySQL5.7】提供開始

【MySQL5.7】へのバージョンアップの提供開始は2018年1月18日からでしたが、メールを見逃していたらしく新しいサイトを作ったときにバージョンアップしていることに気が付きました。

2018年1月18日以降から作ったサイトは【MySQL5.7】になっていますから問題はありませんので何もすることはありません。

早速さくらのレンタルサーバにアクセスしてお知らせを見た所、有りました。

さくらのレンタルサーバ 「データベース機能」における「MySQL 5.7」提供開始のお知らせ

MySQL5.7提供開始

だいぶ日にちが経っていますが旧バージョンはサポートされないということなので【MySQL5.7】へのバージョンアップを行います。

 

 

データベースのエクスポート

まずは移行するデータベースをPCにエクスポートしておきます。

【さくらインターネットサーバコントロールパネル】にログインして【データベースの設定】をクリックします。

データベースの設定をクリック

 

 

【データベースの設定】画面に変わったら管理ツールの【管理ツールログイン】をクリックします。

管理ツールログインをクリック

 

 

phpMyAdmin】のログイン画面に変わりますのでユーザー名、パスワードを入力して、【実行】をクリックします。

phpMyAdminのログイン画面

ログインしたら左側にあるデータベース一覧から、エクスポートするデータベースを選択して、上部にある【エクスポート】ボタンをクリックします。

 

 

様々な設定がありますがデフォルト設定でsqlファイルがエクスポート出来ますので実行ボタンをクリックします。

データベースエクスポート

 

 

PCにsqlファイルがエクスポートされたか確認します。

〇〇〇〇.sqlというファイルが確認できたらMySQL5.5】のデータベースからエクスポートしたファイルのテーブルを削除して何もない状態にします。

PCにsqlファイルがエクスポートされたか確認

 

 

削除するには【  】をクリックし全てにチェックを入れ【チェックしたものを】の▼プルダウンメニューをクリックして削除を選択します。

これでMySQL5.5】には何もない状態になりました。

テーブルを削除

MySQL5.5】自体は削除しないで残しておいて下さい万が一、移行出来なかった場合に応急処置としてMySQL5.5】に戻しておけばサイトの表示が今までと同じに出来ます。

MySQL5.5】を削除してしまうともうMySQL5.7】しか選択できなくなってしまいます。

 

データベース新規作成

【さくらインターネットサーバコントロールパネル】にログインして【データベースの設定】をクリックします。

データベースの設定をクリック

 

 

【データベースの設定】画面に変わったら【データベースの新規作成】をクリックします。

データベースの新規作成をクリック

 

 

【データベースの新規作成】画面に変わったらMySQL5.5】のときと同じデータベース名を入力します、ユーザー名とパスワードはMySQL5.5】の時と同じものが入力済になっているかと思いますのでそのままでOKです。

データベースのバージョンは今の所【5.7】だけ選択可能です。

データベースの新規作成

最期に【同意する】をクリックして完了です。

 

 

エクスポートしたsqlファイルをMySQL5.7】にインポートする

次に上記でエクスポートしたsqlファイルを新規作成したMySQL5.7】にインポートします。

新規作成したMySQL5.7】の【管理ツールログイン】をクリックします。

管理ツールログインをクリック

phpMyAdmin】のログイン画面に変わりますのでユーザー名、パスワードを入力して、【実行】をクリックします。

 

 

ログインしたホーム画面で上部にあるインポートを選択します。

インポートを選択

 

 

インポートの方法は2通り有ります、インポート画面の【ファイルを選択】をクリックすると、ダイアログボックスが表示されますのでファイルのある場所を選択して【開く】をクリックします、最後に下にある【実行】をクリックします。

ファイルを選択をクリックで実行

 

 

もう1つのやり方は上記のやり方でファイルのある場所を選択したら、直接ファイルをドラッグ&ドロップします、この場合【実行】をクリックしなくてもインポートが始まります。

ファイルを選択をクリックしてドラッグ&ドロップ

 

 

ダイアログボックスが表示されアップロードがうまくいくと【〇〇〇〇_db.sql】の右端に【成功】と表示されます、これでMySQL5.7】にsqlファイルがインポート出来ました。

インポートの完了

次ぎに【wp-config.php】内の記述を書き換えます。

 

 

【wp-config.php】の記述を書き換える

レンタルサーバーのファイルマネージャーまたはFTPを使い【wp-config.php】内の記述の書き換えを行います、ここではファイルマネージャーを使った方法で書き換えを行います。

FTPを使って行う場合はこちらの記事が参考になります。⇒FTPソフト(WinSCP)でPCのデータをサーバーに送る方法

 

 

【さくらインターネットサーバコントロールパネル】にログインして【ファイルマネージャー】をクリックします。

ファイルマネージャーをクリック

 

 

ファイルマネージャーの画面に変わったら、記述を書き換えるフォルダを開いて【wp-config.php】を右クリックし編集を選択します。

wp-config.phpを右クリック

 

 

【wp-config.php】が開いたらユーザー名、パスワードはMySQL5.5】の時と同じになっていると思うので(確認して下さい)書き換える必要はありません、書き換えたいところは【MySQL】のホスト名です。

ホスト名を書き換える

 

 

ホスト名は【さくらインターネットサーバコントロールパネル】⇒【データベースの設定】⇒MySQL5.7】の【データベース サーバ】のホスト番号をコピペ

して【wp-config.php】のホスト名を書き換えます。

【wp-config.php】のホスト名を書き換えたら最期に保存をクリックして作業の完了です。

ホスト名をコピペ

 

 

最期に

反映するまでに多少の時間がかかったように思いますので、少し待ってみて反映されていないようであれば、もう一度ファイルマネージャーの【wp-config.php】を開いてユーザー名、パスワード、ホスト名を確認します。

MySQL5.5】~MySQL5.7】へのバージョンアップの確認が完了できたら、最期にMySQL5.5】のデータベースは削除してしまいましょう。

]]>
https://noritacraving.com/mysql5-5-version-upgrade/feed 0
【WordPress】BackWPupプラグインでバックアップしたデータの復元方法 https://noritacraving.com/backwpup-plug-in-restore https://noritacraving.com/backwpup-plug-in-restore#respond Wed, 25 Apr 2018 14:54:50 +0000 https://noritacraving.com/?p=2480 データのバックアップは何かしらの不具合があった時に元に戻せるように取っておくものですね。

不具合があった場合バックアップデータの復元が出来なければ、バックアップを取っていても意味のないものになってしまいます。

データのバックアップは出来ても「バックアップデータの復元はどうするの?」と言う方もいると思います。

ここではバックアップデータの復元方法を解説していきます。

バックアップデータの復元

WordPressを利用すると、テーマをカスタマイズしたり新しいプラグインを入れたときなどに不具合が起きるときがあります、そんなときにバックアップを取っていればバックアップを取った時点までサイトを元に戻す事が出来ます、バックアップが古いとその後に行った作業は失われてしまうので作業前にはバックアップを取っておくようにしたいです。(面倒ですが)

バックアップを取っていても肝心なバックアップデータを復元するやり方がわからないとバックアップする意味がないのでここでやり方を解説していきますね。

 

 

バックアップデータを取るにはプラグインを使うと便利

データのバックアップはいつ何が起こるかわからないので定期的に取ることが必要です、【BackWPup】プラグインは自動で定期的にバックアップを取ってくれるので手間がかからず簡単ですので初心者の方はプラグインを使うバックアップ方法がおすすめです。

バックアップを取るプラグインは他にも いろいろ有って、【UpdraftPlus】プラグインは復元まで出来ますが、管理画面の表示ができないようなトラブルのときは復元できないので何とも言えませんが、このプラグインも人気があるようです、オンラインストレージにバックアップデータを保存する場合【BackWPup】プラグインは馴染みのあるところでは【Dropbox】位しかありませんが、【UpdraftPlus】プラグインでは【Dropbox】、【Google Drive】、【Microsoft OneDrive】などにバックアップデータを保存出来るのでちょっと魅力ではあります。

という事でここでの復元方法は、【BackWPup】プラグインで取ったバックアップデータを復元するやり方で解説していきます。

プラグインでバックアップを取る方法⇒BackWPup定期的にバックアップを取るプラグイン

 

 

2つのデータを復元する

プラグインで取ったバックアップデータにはサーバー上のデータとデータベース上のデータがあります、サーバ上のデータとは主にアップロードした画像や、テーマ、プラグインなどが含まれるデータで、データベース上のデータは主に記事の内容やタイトル、カテゴリーなどが含まれているデータです。

プラグインで2つのデータのバックアップを取っておけば、不具合があった場合どちらのデータもありますので復元は可能です。

ここではレンタルサーバーの引っ越しやドメインを変えての復元ではなく、Wordpressに不具合が起きた場合の復元方法を解説します。

 

 

サーバー上のデータを復元する

【BackWPup】プラグインでバックアップしたデータは、サーバー内のフォルダかDropboxなどのオンラインストレージに保存してあると思いますので、一度PCにダウンロードします。

サーバー内のフォルダからPCにダウンロードする場合はFTPかファイルマネージャーを使ってダウンロードします。

 

FTPを使ってダウンロードする

FTPを使ってダウンロードする場合は【wp-content】⇒【uploads】⇒【file backwpup】⇒一番新しい日付のフォルダを右クリックして【ダウンロード】を選択するか、フォルダを直接ドラッグ&ドロップしてダウンロードします。

関連する記事⇒FTPソフト(WinSCP)でPCのデータをサーバーに送る方法

FTPを使ってダウンロードする

 

 

レンタルサーバーのファイルマネージャーを使ってダウンロードする

レンタルサーバーのファイルマネージャーでダウンロードする場合。(ここではさくらのレンタルサーバー)

【さくらインターネットサーバコントロールパネル】にログインして【ファイルマネージャ】をクリックしますします。

ファイルマネージャーを開く

 

 

ファイルマネージャーを開いたら復元するサイトのフォルダを右クリックして【フォルダを開く】を選択、FTPと同じ手順で【wp-content】⇒【uploads】⇒【file backwpup】で右クリックして【フォルダを開く】を右クリック、一番新しいフォルダを選択して右クリックしたら【ダウンロード】を選択します。

一番新しいフォルダを選択

 

 

オンラインストレージに保存してあるバックアップデータをダウンロード

Dropboxなどのオンラインストレージにバックアップしたデータを保存してある場合は、オンラインストレージにアクセスしてバックアップデータをダウンロードします。

(ここではDropboxを使ったダウンロード方法で説明しています)。

Dropboxにログインしたら【BackWPup】のフォルダを開きます。

Dropboxからデータをダウンロード

 

 

 

【BackWPup】フォルダを開いたら【file_backup】の最新の日付を選択して【…】のアイコンをクリックします。

ダイアログボックスが開くので【ダウンロード】をクリックしてPCにダウンロードします。最新の日付を選択

 

 

WordPress管理画面からダウンロードする

【BackWPup】プラグインで取ったデータはWordpress管理画面からダウンロードすることも出来ます。

管理画面左側にあるメニューから【BackWPup】をクリックしてバックアップを選択します。

Wordpress管理画面からダウンロード

 

 

【バックアップ】をクリックすると、「バックアップアーカイブを管理」の画面に変わりますので【▼】のプルダウンメニューからバックアップ先のフォルダを指定して、【先を変更】をクリックします。

バックアップをクリックする

 

 

フォルダを指定したら最新のバックアップデータを選択し、ダウンロードをクリックしてPCに保存します。最新のバックアップデータを選択

 

 

これでバックアップしたデータフォルダがPCにダウンロードできました。

PCにダウンロード

ダウンロードしたバックアップデータはZIP形式のフォルダですので復元する前に解凍する必要があります。

【Windows】の場合、フォルダを選択して上にある【全て展開】をクリックします。

ZIP形式を解凍する

 

 

ダイアログボックスが開いたら【展開】をクリックして解凍します。展開をクリックして解凍

 

 

これでバックアップデータを復元する準備が完了しました。

復元する準備が完了

 

ダウンロードしたサーバー上のデータを復元する

PCにダウンロードしたバックアップデータを復元するにはFTPを使い復元します。

ここでは【WinSCP】使って復元する方法を解説します。

関連する記事⇒FTPソフト(WinSCP)でPCのデータをサーバーに送る方法

 

まずはFTPを起動させ向かって左側にダウンロードしたサーバー上のデータを表示させます。

  • ①をクリックしてバックアップデータのある場所を指定します。
  • ダイアログボックスが開いたら②の【参照】をクリックします。
  • クリックするとダイアログボックスが開くので③のバックアップデータファイルを選択します。
  • ④の【OK】をクリックします。
  • 最初のダイアログボックスに戻り⑤の【開く】をクリックします。

ダウンロードしたサーバー上のデータをFTPで復元

 

 

バックアップデータが左側に表示出来たら不要なファイル、【backwpup_readme.txt】、【〇〇〇〇.pluginlist.〇〇〇〇-〇〇-〇〇.txt】、【manifest.json】、などを削除します。

またフォルダを分けずにデータベース上のデータを一緒にしている方は、【〇〇〇〇_db.sql】を保存してこちらからは削除します。

不要なファイルの削除

 

不要なファイルを削除したら全てのファイルをドラッグして選択し【アップロード】の▼プルダウンメニューをクリックします。

3種類のアップロード方法から選んでアップロードを開始します、【アップロードして削除】を選ぶと、PCにダウンロードして解凍したバックアップデータをサーバーにアップロードしてPCから削除します。

全てのファイルをドラッグして選択

 

 

アップロード方法を選択するとダイアログボックスが開きますので【OK】をクリックします。

OKをクリック

 

 

OKをクリックするとダイアログボックスが開いて【上書きしますか?】と聞いてきます、【はい】を選択するとアップロードする度にこのダイアログボックスが表示されてしまい面倒なので、【すべてはい】を選択して続けてアップロードしてしまったほうが効率的です。すべてはいを選択して続けてアップロードこれでサーバー上のバックアップデータの復元は完了です。

 

データベース上のバックアップデータを復元する

データベース上のバックアップデータをPCにダウンロードする方法は上記【サーバー上のデータを復元する】と同じですのでここでは割愛します。

PCにダウンロードしたデータベース上のバックアップデータを解凍しておきまます。

サーバ上のバックアップデータと分けずに同じフォルダでバックアップを取った方はフォルダの中から【〇〇〇〇_db.sql】というファイルを取り出しておきます。

データベース上のバックアップデータを復元する

 

 

次にレンタルサーバーにログインして(ここでは【さくらのレンタルサーバ】を使用しています)データベース 【MySQL】の管理ツール【phpMyAdmin】にログインします。

サーバーコントロールパネルのデータベース設定画面で管理ツール ログイン】をクリックします。

phpMyAdminにログイン

 

 

phpMyAdmin】のログイン画面に変わりますのでユーザー名、パスワードを入力して、【実行】をクリックします。

パスワードを入力して実行をクリック

 

 

ログインしたら復元するデータベース名を指定して、【  】をクリックし全てにチェックを入れ【チェックしたものを】の▼プルダウンメニューをクリックして削除を選択します。

【BackWPup】でバックアップしたデータはテーブルを削除しなくてもデータが重複しないとのことですが、分かりづらいので全て削除してしまいます。(どちらでもお好きな方で)

プルダウンメニューをクリックして削除を選択

削除を選択すると「以下のクエリを本当に実行しますか?」と聞いてくるので【はい】のボタンをクリックして上部にあるインポートを選択します。

 

 

インポートの画面に変わります、【ファイルを選択】をクリック、PCにダウンロードして解凍したデータベースのバックアップデータの中から【〇〇〇〇_db.sql】ファイルを選択し【開く】をクリックして、インポート画面下にある【実行】ボタンをクリックします。

db.sqlファイルを選択

 

 

または直接【〇〇〇〇_db.sql】ファイルをドラッグ&ドロップしてアップロードすることも出来ます。

db.sql】ファイルをドラッグ&ドロップしてアップロード

 

 

ダイアログボックスが表示されアップロードがうまくいくと【〇〇〇〇_db.sql】の右端に【成功】と表示されます、これでバックアップデータの復元は完了しました。

バージョンによっては表示の仕方が多少違うかもしれません。(【phpMyAdmin】バージョン:4.7.9 【MySQL】バージョン:5.7の環境で行いました)

バックアップデータの復元は完了

 

 

最期に

バックアップを取っておけば何かの不具合が起きても対処できますので、プラグインで定期的にバックアップ取っておくことをおすすめします、手動でバックアップとなるとつい面倒になりバックアップを取らないで作業をしがちですがプラグインを使えば自動的にバックアップを取ってくれるので面倒だったり忘れることもないのでお薦めです。

バックアップデータを復元する方法を解説しました、もしサイトになにか不具合が起きたときに参考にしていただけたらと思います。

]]>
https://noritacraving.com/backwpup-plug-in-restore/feed 0
WordPressの画面が真っ白になった時、慌てずに対処する方法 https://noritacraving.com/wordpress-screen-white-out https://noritacraving.com/wordpress-screen-white-out#respond Fri, 23 Mar 2018 04:08:14 +0000 https://noritacraving.com/?p=2406 突然Wordpressの画面が真っ白になってしまったらあなたはどうしますか、多分あなたの頭の中も真っ白、顔面蒼白になり今まで書いた記事はどうなるのか途方に暮れてしまうことと思います。

ここでは画面が真っ白になった時に慌てず、どうすればいいか対処方法を解説していきます。

WordPressの画面が真っ白になる原因

  • PHPコードの書き間違え(典型的な原因はfunctions.phpというファイルを間違って書き換えた)
  • インストールしたプラグイン(他のプラグインとの競合、テーマとの相性が悪い、キャッシュ系プラグインが原因など)
  • WordPressのバージョンアップ(Wordpressのバージョンアップに未対応なプラグインが不具合を起こす)

上記のようなことが原因でWordpressの画面が真っ白になってしまいますがこの時に何とかしようと、慌ててあちこちをいじって修復不可能にしてしまわないように落ち着いて対処することが肝心です。(経験者です)

 

 

エラーメッセージを表示させる

まず画面が真っ白になったときに何が原因でこのような状態になっているのかわからないと対処するに時間がかかってしまいます。

WordPressではエラーメッセージを表示することが出来ますがそのままでは表示されない設定になっていますので、表示する設定に書き変える必要があります。

表示する設定に書き変えるにはFTPを使ってサーバーに接続するか、レンタルサーバーによってはファイルマネージャーを開くことが出来ますのでそこから直接書き換えます。

FTPを使用する場合はこちらの記事を参考にして下さい。⇒FTPソフト(WinSCP)でPCのデータをサーバーに送る方法

ここではさくらのレンタルサーバーを使ってエラーメッセージを表示させます。

下記画像は画面が真っ白になった状態ですこれでは何が原因でこのような状態になっているのかわかりませんね。

 

 

さくらインターネットサーバコントロールパネルからログインしてファイルマネージャーを開きます。

ファイルマネージャーを開く

 

 

ファイルマネージャーを開いたらエラーメッセージを表示させたい名前を指定して右クリックします。

ダイアログボックスが開きますので【フォルダを開く】をクリックします。

フォルダを開くをクリック

 

 

フォルダを開いたら、【wp-config.php】を指定して右クリックします。

ダイアログボックスが開きますので、編集をクリックします。

wp-config.phpを右クリックして編集を選択

 

 

編集画面に変わったらdefine('WP_DEBUG', false);というコードを探してdefine('WP_DEBUG', true);に書き換えます。

最期に【保存】をクリックして閉じればエラーメッセージの表示ができるようになります。

編集画面のコード書き換え

 

 

次にサイトにアクセスして真っ白になっていた画面にエラーメッセージが表示されているかどうか確認してみます。

エラーメッセージが表示されていますのでどこに不具合があるのかチェックします。

エラーメッセージの表示確認

 

 

エラーメッセージを見てみると【functions.php】の22行目にエラーが有ります。

Parse error: syntax error, unexpected end of file in

/home/〇〇〇〇/www/test/wp-content/themes/〇〇〇〇/functions.php on line 22

 

FTP、ファイルマネージャーでエラーの修正をする

エラーがわかったらFTPか(FTPの使い方はこちらFTPソフト(WinSCP)でPCのデータをサーバーに送る方法)ファイルマネージャーでエラーの場所、上記赤で囲った部分のwp-content⇒テーマ⇒テーマ名⇒functions.phpの階層(ここではfunctions.php)に行きエラーの修正をします。

まずは問題のあるフォルダを右クリックしてフォルダを開くを選択します。

ファイルマネージャーでエラーの修正

 

 

つぎに【wp-content】を右クリックしてフォルダを開くを選択⇒【themes】を右クリックしてフォルダを開くを選択。

wp-contentのthemesを開く

 

 

使用している【テーマ名】を右クリックして【フォルダを開く】を選択⇒【functions.php】を右クリックして【編集】を選択して画面が真っ白になった直前の編集箇所をもとに戻します。

functions.phpを修正

 

 

サイトが表示されているか確認します、画面をそのままにしていた方は[Ctrl]+「F5」キーを押して「スーパーリロード」を行います 。

問題が解決していればサイトが表示されます。

サイトの表示を確認

なにやら上の方に文字列が表示されていますが、これは致命的なエラーではなく注意的なことが書いてあるのですが、このままではサイトに表示されてしまいますので書き換えた【wp-content】 のデバックモードをdefine('WP_DEBUG', true);からdefine('WP_DEBUG', false);に戻します。

* 開発者へ: WordPress デバッグモード
* この値を true にすると、開発中に注意 (notice) を表示します。
* テーマおよびプラグインの開発者には、その開発環境においてこの WP_DEBUG を使用することを強く推奨します。

エラーメッセージの表示がでればどこに問題があるか解ります、画面が真っ白になったときでも慌てふためくことなく対処できますので、やたらいじりまくって修復不可能にすることは避けられると思います。

もしもこの作業ができるか不安な方は使用しているテーマを無効化する方法を行って下さい。(【functions.php】エラーの場合)

 

 

使用しているテーマを無効化して管理画面を表示させる

FTPか(FTPの使い方はこちらFTPソフト(WinSCP)でPCのデータをサーバーに送る方法)ファイルマネージャー(ここではさくらのレンタルサーバー)で上記(FTP、ファイルマネージャーでエラーの修正をする)のやり方で【wp-content】⇒【themes】⇒使っている【テーマ名】を選択して右クリックします。

ダイアログボックスが開いたら【削除】を選択して使っているテーマを削除してしまいましょう、なお編集した【functions.php】を残したい場合はダウンロードをクリックすると、ダイアログボックスが開きますので【開始】ボタンを選択すると、ZIP形式でPCにダウンロード出来ます。

 

テーマを選択

 

 

使っていたテーマを削除すると管理画面が表示されると思いますので確認します、画面をそのままにして表示されていない場合[Ctrl]+「F5」キーを押して「スーパーリロード」を行います 、画面が表示されたら管理画面左側の【外観】からテーマを選択します。

管理画面のテーマを選択

 

 

自動的にデフォルトのテーマに変わっていますので新規に編集前の同じテーマを配布サイトからダウンロードしてWordpressにアップロードします。

関連する記事⇒WordPressテーマの変更方法を初心者目線で解説します

テーマを入れ替える

テーマを新規のものに変えれば【functions.php】エラーの編集はもとに戻りますのでこれで真っ白画面の改善ができます。

 

 

プラグインによって画面が真っ白になった場合の改善方法

新規プラグインを入れたことによって画面が真っ白になった場合エラーメッセージに表示されたプラグインを削除または停止すれば画面が表示されるようになります。

但し管理画面は真っ白で操作できませんのでFTPかファイルマネージャーを使い削除または停止します。

ここでは「さくらのレンタルサーバー」のファイルマネジャーを使って作業を行っていきます。

上記(FTP、ファイルマネージャーでエラーの修正をする)のやり方で【wp-content】⇒【plugins】で右クリックします、ダイアログボックスが開いたら【フォルダを開く】をクリックしてエラーの原因になっているプラグインを選択して右クリックで【削除】を指定します。

これでエラーの原因になっているプラグインの削除はできました画面が表示されていれば作業は完了です。

プラグイン名がわからない方は【wp-content】⇒【plugins】で右クリックして【名前の変更】を選択して右クリックします、名前の入力画面が出ますのでpluginsに半角英数字記号で文字を付け足して名前を変えます。(ここではplugins-にしてみました)

pluginsの名前を変更

 

 

名前を変えてWordpress管理画面を確認すると表示できていると思いますので、左側メニューのプラグインを選択します。

「プラグインファイルが存在しません。」となっていますので、ファイルマネージャーまたはFTPで先程変更した【plugins-】を【名前の変更】を選択して元の【plugins】に変更します。

プラグインの無効化

 

 

名前を元の【plugins】に戻したらWordpress管理画面に戻ります、管理画面左側のメニューからプラグインを選択するとプラグインが全て停止した状態で表示されますので、1つずつ有効化していって確認していきますエラー原因のプラグインがわかったらファイルマネージャーか、FTPで原因のプラグインを削除します。

名前をpluginsに戻す

 

 

バックアップを定期的に取っておく

そもそもWordpressを始めたばかりの初心者には上記の作業がわからないという方もいるかと思いますが、定期的にバックアップを取っておけばこのようなエラーが出た場合にも簡単に元に戻すことが出来ます、但しバックアップを取った時点まで戻るためバックアップが古いとその後のデータは復旧されないのでバックアップは自分の更新頻度に合わせましょう。

バックアップのやり方はこちら⇒ BackWPup定期的にバックアップを取るプラグイン

 

 

最期に

WordPress画面が突然真っ白になると慌ててしまって何とか復旧しようと思い、間違った操作をしてしまいがちです。

先ずは落ち着いて上記で説明したエラーメッセージを表示させることから始めましょう、またエラーメッセージの表示ができてもやり方がわからないという方もいると思いますので、作業する前にはバックアップを取っておくといいでしょう、定期的にバックアップを取るプラグインもありますのでそちらを利用するのもいいかと思います。

 

]]>
https://noritacraving.com/wordpress-screen-white-out/feed 0
手間いらず!ウェブ上で画像を圧縮できる無料ツール3選の使い方 https://noritacraving.com/image-compression-tool https://noritacraving.com/image-compression-tool#respond Sun, 18 Feb 2018 08:31:21 +0000 https://noritacraving.com/?p=2306 サイトに画像を使うと文章でわかりにくいところもより分かりやすくなりますよね、でも画像を多く使うとサイトが重くなり表示速度が遅くなります。

そうならないためには画像の容量を減らすことが必要になってきます。

ここでは画像の容量をツールを使って減らす方法を解説しています。

画像の容量とは

コンピュータで扱われるデータは目には見えないのであまりピンと来ないですが、量を表す場合には【容量】と呼びます、多い少ないを【容量が大きい、小さい】などとと表現します。

容量を表現するには単位が有り最小の単位から bit(ビット)⇒B(バイト)⇒ KB(キロバイト)⇒MB(メガバイト)⇒ GB(ギガバイト)⇒ TB(テラバイト)となっていきます。

サイトに容量の大きい画像をそのまま使うとサーバーの読み込み速度が低下して表示速度が遅くなります。

そうならないように画像をアップロードする前に画像の容量を小さくしておきます。

画像の容量を圧縮して小さくするには【ロスレス圧縮】と【非可逆圧縮】があります。

【非可逆圧縮】は圧縮する前のデータとは完全には一致しない圧縮方法のことでデータの劣化、欠落などが有りますが圧縮率を調節することで見た目には元画像とはほとんど変わらずに圧縮することが出来ます。

【ロスレス圧縮】は可逆圧縮とも言いデータを全く損なわずに復元できるような圧縮方式のことでデータを再び元の状態に戻すことが出来ますが一般に非可逆圧縮と比べると圧縮率は悪くなります。

画像が最適化されているかどうか確認するにはPageSpeed Insightsにアクセスして分析したいページのURLを入力します。関連する記事⇒PageSpeed Insightsを使用して表示速度を高める

【最適化についての提案】に【画像を最適化する】が表示されていたら画像の容量を削減するよう指摘されています。

 

 

画像の容量を小さくするオンラインサービス

画像の容量を小さくするにはオンラインサービスを利用する方法が一番手っ取り早いかなと思います、インストールをすることもなくウェブ上で完結できるものがいいのではないでしょうか。

オンラインでおすすめの無料画像圧縮ツールをご紹介していきます。

 

 

TinyPNG

https://tinypng.com/

名前からしてPNG画像にしか使えなさそうですがJPG画像にも対応しています、操作方法は簡単で上にある【Drop your .png or .jpg files here!】と表示されている四角の窓をクリックするとダイアログボックスが開きますので画像の保存場所を指定して画像を選択したら【開く】をクリックします、または直接圧縮したい画像をドラッグ&ドロップします。

四角の枠をクリック

ドラッグ&ドロップ

 

 

画像の圧縮が完了すると左に圧縮前、右に圧縮後のサイズが表示されます、一番右側と下にはどの位圧縮されたかが%で表示されます。

ダウンロードするには枠の右側にある【download】をクリックします、Dropboxのアカウントがある方は【Save to Dropbox】の青いボタンをクリックすれば直接Dropboxにダウンロードできます。

ダウンロード

 

 

同時に20個の画像ファイルの圧縮が可能です、圧縮した画像をまとめてダウンロードする場合は下にある【Download all】のボタンをクリックします。

同時に20個の圧縮が可能

 

 

圧縮前と圧縮後の画像を比べてみると60.2KB⇒32.4KBの-46%圧縮しましたが、私が見た限りでは画像の劣化はないように感じます、これなら全く問題なしの範囲と思います。

(画像はJPG画像です)

圧縮前、圧縮後

【TinyPNG】で圧縮した画像の容量を更に小さくしたい場合はもう一度【TinyPNG】の四角い窓に、圧縮した画像をドラッグ&ドロップすれば再圧縮されます何度も繰り返せますが画像の劣化を確認しながら作業を行って下さい。

 

optimizilla

http://optimizilla.com/ja/

Optimizillaは。JPEG、PNG画像の画質を保ちつつファイルサイズを最適化してくれるツールです、ファイルは最大20個まとめて圧縮出来て、圧縮完了後はまとめとダウンロードが可能です、この辺は【TinyPNG】とほぼ同じですね。

圧縮のクオリティ設定も画像横のサイドバーで細かく調整することができます。

optimizillaの説明

 

 

画像の圧縮方法は下にある【アップロード】ボタンをクリックすると、ダイアログボックスが開きますので画像の保存場所を指定して画像を選択したら【開く】をクリックするか、直接ドラッグ&ドロップします。

画像のアップロード方法

 

 

画像の圧縮が完了しました、59KB⇒46KB(TinyPNGとファイルサイズが多少違います。)と22%の圧縮になっています劣化が殆ど無い状態ですので、【クオリティ】下のスクロールバーを下げてさらに圧縮します。

画像圧縮の調節

(画像はJPG画像です。)

 

 

スクロールバーを50まで下げると59KB⇒17KBと73%も圧縮できました、この状態で圧縮前と圧縮後を比べてみても殆ど劣化はないように思われますが、拡大して見ることもできるので一度確認してみましょう。

73%の圧縮

 

 

圧縮前、圧縮後の比較画像右下に【+-】ボタンがあります、【+】ボタンをクリックする度に画像が段階的に拡大していきます、下記画像は拡大率を最大に上げたものですが、ここまで拡大すると画像の劣化が解りますね、私はこのくらいの劣化なら気になりませんが気になる方はスクロールバーを上げてクオリティを高めに設定すればいいでしょう、但し画像の容量を小さくするのが目的なのであまり上げすぎないように注意しましょう。

圧縮前、圧縮後の画像拡大

 

 

Compressor.io

https://compressor.io/

【Compressor.io】はJPG・PNG・GIF・SVGの4つのファイル形式に対応しています。

可逆圧縮、非可逆圧縮の選択ができますが、画像の容量を小さくしてサイトの表示速度を早めるのが目的ですので非可逆圧縮を選択します。

まずはのサイトにアクセスして【TRY IT !】をクリックします。

Compressor.ioの説明

 

 

画面が変わりましたら上部にある【Lossy 】(非可逆圧縮)を選択して、【SELECT FILE】をクリックします、ダイアログボックスが開きますので圧縮したい画像の保存場所を指定して圧縮したい画像を選択したら【開く】をクリックします、または圧縮したい画像を直接ドラッグ&ドロップします。

画像ファイルを選ぶ

 

 

画像が圧縮されると圧縮前(ORIGINAL)と圧縮後(COMPRESSOR)の画像が表示されますので劣化があるかないかをその場で見比べることが出来ます。

画像は60.18KB⇒36.08KBと40%の圧縮が出来ました。

画面にある縦ラインの左が圧縮前の画像で右が圧縮後の画像で比較ができます、なお縦ラインはマウスを使って左右に移動することが出来ます

圧縮した画像をダウンロードするには【DOWNLOAD YOUR FILE】クリックするとPCにダウンロードできます。

Google DriveDropboxのアカウントがある方はGoogle Driveは【SAVE TO DRIVE】をクリック、Dropboxは【SAVE TO DROPBOX】をクリックすれば画像が保存できます。

圧縮前、圧縮後

【Compressor.io】は一度圧縮した画像を更に圧縮しても容量を減らせませんがPageSpeed Insightsで【画像を最適化する】を指摘されないくらい圧縮してくれます。

 

 

最期に

容量を小さくしてサイトにアップロードした画像で記事作成したページをPageSpeed Insightsで分析してみると【画像を最適化する】で容量を小さくした画像は指摘されなくなると思います。

サイトに画像を多用する方は画像の容量を小さくしないと表示速度に影響してきますので、画像をアップロードする前に画像圧縮ツールで容量を小さくしてアップロードするようにしましょう。

画像圧縮ツールはいろいろありますが、今回紹介したツールはウェブ上で完結できるツールですのでPCにインストールする手間もないですし、3つとも同じような機能を備えていますので使ってみて自分に合ったツールを選んでみると良いでしょう。

]]>
https://noritacraving.com/image-compression-tool/feed 0