見出し画像

阿修羅ワークス開発日誌 GWはオリジナルテーマを開発だ

GWです。相変わらずテーマの開発を続けています。
今回新しいアイデアとして、オリジナルウィジェットをショートコードでも呼び出し可能にしました。

なんのことか意味不明な人のために経緯を説明すると、WordPressのテーマって役割ごとにパートに分けることができます。
パートに分けて、各ページから呼び出してごにょごにょするわけですが、2つ問題点があるんですね。

1つはパートに分けたとしても設定の変更はできない(基本的にテンプレートファイルを書き換えないと固定)。

1つは好きな位置に呼び出しができない(基本的にテンプレートファイルを書き換えないと固定)。

となります。

まぁ、テーマのテンプレートを直接いじればいいわけなんですが、一般ユーザーにそんなことはさせられません。
となると、設定画面をつけてバリアブルな仕組みにしないといけないんですね。

これを解決しようとしたのがビジュアルエディター系のElementorやVisual Composerといったプラグインです。
海外のテーマではVisual Composerが使われていることが多いですね。
ビジュアルエディターはWix的な感覚でCSSやJavaScriptを知らなくてもマウスでサクサクデザインができてしまうエディタです。

じゃあそれを入れればいいじゃないってことになるんですが、そうもいかないんですね。
ElementorやVisual Composerでできることはテーマ内部の投稿についてなので、テーマという外枠への干渉が難しいんですね。
なので必然的に使用しているテーマとビジュアルエディタのテイストの違いというか、機能の違いでバッティングすることになります。

普通のブログならそれでいいんですが、ブログ以外の使い方をする時には運が悪いとバッティングします。
特にWordPressを使ったウェブサービスを立ち上げようとすると、バッティングしたら最後です。

だって、ElementorやVisual Composerを(コストの問題から)勝手にいじるってわけにはいきませんから。
考えてみればテーマ自体を編集できるプラグインというのはあまり聞いたことがないですね。

それで話は戻りますが、WordPress用オリジナルテーマを開発しています。
前述した2つの問題点を解決するにはビジュアルエディターを導入すればいいんですが、しかし、それはしたくないのでどうすればいいかというと、オリジナルのウィジェットを作ることで解決します。

ウィジェットというのはサイドバーなんかに出す新着一覧とか、検索フォームとかそういった小さなプログラムのことです。
ウィジェットを使うことで、ユーザー側で自由にデザインの編集ができるようになります。
ただし、問題があってウィジェットというのは基本的にテンプレート内の「dynamic_sidebar関数」が定義された場所でしか呼び出せないんですね。

ユーザー側でデザインのパーツは作れるけれど、それを表示する場所に自由度がない、という問題が新しく出てきます。
そこで、解決策としてウィジェットに保存した内容をショートコードで呼び出しできるようにすることです。
(普通はできません)
ショートコードであれば「dynamic_sidebar関数」は関係なく表示できます。

しかし、また別の問題が発生します。ショートコードを挿入する場所です。
ショートコードは投稿やウィジェット内には挿入できますが、テーマテンプレート内に挿入するには、やはりテンプレートファイルを書き換えないと駄目なんですね。

ダメじゃん。ハイ、詰んだ!


そこで………テーマテンプレートを直接編集できるエディタを作りました。
このエディタを使ってテンプレートにショートコードを直接挿入できるようにすると、かなりデザインの自由度が上がります。

ウェブパーツ登録

ただし、オリジナルウィジェットはそれなりに高機能なものを用意しないといけません。

今その開発をしているのですが、どんなものがあるかというとこんな感じ。

・カスタム投稿表示ウィジェット
・アイコン付カテゴリ・タグ表示ウィジェット
・ユーザー一覧表示ウィジェット
・ヒーローイメージウィジェット
・スライダーウィジェット
・フリー広告ウィジェット

これらを使うことでかなり柔軟にデザインパーツを切り貼りできるようになります。
例えば、カスタム投稿表示ウィジェットはカスタムテンプレート機能を備えているのでウィジェットごとにデザインを変更できます。
カード型とかリスト型の変更も楽です。

ウィジェット

GW中になんとかいいところまで終わらせるぞ!

この記事が気に入ったらサポートをしてみませんか?