Welcome to airkyon.com , enjoy your stay!

WordPress5.0の新エディタ「Gutenberg」がダメすぎる

2018年12月09日 - Posted by reibo - Inside [Blog] Word Press   このエントリをはてなブックマークに追加このエントリをYahoo!ブックマークに追加
09 12月.

数日ぶりにサイトの管理ページにログインしてみると、「WordPressの最新バージョン(5.0)があるから更新しろ!」というメッセージが。
そうですかそうですか、はいはいわかりました。12月7日にリリースされたらしいです。
で、更新してみると、投稿(編集)画面がまったく別物に。こいつが、恐ろしいほど使いづらい!
調べてみると、ニューバージョン「5.0」の目玉が、この新たな投稿用エディター:Gutenbergらしい。

Gutenberg は単なるエディターではありません。現在はエディターに注力していますが、このプロジェクトはパブリッシング体験全体に影響を与えるものです。今後はカスタマイズに注力していく予定です。
WordPress が他のシステムと異なる点は、思い描いたとおりのリッチな投稿レイアウトが作成可能な点です。ただし、HTML や CSS の知識があり、カスタムテーマを作成できる場合に限ります。エディターを、リッチな投稿と美しいレイアウト作成ツールとして考えるなら、他の人も使っているから WordPress を使うのではなく、ユーザーが好きで WordPress を使うことになるでしょう。
Gutenberg はエディターを単なる入力欄と考えるのではなく、10年ほぼ大きな変更がなかったレイアウトを見直します。これによって、今どきの編集体験を全体的にデザインし、未来への基礎を築きます。
単なる入力欄ではなく、編集画面全体を考慮している理由は以下のとおりです:

ブロック
ブロックは複数のインターフェイスを統一します。既存のインターフェイスの上にブロックを追加すれば複雑さを取り除くどころか、逆に増やすことになります。
インターフェイスを見直し、使いやすさとシンプルさにこだわり、新旧双方のユーザーに利益をもたらすことにより、執筆、編集、公開の体験を現代的にします。
単一ブロックインターフェイスが中心になれば、開発者にはショートコードやウィジェットよりも優れた素晴らしいブロックを開発する明確なパスが提示されます。
インターフェイス全体を考慮することは、次に注力する領域 (サイト全体のカスタマイズ) への確固たる基礎につながります。
全体の編集画面を考慮することは、ベースから大幅に現代化し、WordPress REST API をフル活用した、より流動的で JavaScript に富んだ未来への一歩を踏み出すことができます。
ブロックは、今まで異なる方法でカバーされていた「ショートコード」「埋め込み」「ウィジェット」「投稿フォーマット」「カスタム投稿タイプ」「テーマオプション」「メタボックス」その他のフォーマット要素などを統一的に進化させたものです。 ユーザーは、WordPress でできる幅広い機能を、明快で一貫した方法で利用できます。
例えば「従業員」というカスタムブロックを想像してください。アバウトページにドラッグすると、自動的に写真、氏名、プロフィールを表示できるとします。この世のすべてのプラグインが、同じ方法で WordPress を拡張することができ、メニューやウィジェットもシンプルになります。ユーザーは簡単に WordPress と大方のプラグインを理解して使用することができます。これによって簡単にサンプルのような美しい投稿を作成できます。

互換性
投稿には後方互換性があります。ショートコードもそのまま動くはずです。高度にカスタマイズされたメタボックスについては継続して調査中で、単純に Gutenberg を無効化するプラグインから、Gutenberg のロードの可否を自動で検出するソリューションまで幅広く検討しています。執筆から公開に至る新しい編集体験を確実にユーザーフレンドリーなものにしたいと考えている一方、高度にカスタマイズされた既存サイトに対しても、良いソリューションを見つけることをお約束します。

GUTENBERG のステージ
Gutenberg では3つのステージが計画されています。WordPress 5.0 への同梱を予定している最初のステージの目標は投稿の編集体験とブロックの実装で、このフェーズではコンテンツ第一主義を唱えています。ブロックを使用することで、既に述べたようにユーザーはコンテンツがどのように表示されるかに集中でき、その他の構成オプションを気にする必要はありません。結果的に、すべてのユーザーがコンテンツを魅力的に、直接、ビジュアルに伝えられるようになるでしょう。
これら基本的な要素が来年に予定されている2番目、3番目のステージへの道を開き、最終的にはページテンプレート内での投稿を超えた、完全なサイトカスタマイズへとつながります。
Gutenberg は大きな変化です。ショートコードやメタボックスなど既存の機能が引き続き動作することを確認できるよう、開発者には効率的な移行に必要な時間と経路が与えられています。最終的にプラグインやテーマ開発者は、コアのサポートするツール群の利点を活かした魅力的で、ビジュアルな体験をこれまで以上にユーザーに届けることができるでしょう。

