WordPressデザイン変更前にFTPソフトで簡単バックアップ

WordPressのデザインを変更するには、外観＞テーマ編集のページで

PHPとかCSSなどの記述を変更しなければなりません。

 

HTMLやCSSについて詳しくない初心者にはハードルが高いところです。

 

CSSは記述が少し違うだけで、全く何も変わらなかったり

サイトが真っ白になってしまうこともあります。

 

こうなると当然パニックに陥り、自分でも顔が青ざめていくのがわかります。

「また1からかぁ．．．」

 

こうならないためにBackWPupというプラグインで定期的に

WordPressをまるごとバックアップする方法を紹介しました。

 

ただ、BackWPupは自動でバックアップをしてくれますが

万が一の時、復元するのは簡単ではありません。

 

復元作業にまる1日を費やすことも珍しくないようです。

 

そこで今回はFTPソフトを使って

バックアップと復元を簡単にできる方法を紹介します。

 

FTPソフトの場合、自動でバックアップしてくれないので

PHPやCSSをさわる時など、普段の記事投稿以外のことを

する前にやっておくことをおススメします。

 

 

FTPソフトをインストール

 

FTPとは、File Transfer Protocol（ファイル転送規約・手順）の略で

FTPソフトとはコンピュータ間でデータを転送するためのソフトです。

 

WordPressのデータはサーバーに置かれています。

そのデータを自分のパソコンに移したり、コピーすることができます。

 

逆に自分のパソコンのデータをWordPressのあるサーバーに

移したり、コピーすることができます。

 

FTPソフトで最もメジャーなのが「FFFTP」というソフトですが

ここでは「Filezilla」というソフトでバックアップする手順をご紹介します。

 

Filezillaは大きなサイズのファイル転送が可能で

おすすめの無料ソフトです。

 

Filezillaをインストールします。

 

まずはFileZillaの日本語情報サイトでダウンロードします。

FileZillaの日本語情報サイト

 

Windowsの場合

FileZilla_3.9.0.3_win32-setup.exeと書かれたところを

クリックして、ダウンロードします。

 

 

ダウンロードできたらファイルをクリックします。

 

 

あとはインストーラーにしたがって、インストールしてください。

 

 

①「I Agree」

②誰でも利用可能にするか、自分だけ利用可能にするか選択します。

Anyone who uses this computer(all users)→誰でも

Only or me→自分だけ

③デスクトップにショートカットが必要な場合「Desktop Icon」にもチェック

④保存先を指定

⑤特に何もせず「Install」をクリック

⑥「Finish」をクリックするとソフトが立ち上がります。

⑦「Filezillaにようこそ」というウィンドウが開きますので「OK」をクリック

 

 

Filezillaをサーバーに接続する

 

Filezillaをインストールできたら、次はFilezillaをサーバーにつなげます。

画面左上のアイコンをクリックしてください。

 

 

 

「サイトマネージャー」ウィンドウが開きます。

 

 

ここにサーバーアカウント情報を入力します。

サーバーアカウント情報は、使っているサーバー業者で確認します。

 

エックスサーバーの場合は申し込みをした時に送られてきた

「Xserver サーバアカウント設定完了のお知らせ」

という件名のメールに記載されています。

 

 

「自分のサイト」を選択し「新しいサイト」をクリックしたら

任意の名前（サーバーの名前）を入力します。

 

右側の一般のところにホスト名など必要な情報を入力して

「接続」をクリックします。

 

 

うまく接続できれば下図のようにサーバー内のフォルダやファイルが表示されます。

パソコン内ははじめから表示されています。

 

 

 

 

デザインを変更する前にバックアップする

接続できたら、PHPやCSSを変更する前に

必要な個所をバックアップしましょう。

 

例えば、賢威で「見出し」のデザインを変えたいなと思った場合

賢威6.2はWordPress管理画面＞外観＞design.css

を変更します。

 

この場合は、Filezilla画面右側（サーバー）の中から『design.css』

のファイルを探して、Filezilla画面左側（パソコン）にコピーします。

 

 

 

賢威の『design.css』がどこにあるかというと

自分のサイトのドメイン名フォルダ

→public_html→wp-content→themes

→keni〇〇〇というフォルダの中にあります。

 

 

 

keni〇〇〇フォルダの中に、CSS、PHPなどのファイルがあります。

 

 

 

 

ドラッグ&ドロップでコピーしたファイルには

いつバックアップしたファイルかわかるように

必ずファイル名に日付を入れておきます。↓こんな感じです。

 

 

見出しのデザインを変更していると

記述を間違ったらしくデザインがおかしくなりました。

 

そうなったらパソコンに保存した変更前の『design.css』を

サーバーに戻します。

 

その際に日付を抜くことを忘れないでください！

 

Filezilla画面左側（パソコン）から『design.css』を

Filezilla画面右側（サーバー）にコピーします。

 

 

 

上書きしてもいいか確認する画面が出てきますので

「OK」ボタンを押してください。

 

 

これで変更前に戻ります。

 

これまで一生懸命つくってきたサイトが無事でよかったです。

 

 

ちなみにプラグインやテーマ（賢威など）は、『wp-content』フォルダに

入っていますので、これも時々コピーをとっておきましょう。

 

＜フォルダの場所はここです＞

自分のサイトのドメイン名フォルダ

→public_html→wp-content