ワードプレステーマ

当サイトに使用している自作ワードプレステーマ「RKWP」についてのページです。

RKWP(アールケイワードプレス)は、SEO最適化済み、レスポンシブ対応、高いカスタマイズ性を持つワードプレステーマです。

ポートフォリオとして作成しているため、ローディング・モーダル・カルーセル・メールフォーム等、全ての機能において外部ライブラリを使用せず、HTML5, SCSS, jQuery, PHPの自発コードのみで実装しています。

RKWP
RKWP1.0
テーマ名
RKWP
制作者
RKmee さとう玲香
ライセンス
GNU General Public License v2 or later

コンセプト

  1. 当社が運営する複数事業におけるコーポレートサイトのブランドイメージを統一
  2. 当社が提供する情報・サービスに必要な機能に限定し、運営・更新の利便性を向上
  3. 後から必要な機能が出てきた際、スムーズに拡張できるカスタム性の実現

ブランドイメージの統一

デザインの統一

メニュー・レイアウト・ボタン・余白等の大枠のデザインルールを固定化することで、トーン&マナーを統一してサイト毎のデザインイメージのブレ幅を抑えます。

カラーの統一

カスタマイザーで「配色」を設定することで、指定した配色から自動計算されたカラーがサイト内すべてに一括適用されます。

これにより、サイト全体が数値で計算されたバランスの良い配色でまとまり、色味が原因でのバランスの崩れを防止します。

運営・利便性の向上

テンプレート

当社のコンテンツに使用するページの利便性を突き詰めたテンプレートを実装しています。

インフォメーション

カスタム投稿タイプ「Info」は、トップページ上部にタイトルが固定表示できるほか、姉妹サイトから最新情報を引っ張ってくることができます。

強調して周知したい情報や、ブログに書くほどではない更新履歴等の短い情報の投稿に最適です。

ギャラリー

テンプレートページ「ギャラリー」は、エディタ内クイックタグボタン「ギャラリーブロック」を使用してカテゴリ別に分けて配置することで、カテゴリまでスクロールするボタンが自動で生成されます。

また、ワードプレス標準のギャラリー機能を拡張しているため、投稿された画像をクリックすることでモーダルが開き、左右にザンピングが可能です。

サイトマップ

テンプレートページ「サイトマップ」は、テンプレートを選択するだけでサイトマップを生成します。

「カスタマイザー>ページの設定>サイトマップの設定」から、除外したいページ・記事の指定が可能です。

プライバシーポリシー

テンプレートページ「プライバシーポリシー」は、テンプレートを選択するだけでプライバシーポリシーを生成します。

本文を入力することで、オリジナルのプライバシーポリシーに置き換えることが可能です。

拡張性・カスタム性

オリジナルカスタマイザー

標準のWP_Customize_Controlクラスを拡張し、カスタマイザーの入力フォーム機能自体をオリジナル化しています。

これにより、「複数選択可能なチェックボックス」や「選択肢ラベルに画像を使用したラジオボタン」など、より利便性の高い入力フォームの利用が可能な他、配列に追加するだけで新たなオリジナル入力フォームを容易です。

また、選択肢によって関連項目の入力フォームを自動で表示・非表示することができるので、入力が不要な項目を視覚的に隠し、すっきりとした操作画面を実現しています。

拡張しやすい設計

カスタマイザー・カスタム投稿タイプカスタムフィールド・クイックタグ・ショートコードなど、項目自体を追加したい機能を関数化しているため、配列に必要項目を追加するだけで簡単に新たな機能を実装できます。

また、ナビメニューやページネーションをシンプルで最低限の構造に編集しているので、修正することで自由な構造に変更することが可能です。

Dart SASSの採用

RKWPではDart SCSSを採用しており、パーシャルを用いて@use, @fowardで統合しています。

これによりSCSSファイル内で変数を使用できるほか、上書きした場合も!defaultによって無駄の少ない綺麗なコードを保つことが出来ます。

カスタマイザーで設定した値はstyle.phpからSCSSファイル内に取り込んでいるので、SCSS内で計算に用いることができます。
(取り込まれる値はSCSS変数ではなくCSS変数です)

使用サイト

Back Top