5分で検証!WordPress5.0へのアップデート方法について学ぼう! ~新エディターのおさらいとレンタルサーバーのステージング機能のご紹介~【イベントレポート】

2018年12月6日「WordPress5.0」がリリースされました。いくつかのバージョンアップの中でも特に、15年に渡り親しまれたエディタの変更は、既存サイトへの影響範囲が大きいと予想され、反響を呼びました。

そのアップデートを、さくらのレンタルサーバで利用できる「バックアップ&ステージング(powered by Snapup)」機能を利用して悩みを解決するイベント「5分で検証!WordPress5.0へのアップデート方法について学ぼう! ~新エディターのおさらいとレンタルサーバーのステージング機能のご紹介~」が2019年2月19日(火)さくらインターネット大阪本社にて開催されました。

当初イベントの参加募集枠は50名を予定していたのですが、実際に募集を開始すると100名を上回る方々から応募があり、途中募集枠を80名にまで拡大しました。このことからもいかに今回のWordPressのアップデートが注目されているのかがわかります。

本記事では、イベントの様子を当日の流れに沿ってレポートいたしますのでぜひ最後までご覧ください!

イベントサマリー

【第一部】WordPressの新しいエディターってどんなもの?/村上直子 様(オフィスフィボナッチ)

WordPress5.0から変わったエディター。今までとは大きく変わったこのエディターについて解説。これから使ってみようと考えている方、既に使っているけれどもう少し詳しく知りたいという方に向けた内容です。

【第二部】WordPressまるごとギュッとしてバックアップも引っ越しも簡単確実に。/永田司 様(株式会社ユニマル)

様々なバックアップ対象があるなか、「Snapup」ではそれらを意識することなくその時点のその状態をスナップショットのように保存します。この確実なバックアップとリストア、引っ越しの実現についてデモを交えながらご説明します。

【第三部】真っ白画面も怖くない!ステージング環境を賢く使ってWordPressサイト運用を効率化!/谷口元紀(さくらインターネット株式会社)

すでに稼働しているWordPressサイトのPHPファイルを編集する時に、手間となるのがテスト環境の用意かと思われます。一般的には、別ドメインを作ったり、ローカル環境を作りますが、本番と仕様が異なったり、ミスをすることによって、公開されているサイトが真っ白になったりしてしまうことも少なくありません。しかし、「さくらのレンタルサーバ」では無料で使えるステージング環境があります!このセッションではWordPressバージョンアップやPHPバージョンアップ、SSL化の検証などにお役立ちのステージング環境使用方法をご紹介します。

WordPressの新しいエディターってどんなもの?

セッション第一部は、山口県在住のフリーランスである村上直子さんにご登壇いただき、WordPress5.0から導入された新エディターについてお話いただきました。

新エディター「ブロックエディター」とは?

村上氏(以下、村上):以前まで使われ、慣れ親しまれた旧エディターは「クラシックエディター」、WordPress5.0から新しくなったエディターを「ブロックエディター」と呼びます。ブロックとはその名の通り「レゴブロック」と同じ意味合いで、「固まり」という意味です。

ブロックエディターでは、真っ白な画面にブロックを積み重ねていくようなイメージで記事を作成することからこのような名前になったそうです。WordPressの画面で確認できるブロックには、画像、見出し、段落、ボタン、サイズや位置などがあります。それぞれ利用目的が異なり、ブロックごとに細かい設定をすることができます。

しかし、クラシックエディターで記事をずっと書いてきた人にとっては気をつけなければならないポイントがあります。それは、クラシックエディターでは「文章全体でひとつの塊」というイメージでしたが、ブロックエディターでは「段落それぞれが段落ブロックでひとつの塊」で分けられるという点です。

つまり、今まではひとつの段落内での改行はシフト+エンターで行ってきたものを、ブロックエディターではブロックで分けて作成することで段落を分けることができるようになったということです。

ブロックエディターの画面構成

村上:ブロックエディター画面では、「①タイトル、本文」「②詳細設定」「③ツールバー」と大きく3つのエリアに分けられ、下記のような役割を持っています。

① タイトル、本文は、見出しや段落、ボタンや画像などを文字通り”ブロック”として扱い、ページに追加していきます。
② 詳細設定は、それぞれのブロックに対して位置やサイズを指定していきます。
③ ツールバーは、ブロック追加ボタンやプレビュー、公開ボタンが配置されています。

村上:記事を書く際には、ツールバーの左側や本文に表示されている「+(ブロック追加ボタン)」を押して、挿入したいブロックを選びながらページを作成していきます。

