WordPress用無料テーマ Bonyo/凡庸 v1.1フル機能版

「がとらぼ」の中の人が作成しているWordPress用の無料テーマBonyo/凡庸 (汎用はんようじゃないよ)のv1.1 フル機能版をリリースしました。

フル機能版だけど完全無料で制限は無し。有料版があるわけではないのでアップグレードを促すメッセージがウザいとかも無し。難しいことをしているわけではないのでBonyo/凡庸を使うということではなくても使えそうな部分があったらテキトーにコピって利用して貰って全然OKです。

Bonyoの詳細とダウンロードは↓から

WordPress用テーマ Bonyo (凡庸)

v1.1の新機能

WordPressの管理パネルでテーマ中の各種色カスタマイズ
カスタマイズ内容を含めてCSSを最小化して静的出力
AMPプラグイン用のテーマ
通常ページとAMPページでCSSを共通化
サイドバーをAMP用に変換して静的出力

v1.0までで実装済みの機能と特徴

CSSを自動的に最適化してそれを使う機能
画像の遅延読み込み
サイドバーの動的/静的化を選択可
Javascriptフリーな多階層メニューとハンバーガーメニュー
レスポンシブ2カラム→1カラム

v1.1では色関係のカスタマイズとAMP周りの追加がメイン。

色のカスタマイズはv1.0まではCSS変数による「なんちゃって」カスタマイズだったが、WordPressの管理パネルからのカスタマイズになったのでようやく普通のWordPressのテーマ的なカスタマイズができるように見えるかも。しかし、普通のWordPressのテーマカスタマイズ(の反映方法)は好きではないので変更内容をスタイルシートに含めて最小化してファイル出力するようにした。(同時にAMP用にも)

AMPはベース部分はWordPressのオフィシャルのAMPプラグインをClassicモードで使うことを前提としている。PairedモードやNativeモードの変換は不具合が多くて好きではないので。
Classicモードは基本的にはAMP専用のテーマにスタイルシートとAMP化した本文を嵌めて出力するものだが、Bonyo/凡庸ではほぼ通常テーマと同じ見た目のAMP用テーマを同梱し、さらにサイドバー部分をAMP変換して静的出力する機能を用意し、これらを合わせてAMPでもほぼ通常のページと同じ見た目になるようにした。静的サイドバーなのでAMP化ページの出力を遅くすることもない。ただし、AMPでは勝手Javascriptが許されてないのでJavascriptを使ったウィジェットを含むと通常ページと完全に同じ見た目にはならないかもしれない。

WordPress用無料テーマ凡庸 1
WordPressの管理パネルのテーマカスタマイズに「色」と「オプション」のセクションを設けた。テーマの基本的なカスタマイズはここから。

WordPress用無料テーマ凡庸 2
「色」のカスタマイズセクション。WordPressの他のテーマと同様にカスタマイズした内容は右側のプレビュー画面に反映される。 Bonyo/凡庸では色だけでなく色の透明度も指定できるので透明度を活かしたデザインにしていただければと。上の画像では本文の色を透明度の高い赤(ピンクっぽく見える)に変更したところ。

WordPress用無料テーマ凡庸 3
「オプション」のカスタマイズセクション。Bonyo/凡庸の機能を有効・無効を選択できる。
都合によりページの背景画像の指定項目もここに置いた。

WordPress用無料テーマ凡庸 4
AMPプラグインはWordPressのオフィシャルのもの(作者がAutomattic)を使用することを前提としている。AMP for WPではないので注意。
インストールしたら設定画面で「Classic」モードを選択して「設定を保存」を押す。テーマがBonyo/凡庸でWordPressの標準ウィジェットを使う限りはAMPエラーは発生しない筈。GoogleのAMPテストでAMPエラーになるようであれば改良の余地ありなのでお知らせ下さい。

v1.2以降では「最近の記事」一覧をハードコーティングではなくamp-listとWordPress標準のREST APIを利用して動的にページに嵌める機能を実装したい。これによりAMPキャッシュであっても常に最新の「最近記事」一覧が表示できるようになる。「がとらぼ」のAMPページでは実装済み。
あとはウィジェットに広告コードを書いている場合のAMP用への切り替えを実装したいと思ってるけど、こちらはまだ「できたら良いなぁ」レベルなので具体的にどうすれば実現できるのか足りないアタマで悩み中。