いや、わからん。てか、知らんわ!
10年も変わらなかったということは、それだけ完成度が高かったことに他ならないわけで。「より流動的で JavaScript に富んだ未来への一歩を踏み出す」って何? あり得ないんですけれど…。
ちなみに、WordPressの新しい Gutenberg 編集エクスペリエンスページでは、以下のように。

私たちは新しいエディターを Gutenberg と呼んでいます。メディア重視のページや投稿向けに、すべてのコンテンツ編集エクスペリエンスを再構築しました。初めてサイトを構築している方も、仕事としてコードを書いている方も、ブロックがもたらす柔軟性を体験してみてください。
ブロックは、人を引き付けるコンテンツを構築するためのすばらしい新ツールです。ブロックを使うと、わずかな技術知識だけでマルチメディアコンテンツの挿入、並べ替え、スタイル設定ができます。カスタムコードを使う代わりに、ブロックを追加してコンテンツ作成に集中できます。
単体のブロックは信頼度が高く、明確かつ明瞭です。自分の考えに合わせて、メディアとコンテンツを並行して使うための柔軟性もあります。
Gutenberg は単なるエディターではありません。WordPress のカスタマイズとサイト構築に革命を起こす基礎でもあります。

Gutenberg は現在プラグインとして利用できます。近い将来に、WordPress バージョン5.0ではデフォルトになります。必要な場合は、旧エディターもプラグインとして利用できます。

はい、バージョン5.0ではその通り、デフォルトになってしまいました。
何でしょ、これは。WordPress利用のキモでもあるエディターを、ここまで改悪しますか? 「単なるエディターではありません」じゃなく、「単なるエディター」としての完成度が重要なんですよ。
エディタに付随したプラグインも軒並み死亡で、対応できていないらしい。これでは、使い物にならん。
なわけで検索してみると、出るわ出るわ。「使いにくい!」「使えねー!」「やめてくれ!」など阿鼻叫喚の地獄絵図(苦笑)。

で、「必要な場合は、旧エディターもプラグインとして利用できます」とあるプラグイン:Classic Editorを導入。
めでたく従来のエディタ画面に戻ったわけですが、旧エディタが利用可能なのは2021年まで。期間限定らしい。エ、何それ?
ちなみに、Gutenbergを無効化するDisable Gutenbergというプラグインもあるようです。こちらも期間限定なのかどうかは不明。

というか、わざわざプラグインで基本機能を変更しなければ使い物にならないソフトウェアって、何?
WordPress様って、そこまでして「使わせていただく」もの?
2021年までにGutenbergがどう改良されていくかは不明ですが、このままだと「WordPressをやめる」という選択肢が現実味を帯びてくるかも…。

  Check  拍手する

WordPressにスマホ表示用プラグイン:WPtouchを導入

2018年9月12日 - Posted by reibo - Inside [Blog] Word Press   このエントリをはてなブックマークに追加このエントリをYahoo!ブックマークに追加
12 9月.

実はこのサイト、スマホでの表示に関しては放置状態でした。そのままでも、見ようと思えば見られたわけで。
そもそもBlog自体、ここ数年は放置プレイでしたからね…。
でも、さすがにそれはマズイだろうと、WordPressのスマホ表示用プラグイン:WPtouchを導入しました。スマホ対応としては定番すぎる方法ですが、面倒なのは嫌なので(苦笑)。
今さらスマホ用のCSSを「あーでもない、こーでもない」といじるぐらいなら、PCとスマホ両対応のテーマに変更しちゃったほうが楽ですし。とはいえ、新たなテーマを探して導入し、いろいろ設定していくのも面倒。じゃぁどうする? とりあえず、WPtouchでいっか。そんな葛藤を、約5分間ほどした結果です(苦笑)。