ブロックエディターの良い点と微妙な点

村上:まず、ブロックエディターの良い点として下記4点が挙げられます。

  • 編集画面と実際の投稿画面がほぼ同じ
  • シンプルで余計なものを見せていない
  • エリアを縦分割出来る「カラム」ブロック
  • 横幅いっぱいに広げられ文字も重ねられる

ブロガーさんやWeb担当の方にとっては執筆しやすく、さらに一生懸命HTMLを書いていた人にとっては楽に実装出来るようになりました。一方で、私が微妙だなと感じる点は下記2点です。

  • 新しい機能に慣れるまである程度の学習が必要
  • まだ、一部で動作が不安定なところがある

ただ、ブロックエディターは直感的に操作が出来るので、慣れれば執筆がどんどん出来る事や、動作の安定性も使えるレベルにはなっていますので、気になる方は使ってみるとよいと思います。

また、「Classic Editor」というプラグインを利用すると、WordPress5.0でもクラシックエディターを利用することが出来ます。

最後になりますが、セキュリティ上、WordPressは最新版のものをお使いください。もし5.0にアップデートしてサイトが崩れてしまったらどうするの?と不安に感じている方は、この後のセッションで紹介がある「さくらのバックアップ&ステージング」機能をご参考くださいね! みなさんもぜひ、ブロックエディターをまずは使ってみてください!

WordPressまるごとギュッとしてバックアップも引っ越しも簡単確実に。

セッション第二部では株式会社ユニマルでCSOを務める永田司さんが登壇し、WordPressでのバックアップを手軽に行える「バックアップ&ステージング」機能についてお話されました。

既存のバックアップ方法とSnapupを使ったバックアップ方法

※登壇者コメント・資料等には「Snapup」と記載されておりますが、実際は「バックアップ&ステージング」機能となります。

永田氏(以下、永田):WordPressはどんどん進化していって、機能も充実していって便利なサービスなのですが、Web自体が公開してから改善の連続であったり、ローカル環境とあわせるのどうするのかとか、CMSについてくる問題としてデータベースがやっかいですよね。

実際に手作業で新サイトへの引っ越しを想定します。まずはファイルのダウンロードでWordPressのコアファイルやテーマファイル、アップロードファイルなどなどですね。続いてPHPMyAdminなどを使ってデータベースの内容をダンプします。そしてwp-config.phpを書き換えたりします。ここからがやっと新サーバーで、引っ越したい新サーバーに向けてファイルの設置を行います。そしてDBのインポートをします。ここまででも大変なのですが、もっと大変なのがドメインが変わった場合ですよね。DBの中にドメインの情報を持っていたりします。ドメインが変わると、記事のURLだったりを元ドメインから新ドメインに文字置換をしないといけません。場合によってはその文字列にランダムでハッシュ値というものが定められているので、それも更新する必要があります。

この複雑で長い作業は、ツールを使って行うという手もあります。もし一番めんどくさい方法をとるのであれば、SQLを実際に書いて、文字置換をするという作業があります。今これだけ手順がありますが、ミスをすると白い画面になってしまいます。場合によってはエラー画面になることもあります。皆さんも経験されたことはあるのではないでしょうか。
ではSnapupではどうなのかというと、手順はざっとこんな感じです。

永田:スッキリですね。ドメインが変わる場合はどうするのか。例えばテストサーバーのほうでまだドメインをとっていなくて、[test-unimaru.jp] から [unimaru.jp] にした場合はドメインが変わってしまう。通常では文字置換とハッシュ値の更新をしなければならないが、「Snapup」の場合は、手順的にはほぼ変わらずに移動することができるんです!

永田:すべてSnapupでしたほうが良いと言っているわけではなく、プラグインやCLIでできるツールも多々出ておりますので、みなさん合うものを使っていただければと思うんですけれども。実際レビューなどを見ているとテキスト置換やファイル転送でこけることも少なくないというレビューもありました。実際に弊社が運営しているメディアがあるんですけれども、こちらが2Gくらい画像ファイルがあるんですね。これをプラグインだけで移動しようとすると、タイムアウトしてしまいました。なぜこのような現象になるかというと、サーバーのほうも、何秒間通信を許すや、どのぐらいのファイルを転送してOKとか必ず縛りが発生することが原因です。たとえばプラグインで動くということはPHPで動いていると思うんですけれども、PHPの縛りでこれ以上の転送は許さないよとか、何分以上繋がってるのは許さないよという制限からうまくいかないことがあるそうです。その点Snapupは、SSHという接続方法をとっているので、こけることは少ないんです。

