投稿者: はなまるチェック

近年のブログやネットショップなどに於けるシステムの傾向にwebサイトを構築する際のブロック・エディター化が有ります。ブロック単位でのレイアウト変更がweb上の管理画面にて容易に行えるシステムで、ネットショップでは勃興著しい「Shopify」が代表として挙げられるでしょう。世界で最も利用されるブログシステムのWordPressも此の傾向に無縁ではいられません。2018年師走に鳴り物入りで登場した「Gutenberg
グーテンベルグ」に先鞭を告げ、先のデフォルト・テーマ「Twenty Twenty-Two」にて端的に導入されたWordPressのブロック・エディター化_[※1]は最新のデフォルト・テーマ「Twenty Twenty-Three」で更に顕著なものとなりました。

詳解WordPress

此の傾向に於いてはITに其れ程馴染みの無い向きには便宜が図られるも、所与のデザインでは満足されない場合に此のカスタマイズを依頼されるIT屋に取っては、勿論、「Gutenberg
グーテンベルグ」から既に五年を閲しようと言うものの、未だ先のテーマで明確な潮流となってからよりは長い時間を経ぬ上での状況も有って、なかなかの難物となる様で、近しい時期に引き継いだWordPressサイトの構築がブロック化を忌避するように全くデフォルト・テーマから切り離して昔ながらの手法で独自テーマを以て成されているなど見るに付け感じられる所ですが、流石に其の旧態依然さに驚かされも呆れさせられもし、此の如くブロック・エディター化を執拗に避けるのも限界があるでしょう、以て反面教師とし、他山の石としたく思い、少しく「Twenty Twenty-Three」に取り組み標題の知見をシェアするものです。

Twenty Twenty-Threeに見られる著しい変化

最新のWordPressデフォルト・テーマのフォルダ内を見て先ず驚かされるのは、カスタマイズする際にはお馴染みの「functions.php」ファイルが見当たらないことです。此れについては情報が錯綜してもおり、バージョンに仍っては付与されるケースも見られる様ですが、2023年5月現在には見当たりません。

WordPressがバージョン5にメジャーアップデートした時、ブロックエディタ「Gutenberg
（グーテンベルグ）」には驚かされた向きも多いのではないかと拝察するのは一時、手掛ける案件は殆どが従来の環境に寄せるプラグイン「Classic
（クラシック）Editor
（エディター）」を要請に受けてインストールしたからです。「Gutenberg
（グーテンベルグ）」は2018年師走に鳴り物入りで登場したものの従来との異質性から些か嫌われた面も有りましたが、数年を経て徐々に使われ始めている印象が有り、今後の普及は確実なものとなった様に感じられます。本記事も勿論エディターには「Gutenberg
（グーテンベルグ）」を利用しています。

The Gutenberg Revolution

しかしメジャーバージョン5の目玉かと思われて来た「Gutenberg
（グーテンベルグ）」も序章に過ぎませんでした。WordPress運営のメジャーバージョンアップデートの本来の目的は更に先に有りました。バージョン5.9で導入されたフルサイト編集機能と其れを活かすべく登場したテーマ「Twenty Twenty-Two」を以て明らかとなったのです。

Twenty Twenty-Two

新たに登場したテーマ「Twenty Twenty-Two」のWordPress公式の説明には「数十種類のブロックパターンを搭載し、数クリックでプロがデザインしたさまざまなレイアウトを利用できます。」なる文言が含まれるに従来からの飛躍が詰め込まれています。バージョン5.9で導入されたフルサイト編集機能との合わせ技にてエディター「Gutenberg
（グーテンベルグ）」と同様にブロックエディターはサイト全体に拡張され、サイト全体のブロック編集が可能になったのでした。

サイト全体にブロックエディターが拡張されたのは管理画面に明瞭に可視化されています。下の図に於いて左が一つ前のデフォルトテーマ「Twenty Twenty-One」で右がテーマ「Twenty Twenty-Two」の管理画面になりますが、メニューの「外観」が明らかに異なり、「Twenty Twenty-Two」には僅か二つ「テーマ」と「エディター（ベータ）」しか項目が設けられて居らず従来からの異質性を見て取れます。

頃日気付けば、少々遅きに失しているのかも知れませんが、 少し前迄は此の様な仕様ではなかった気がしています。 MacでブラウザにGoogle Chromeを用いた時、 検索結果の背景が真っ黒となり、 其の上に文字が青色という実に醜い仕様になってしまっているのです。

Macの設定確認

此れがダークモードであるのは凡そ察しが付きますので、 先ずはMacの設定を、 以下の如くメニューを辿り確認します。

すると案の定、 Macの設定はダークモードになっており、 此の設定が検索結果画面に影響を及ぼしているであろうのは見当が付きますが、 しかしつい此間迄は其の様な色合いにはなく、 であれば、其の異様さと使い難さに間違いなく大きな違和感を抱いていた筈です。

