先日WordPress4.9にアップデートしたところ、多くの改善事項があったようでした。いつもよく使っている機能の中でも改善が行われてカスタマイズやウィジェットのテキストの機能がよくなっていました。またCodeMirrorというコード編集ライブラリが追加されて、ダッシュボードでの編集が行いやすくなりました。
それらの使い方について書きます。
カスタマイザー：下書き、予約投稿、プレビューリンクの共有ができるようになった
テーマのカスタマイズをするときに使う、カスタマイザーの機能が良くなりました。
カスタマイザーというのは
ダッシュボード 外観＞カスタマイズ をクリックして表示して使う、カスタマイズのことを言います。
カスタマイザーでの下書きが保存できるようになった
今までは、たとえば色を変更した後での保存は
保存して公開しかありませんでした。これがWordPress4.9からは変更を行うと
このように 公開（今までの保存して公開と同じ）の右に、歯車ボタンが表示されるようになり、クリックすると
公開の他に、下書きとして保存、予約公開が選べるようになりました。
下書きとして保存にチェックを入れると、ボタンも下書きとして保存になるのでクリックして保存します。
この状態ではカスタマイザーでは変更された色で表示されますが、表画面では
このようにまだカスタマイズして下書きとして保存した色には変わっていません。あとでこの色で良いということであれば、公開もしくは予約公開をすれば表画面に反映することができます。
この下書きを取り消したいときは、
カスタマイザーの歯車ボタンをクリックして、変更を破棄をクリックし、
本当に未公開の変更を破棄しますか？の画面ではいをクリックすれば
このように破棄されて、元の状態に戻ります。
カスタマイザーの更新を予約公開できるようになった
今まではカスタマーからの公開は今すぐ公開しか行えませんでしたが、公開する日時を指定して公開することができるようになりました。
下書きを保存のときと同じようにカスタマイザーの歯車をクリックして
予約公開をクリックします。そうすると日時を指定する欄が表示されるので
日付と時刻を指定して、予約公開ボタンをクリックします。
指定した日時になるまでは
何も変わりませんが、指定した日時になると
カスタマイザーで変更した内容に表示が変わりました。
編集権限のない人にも見てもらうことのできるプレビューリンクの共有
下書きを保存と予約公開状態の時は編集権限のある人しかその内容を見ることはできませんでしたが、今回新しくプレビューリンクの共有という機能が追加されて、編集権限のない人も公開前の内容を見ることができるようになりました。
カスタマイザーの歯車をクリックした画面に
プレビューリンクの共有という項目があります。このコピーというボタンをクリックすると、プレビューリンクのURLがコピーできますので、このURLを編集権限のない人に教えてあげます。
すると、ログインしていなくてもそのURLで見てみると
このように、まだ公開されていないカスタマイズの状態を見ることができます。トップページだけでなく
すべてのページがカスタマイズされた状態で見ることができるので確認するときにとても便利になりました。
テキストウィジェットにメディアを追加が追加されました
WordPress4.8からテキストウィジェットでビジュアルエディターが使えるようになりました。
こんな感じです。日頃からビジュアルエディターを使っている人には朗報だったのですが、「メディアを追加がない…」という点が残念だなと思っていました。
それが、今回のWordPress4.9でメディアを追加が使えるようになりました。
このような感じです。早速使ってみました。
このようにメディアを追加から画像を選択して、ウィジェットに追加できました。
表画面で見てみると、
あれれ？って感じで横幅だけが縮んで縦の長さが元画像のままで表示されてしまいました。通常の投稿などの場合は縮んだ分だけ縦も縮んでくれるので油断してしまいました。
貼り付けたウィジェットの幅が300pxだったので貼り付けるときに
サイズから適切なサイズを選んで貼り付けてみたところ、
適切なサイズで表示されました(^^)/
CodeMirrorが追加されて、テーマの編集からの編集が使いやすくなりました
CodeMirrorという編集ライブラリが追加されました。これは何に効果を発揮するかというと、ダッシュボードから編集するときに行番号を表示してくれたり、シンタックスハイライトをしてくれるようになったり、エラーを表示してくれるようになります。
具体的に見てみると、まずはダッシュボードで、外観＞テーマの編集 をクリックする、のですが
このように警告表示が出るようになりました。自分の場合は子テーマを使っていることと、バックアップはすべて自動で保存してあるので心配はありませんがそうでない場合は注意してくださいということを言っていると思います。
理解しましたをクリックして進みます。
このように
・行番号が表示されている
・コメントは茶色、色コードなどは青色のように意味によって文字の色が異なるように表示されている
ということがすぐにわかると思います。IDE（統合開発環境）や高機能なエディタを使っている方は見慣れているこの色分けは以前の
黒一色で行番号が表示されていない状態と比べるととても見やすくなったと思います。
また、
このようにcssの文法的に間違った記述をしたときには行の頭に×を表示して、さらに間違った箇所に赤い波線を表示してくれるのでエラーがわかりやすく、すぐに直せるようになりました（phpではエラーは表示されないようでした）。
行番号が表示されるようになったこととシンタックスハイライトが表示されるようになったのはカスタマイズするときにとても便利で助かります(^^)/
コメント