Snapupなら手間だった作業を簡潔にして楽々バックアップ!

まとめになりますが、WordPressをアップデートする前などにはバックアップをとった上で作業を行うのが一般的です。そして、そのバックアップ作業の手間を解決してくれるのが「Snapup」です。どれくらい簡単になるのかというと、手作業で行った場合とSnapupを使った場合の工程で見てみますと、

■手作業でやった場合

  1. ファイルのダウンロード(WordPressのコアファイル、テーマファイル、アップロードファイルなど)
  2. phpMyAdmin等を遣ってデータベースの内容をダンプ
  3. wp-config.phpの書き換え
  4. 新サーバーにてファイルの設置
  5. DBのインポート
  6. ドメインが変わるのであれば、DB内の元ドメインから新ドメインへ文字置換、ハッシュ値の更新

■Snapupでやった場合

  1. Snapupに旧サーバー情報を登録します。
  2. Snapupでギュッとします(≒バックアップ データベースの情報やWordPress時代のファイルなどを、Snapupではひとつの情報でまとめます。)
  3. Snapupに新サーバー情報を登録します⇒旧サーバー新サーバーの情報と呼ばれているものは基本的にはSSHの情報になります。

となり、工程数だけを見ても一目瞭然です。もし近いうちにWordPressのバックアップを考えているのでしたら、永田さんがおすすめするSnapupをぜひ一度利用してみてはいかがでしょうか!

真っ白画面も怖くない!ステージング環境を賢く使ってWordPressサイト運用を効率化


第三部では「サーバーの引っ越し業務、実は結構好きです(笑)」と語る谷口さん。ドメインががっちり切り替わったときの快感が良いんですけれども誰にも共感してもらえないんですよね、と会場の笑いを誘いました。

WordPressの開発環境について

谷口氏(以下、谷口):動的CMSということやPHPファイルの色々なところをいじれたりするのがWordPressの良いところですが、しかしその半面、変なところに書きこんでしまうと、いきなりサイトが真っ白になってしまうなどのトラブルもあるのがWordPressの怖いところです。

なので、デザイン確認以外だとしても「PHPを編集/追加したときの動作確認」や、「プラグインの動作確認」「テーマの動作確認」「PHPバージョンアップの動作確認」など様々な場面で確認環境が必要になってくるのは言うまでもありません。ではどういう環境であれば確認できるのか?ということを考えたときに、ローカルとリモートでそれぞれ方法が異なります。そして、ローカルもリモートもメリットやデメリットが存在し、一長一短であるのが現実です。


■ローカルの場合
ローカルの開発環境としては、例えば以下のものがあります。

メリットやデメリットとしては以下の点が挙げられます。

[メリット]
・手元なので編集が手軽

[デメリット]
・環境が本番環境(レンタルサーバー)と違う
・外部からの確認が困難なのは致命的

■リモートの場合
一方、リモートの開発環境の例としては以下があります。

  • 自分が本番環境を運用しているレンタルサーバーでサブドメインを作って認証をかける
  • 別ディレクトリに作って認証かける

こちらのメリットやデメリットは以下の通りです。

[メリット]
・本番環境と同じレンタルサーバーを使っている

[デメリット]
・ファイルをFTPなどでアップロードしないといけないので同期が面倒
・公開環境なのでセキュリティなどの管理が大変

PHPのバージョンで考えると、例えばローカルの環境では5.6だけど、サーバー上は7しか選べない場合や、中に入っている拡張モジュールの違いがあったり、Webサーバーがそもそも違うことがあったり、レンタルサーバーごとに独自の仕様があったりするので、.htaccessの違いで動かなくなってしまうことなどがあります。

同じサーバー以外で開発環境を作ると環境差異が発生するので、それをどう吸収するのかが問題になりますが、半面、同じリモートの環境に入れてしまえば同期の手間が省けます。同期の手間だけはGit利用などで省くことはできますが、環境差異だけはどうしようもない場合があり、開発環境で動いていても、本番サーバーで動かないという事態になることもあります。

環境差異の悩みも解決する「バックアップ&ステージング」のステージングサーバ機能!

「そんなときに使っていただきたいのがSnapupのステージングサーバ機能です!」と語る谷口さん。Snapupのステージンサーバの特徴と概要についてお話されます。