現在でも総務省から突き上げられている様に 顧客への還元のない姿勢から少し前は随分と酷評していたドコモのサービスですが、 故意に分かり難く設定されたとも思える各プランは其の儘なるも、 どうも金融・決済サービスの一環として、 dポイント と結び付けられた dカード の登場と共に風向きが変わって来た様に感じられます。

ドコモ社のiTunesギフトカード割引販売お知らせメールに添付された画像

ドコモdカードへの転換

先日は連休中、2018年5月2日にNTTドコモ社から届いたお知らせのメールの App Store ＆ iTunesギフトカード初回限定10％OFF！さらに2％dポイントプレゼント はiTunesストアに補充の必要を感じていた折も折、 なかなかお得な内容に感じられれば、 渡りに船よと、 受け取ったメールの内容をiPhoneで確認した其の場、寝そべった其の姿勢で iTunesギフトカード10000円分を購入、 其の儘App Storeに登録して思ったのは、 思い付いた儘、寝た儘、此の様に買い物が出来るのでは 小売が厳しいと言われるのも無理はない、と言う世評が肯んぜられるものでした。

dカードの前身とも考えられる iDカード は明確に失敗だと断じて宜しいかと考えます。 何となればドコモが懸命に売り込んだに関わらず遂には普及には至らなかったからで、 具体的な例としては此の春にリニューアルされたドコモの契約者をランク付ける dポイントクラブ の ステージ の最上位決定の条件からはiDカード契約が外されています。 iDカードは キャッシュを燃やす様な経営との批判を下方修正を余儀なくされた株主総会で受けた 際、 インターネット通販で失敗 し、 コンテンツ・メディア事業でも失敗 し、共に失敗した当時、ドコモが本業以外の事業多角化の一つとした 金融・決済 事業の中核を担うサービスでしたが矢張りドコモの思惑通りには運ばなかった訳です。 本ブログにも遡ること7年、2011年の12月24日の記事にドコモの金融、決済サービスを酷評しています。

以前に良く見掛けた、 タイトルで言い切った 、的なエントリーです。 知ってる向きには何を今更、と言った処にて、 以下読む必要はありません。

featured image アイキャッチ画像

結論

上にリンクを貼り置いた Standing on the Shoulder of Linus ブログの2010年4月8日の記事では、 WordPressのバージョン2.9に於いて 投稿サムネイル機能 が追加され、バージョンが3.0に上がると其れは Featured Image と命名されたそうで、其の和訳こそ今WordPressユーザーに一般に流通する アイキャッチ画像 なのでしたが、日本語の決まっていないベータ版で訳が割り振られたそうなのです。

浜松市鴨江寺仁王門阿吽像

恥ずかしながら此の事実に気付かされたのは…

WordPress案件でよくある要請にカテゴリー記事一覧の表示があります。 単に特定の単独カテゴリーの記事一覧であれば 其の方法はネット検索すればかなり豊富に見付かります。 此れが複数カテゴリーの記事一覧の表示になると些か其の方法が見付かり難くなるのは カテゴリーの複数化に因る表示のバリエーションが増え、 情報が其々の状況に応じたものに寄せてあって目的に適い難い部分が出てくるからかも知れません。

バリエーションの一つとして此の要請のオプションに於いては屡々 カテゴリーの親子関係を考慮した記事一覧の表示が求められと言う条件が与えられます。 具体的に言えば 複数カテゴリーの其々最新の記事を一つづつ表示したり、 複数カテゴリーを横断して最新の記事を任意数表示したりする条件から、 中には親子カテゴリーを考慮して特定親カテゴリーに属する子カテゴリーの其々の記事一覧を表示したりするものまで なかなか多様な条件に彩られると言っても良いかも知れません。

手元で実現したい条件としては 特定の親カテゴリーの記事一覧と其の子カテゴリー全ての記事一覧を合わせて 中から日付順に表示していく必要があるもので、 此れもオプションとしては要請の度合いが高いものに属するかも知れません。 此の条件を実現しようとすると どうしても複数カテゴリーの記事の全てを取得して 時系列で整列させて上で表示させなければならなくなります。

世の中フロントエンドと言えばFacebookの提供するフレームワークなどで大規模なものを想起し勝ちとなりましたが まだまだホームページに於ける小規模な実装では jQuery が活躍しますしWordPressの2017年最新版に於いても標準で読み込まれるような実装となっています。 ちょっとしたスムーススクロールやアンカーリンクの無効化などを一部に適用するなどの要請では 特定のページに読み込むだけの実装で済ませられれば大規模なフレームワークでは些か冗長さを免れません。 jQueryを利用すれば此れ等の如きJavaScriptファイルは僅か数行となりますから尚更です。

懐かしのポケコン シャープ ポケットコンピューター PC-1210

此れをWordPressの特定ページに読み込ませたりする際には functions.php にWordPressの特有関数 wp_enqueue_script を用いてファイル読み込みを実装するのが定石でしょう。 例えばhomeで関連づけられた wp_register_style を用意して孰れかのタイミングで add_action おけばif文で条件分岐した wp_enqueue_style で読み込めると言った塩梅で実に重宝です。