公式ページには「このプラグインはまだ日本語に対応していません」と記されていますが、実際には日本語に対応しています。
インストールすると左側のメニューに「WPtouch」項目ができるので、マウスカーソルを合わせて「設定」を選択。デフォルトで表示される「一般」項目をいちばん下までスクロールし、「言語」項目から「テーマ言語」で「日本語」を選択すればOK。
それでも一部項目は英語のままですが、おおむね日本語に変わるため、設定などで悩むことはないはず。

 wptouch wptouch

インストールしただけでも、スマホからのアクセスはスマホ対応表示に切り替わります。デザインが嫌な人はCSSをいじらなければなりませんが、なるほど定番プラグインだけあって、万人受けしそうな見栄え。特にこだわりがなければ、そのままでもいいんじゃないでしょか。
ただ、色の構成や、一度に表示される数などは変更したい人も多いはず。そうした設定変更は簡単です。
なお、ここからは2018年9月時点でリリースされている、WPtouch 4.3を基に解説していきます。WPtouchの使い方サイトは腐るほどありますが、大半は2014~2015年当時のVer.3に基づいた、古い情報ばかり。Ver.4からは一部の設定方法が異なるため、注意して下さい。自分も、最初は「んー??」となりましたから。

設定を変更する場合は、設定画面から「テーマのカスタマイズ」を選択します。

これらの設定はWordPress
外観 -> カスタマイズ 設定で処理されます。
カスタマイザに移動

このメッセージに従い、「カスタマイザに移動」をクリックすると、カスタマイズ画面が表示されます。

 wptouch wptouch

カスタマイズ画面で主に使うのは、「」と「Blog Featured Slider」項目でしょう。
Blog Featured Slider」では、スマホ表示した際のメニュー画面で、一度にいくつのコンテンツを表示するかが設定できます。デフォルト設定は「5」なので、ブログなら最新5日分が表示されるわけです。
この数値を変更したい場合は、「Max number of featured posts」と表示されたスライダーをマウスで動かします。変更後は、メニュー右上の「公開」をクリックすることで保存・反映されます。

 wptouch wptouch

もうひとつ設定を変えておきたいのが、カテゴリー。WordPress利用者の多くはカテゴリーを設定しているはずですが、デフォルト状態のWPtouchだと、メニュー画面でカテゴリーを表示してくれないのです。
スマホでもカテゴリーを利用したい場合は、WPtouchの設定ではなく、WordPressの設定を利用します。この概念はわかりにくいのですが、「WordPressで新たなメニュー構成を作り、それをWPtouchに反映させる」という考え方です。プラグインがWordPressと一体化しているからこそ可能な技ですが、使いやすくもあり、使いにくくもあるような…。

WordPressのダッシュボードから、左側のメニューで「外観」「メニュー」を選択。
ここで「新規メニュー」を作成します。メニュー名を決める必要があるので、わかりやすい「wptouch」などの名称にしておきます。

 wptouch wptouch

新規メニューを作成すると、設定画面が表示されます。

メニュー構造
左カラムからメニュー項目を追加してください。

というガイドに従い、左側のカラムから、まずは「固定ページ」を追加。特にこだわりがなければ、「すべて選択」した上で「メニューに追加」をクリックするのが簡単です。

次に、同じく左側のカラムからカテゴリーを追加します。デフォルトでは「よく使うもの」タブが選択されているため、スマホでも全てのカテゴリーを表示させたい場合は、「すべて表示」タブと「すべて選択」を選択し、「メニューに追加」。
これでカテゴリーも表示されるようになりますが、「メニュー構造」画面では、固定ページ一覧の下にカテゴリーがズラズラと表示されているはず。スマホで見ても、その通りに表示されてしまいます。
カテゴリーをブログ内メニューとして機能させるためには、カテゴリーをひとつずつ、親項目の下にドラッグ移動しなければなりません。
例えば「****」というカテゴリーを「Blog」項目の下に持っていけば、親項目「Blog」の階層構造に、子項目として「****」が置かれます。つまり、「****」がBlogの一カテゴリーとなるわけです。
目的の位置にドラッグするだけなので難しいことはありませんが、カテゴリーの数が多いと大変! けっこう手間がかかります。

 wptouch wptouch

設定が終わったら、いちばん下の「メニュー設定」で「WPtouch: Header Menu」を選択。これで、設定がWPtouchに反映されます。
最後に、「メニューを保存」をクリックすれば完了。スマホで見ても、カテゴリーを正しく利用できるはずです。

  Check  拍手する

WordPressへの攻撃で、ロリポップ!からアクセス制限がかかる