Snapupステージングサーバ機能のメリット

  • レンタルサーバーと環境が概ね同じ
  • スナップショットが容易で、基本的にクリック操作で本番環境のスナップショットがすぐ撮れる
  • 世代管理ができる。8世代分をバックアップできるので、修正前のスナップショットをリリースすれば更新する前に戻せる
  • インストールやセットアップが容易で、Snapupのステージング環境を押すとWordPressが入っている状態でサーバーができあがる。スナップショットをリリースすると、すぐに同じサイトが表示されるようになる
  • 自動的に認証がかかった状態で公開できるのでクライアント等外部の方に確認してもらうことなども容易に

Snapupステージングサーバ機能の概要

  • 1アカウントにつき1つ作成可能
  • PHP5.37.2
  • MySQL5.5~5.7
  • SSL対応
  • 初期設定でDigest認証がON

谷口:Snapupサーバー、本番サーバー、ステージングサーバー、があります。本番サーバーはさくらのレンサバです。このSnapupのサーバーのほうに本番サーバーからデータを転送する。転送したものが溜まっていく。その中から好きなスナップショットを1個選んでステージングサーバーに公開という形でコピーできます。そうしたときに本番サーバーのURLとは違うURLにであるステージングサーバーに、サイトの内容が全く同じだけれど、URLだけが違うものがコピーされるというイメージです。

さくらのレンサバのバックアップ&ステージング機能ってサーバーを2つ登録できるんです。なので、例えば別のレンタルサーバーのSSHのアカウントを登録していただくと、そこからSnapupのサーバーにバックアップを取ることができます。そのバックアップを本番に戻してあげれば簡単に戻してあげることができます。では、ここからは実際に画面のデモをご覧ください。

「Snapup」を選択

ご利用のホスト名を選択

「スナップショットを追加、作成する」を選択

「本番サーバ-から取得」を選択

バックアップステージングを押す

「追加」ボタンを押す

「ステージングサーバーへセット」を押す

「OK」を押す

これでステージングの公開ができます。ステージングで編集したデータは再度スナップショットをステージングから取得し、本番へリリースボタンを押すと、本番サーバーへ書き戻されます。

さらに詳しい手順については、以前さくらのナレッジにて谷口さんご本人に執筆していただいた記事がありますので、ぜひこちらの記事をご覧ください!

さくらのレンタルサーバ バックアップ&ステージング機能完全攻略

どのような場面で使えるか?

谷口:運用しているサイトを上位のPHPバージョンで動かしたいとします。今PHP5.6でサイトをやっていたらPHP7.2でステージングサーバを作っていただいて、データをセットしてあげれば自分のサイトが7.2でどのように動くかというのを確認できるので、本番環境に影響なくサイトの確認をすることができます。ただ、ステージングを移動したままバージョン変更はできないので、バージョンを変更するには一度削除して再作成する必要があるのでお気をつけください。

SSL化作業も同様に、httpでステージングを作成していただいて、スナップショットをセットした状態でSSL化の作業をしたら動作確認をすることができます。ブラウザはSSL/非SSLをキャッシュするので、確認は別ブラウザを推奨いたします。またサブサイトでは、他社レンサバも登録可能なのでお引越し作業にも使えます。また、ステージングサーバ機能だけじゃないのがSnapupで、バックアップの設定もすることができます。設定できる項目は「毎週or毎日で設定可能」「毎週バックアップの場合は曜日指定可能」「時間帯(5時間幅)を指定可能」で、もちろん今説明したオプションはすべて無料です!

最後に、さくらインターネットからのお願いです。WordPressコア・プラグイン・テーマ、PHPバージョンは常に最新版を使うようにしていただければと思います。また安易にコアの自動アップデートを停止しないようお願いいたします!

まとめ-WordPress5.0のアップデートに迷ったら

いかがでしたでしょうか。一層使い勝手がよくなり便利になったWordPress5.0の概要やメリット、そしてアップデートの際に注意するべきことについてご紹介いたしました。

慣れ親しんだエディターについてはプラグインで対応可能ですし、セキュリティの関係上、バックアップの環境が用意できているのであれば、アップデートを済ませてしまうのも良いかと思われます。

もしバックアップ等で困ったことがあればお気軽にお問い合せをいただくか、弊社レンタルサーバで便利なSnapup機能を利用してみてはいかがでしょうか?

■さくらのレンタルサーバ

WordPressのアップデート、バックアップする方法を考えるなら、さくらのレンタルサーバに標準搭載されている「バックアップ&ステージング」機能がオススメ! マウス操作で簡単バックアップ! 月額515円/100GBから!

>WordPressのアップデートも簡単にできるさくらのレンタルサーバ利用はこちら