2014年6月01日 - Posted by reibo - Inside [Blog] Word Press   このエントリをはてなブックマークに追加このエントリをYahoo!ブックマークに追加
01 6月.

 レンタルサーバーはロリポップ!と契約しているのですが、この日、WordPressの管理ページにアクセスしようとしたところ…。
 いきなり、こんな画面が出現して驚かされました。

 キャプチャ画面

 そのリンク先には、以下のような案内が。

ロリポップ!はWordPressへの攻撃に対する検知・防御機能を導入しています。

WordPressに対する総当たり攻撃や辞書攻撃を検知した場合にWordPressダッシュボードへのログインができないよう、弊社側で『.htaccess』によるログインページ(wp-login.php)へのアクセス制限を実施しております。
その場合、あわせてご契約の登録メールアドレス宛に通知いたします。
アクセス制限を実施することで、WordPressのダッシュボードへ不正にログインされサイトが改ざんされるのを防ぐことができます。

 また、こんなメールも届いていました。

(抜粋引用)

平素よりロリポップ!をご利用いただき、誠にありがとうございます。

この度、「****」のご契約で利用されているWordPress の wp-login.php に対し、複数回のログイン試行が確認されました。
アクセスの内容より、総当たり攻撃や辞書攻撃など、WordPress への不正なログインを試みるアクセスの可能性が高いと判断されたため、弊社側で .htaccess による wp-login.php へのアクセス制限を実施し、WordPress ダッシュボードへのログインができないよう対応を行っております。
お客様ご自身が WordPress にログインするため、.htaccess を編集しアクセス制限を解除する必要がございます。
お手数ですが、下記対策マニュアルをご確認いただき対策を行っていただきますようお願いいたします。

これからもより快適に、楽しくご利用いただけますよう機能追加やサービス向上に努めてまいります。
今後とも、ロリポップ!をどうぞよろしくお願いいたします。

 上記ページには自分の(その時点でアクセスしている)IPアドレスも表示されるので、該当IPアドレス以外からのアクセスを許可しないように、 [.htaccess] を書き換えることになります。
 猿でもわかるほど親切丁寧な解説が記載されているので(苦笑)、誰でも簡単に編集できるかと。
 こうした「初心者にも優しい」一面はロリポップ!ならではでしょうし、攻撃への防御対策が機能しているという安心感も得られるのですが、相変わらず激しいアタックにさらされているのだと実感させられ、ちょっと複雑…。

  Check  拍手する

WordPress 3.9のエディタに不具合

2014年5月03日 - Posted by reibo - Inside [Blog] Word Press   このエントリをはてなブックマークに追加このエントリをYahoo!ブックマークに追加
03 5月.

 WordPressが最新のバージョン3.9(日本語版は2014年4月17日リリース)になって以来、怪現象に悩まされています。
 テキストエディタで「投稿の編集」や「新規投稿の追加」を行うと、「公開」関連のボタン類が半透明化し、押せなくなってしまうという現象。
 起動してしばらくは問題ないものの、作業を続けていくうち、いつの間にか上記の怪現象が現れる。ボタン類が点滅するように、押せたり押せなかったりを繰り返す場合も。まさに、怪現象(^^;;
 リロードすれば元通りになるのだけれど、自動的に下書き保存される内容は少し前のもの。
 最新の更新(修正)内容は消えてしまうので、不便で仕方ない。。。てか、集中しているときだとキレます(苦笑)。

 WordPress画面
 【↑ 画面右上の赤く囲った部分、「下書きとして保存」、「プレビュー」、「公開」という3つのボタンが押せなくなる】

 公式フォーラムの「バグ報告と提案」にも、「3.9になって、更新ボタンが押せなくなる時があります」というトピックが立てられていました。
 そちらにも書かれていた「プラグインをオフにしてみる」試みは、既に実行済み。全部ではなく、エディタ使用時に動くものだけですが…。それで直った方が羨ましく、トピ主さん同様にウチもダメです。
 ちなみに、ブラウザがComodo Dragonでも、Cyberfoxでも、現象には変わりなし。
 うーん、お手上げだ。
 今回の3.9はメジャーアップデートらしく、エディタ周りもかなりいじられているようです。原因不明な不具合が出るのは致し方ないとはいえ、早く修正バージョンを出して欲しいですねぇ。。。

  Check  拍手する

WordPressのバックアップ

2012年10月12日 - Posted by reibo - Inside [Blog] Word Press   このエントリをはてなブックマークに追加このエントリをYahoo!ブックマークに追加
12 10月.

 今回のプラグイン更新→死亡で懲りたというのもあり、WordPressのバックアップを考えました。
 これまでは本体をバージョンアップする際に関連ファイルをエクスポートしていたぐらいで、面倒なデータベースのバックアップはついつい放置…。
 調べてみると、関連ファイルとデータベースをまとめて、しかも定期的にバックアップしてくれるプラグイン:BackWPupというものがあるんですね。
 なるほど、これは便利そう。
 使用法は、以下のサイトを参考にさせていただきました。

 ウチの場合、画像は別ディレクトリへのリンクでWordPress内には置いていないため、全体をバックアップしても大した容量ではありません。なので、同じレンタルサーバー内に新たなバックアップ用ディレクトリを作り、そこに自動バックアップするよう設定しました。上記の参考リンクではDropboxを利用していますが、そのへんの設定は全てスルー。

  • インストール後、設定画面の【Add New】で自分用の新たな設定を作る。
  • バックアップ設定名称を決める。
  • ファイルとデータベースの両方をバックアップするので、【Job Type】で「Database Backup」と「File Backup」をチェック。
  • 【Job Schedule】で自動バックアップの時刻を決める。「Activate scheduling」をチェック。
  • 【Backup File】でバックアップする際のファイル名を決める。
  • 全ファイルをバックアップするので、【Database Jobs】は全てチェック。
  • 自動バックアップされた際のお知らせメールを【Send log】で設定。
    • 必ずメールが届くようにするには、「Only send an e-mail if there are errors.」のチェックを外す。チェックされていると、バックアップに失敗した際にしかメールが届かない。
  • 【Backup to Folder】で、バックアップ先を指定する。
    • 入力欄の下に、WordPressのインストール先がフルパスで表示されているはず。それを参考に(コピペ)し、異なるディレクトリを指定する。新たなディレクトリを作ることになる場合、最初のバックアップ時に自動で作ってくれる。
  • 最後に、【Job Type】の「Save Changes」をクリック=設定完了。
  • 設定完了後に、バックアップ機能をテスト。
    • プラグイン画面からBackWPupを開くと、「Job Name」として先ほど作った自分用のバックアップ設定があるはず。そこにマウスを持っていき、「Run Now」をクリックするとバックアップが始まる。「100%」になればOK。

 以上で、特に悩まされるような項目はないはず。
 レンタルサーバー自体が死亡し、全データが吹っ飛ぶなんて異常事態になると対応できませんが、とりあえずの保険にはなりますね。
 WordPress本体をバージョンアップする際だけでも、ローカル環境への手動バックアップを面倒がらずにやっておけば完璧?

2013.03、追記

 BackWPupのバージョンが3.01以降になってから、バックアップ時に「No MySQLi extension found. Please install it.」とのエラーを吐き、正常動作しないようになってしまいました。
 調べてみると、文字通り「MySQLiがない」ことが問題らしく。バージョンアップしたBackWPupがデータベース取得処理にMySQLiを使うようになったものの、ロリポップにはMySQliが導入されていない=サーバーが動作要件を満たしていない、ということなのでしょう。

参照

 で、対処法は?
 ロリポップがMySQLi対応になってくれるまでは、BackWPupを旧バージョンに戻すしか手がないようで

  1. BackWPupを停止する。
  2. BackWPupの公式サイトに置かれている旧バージョンから、問題がないバージョンでは最新の2.1.17をダウンロードする。
  3. zipファイルを解凍して、全ファイルを手動で【/wp-content/plugins/backwpup】フォルダに上書きアップロード。
  4. 再び有効化する。
  5. 自分の環境の場合、これでOK。各種設定もそのまま引き継がれていました。

 同様に困ってしまい、ロリポップにMySQLi対応要望を出しているユーザーさんも多いようです。早く対応して欲しいですね。

 *さらに追記

 3月5日付けで、ロリポップがPHP5.4(5.4.12)に対応していました。
 PHPのバージョンをこの最新版5.4に上げると、MySQLiが使えるようになり、BackWPupも最新バージョンが問題なく動作するそうです。

参照

 セキュリティ的に不安も残るBackWPupの旧バージョンを使用するよりは、こちらのほうがいいですね。
 当方の環境でも、PHPを5.4に変更したところ問題なく動作しているようです。

  Check  拍手する