Weblocoオリジナルテーマのバージョンに関して
Weblocoオリジナルテーマは、2023年12月時点で、「series1」から「series5」までがリリースされています。
その中で、この記事で紹介している仕様は「series5」が対象となります。
弊社オリジナルテーマ購入に適している方
弊社オリジナルテーマは、初心者向けではなく、多少Web制作の経験や専門知識がある方向けのテーマとなっております。
その為、下記の項目に当てはまる方は、前向きに購入を検討しても良いと思います。
- WordPressの基本的な使い方を理解している方
- HTMLやCSSの基本を理解している方。または、書けなくてもソースを読める方
- 機能性は求めていなく、シンプルなテーマを望んでいる方
- アクセシビリティに配慮したテーマを望んでいる方
- ブロックエディタに対応したテーマを望んでいる方
WeblocoオリジナルWordPressテーマの仕様
弊社オリジナルテーマのファイル構成
高機能を謳っているテーマとは違い、シンプルが特徴な為、ファイル構成もシンプルとなっております。
テーマのバージョンによって、若干の違いはあります。
「ウェブアクセシビリティ」に配慮
「アクセシビリティ」とは「誰でも平等に利用できるようにしよう」という考えです。（「ウェブアクセシビリティ」の詳細は、「2024年に義務化『どうするWebアクセシビリティ』初心者にも分りやすく解説。」をご覧ください。）
ウェブアクセシビリティには、多くの達成基準が設けられていますが、弊社テーマを使用することで、以下の「達成基準リスト」に記載されている部分を意識しないでクリアする事が出来ます。
達成基準リスト
アクセシビリティの評価項目はとても沢山あります。そこで、当テーマがどの程度、達成基準を満たしているかを分かりやすく表にまとめました。
詳しくは「当テーマの達成基準リスト」をご覧ください。
アクセシビリティチェックツールの結果
DevToolsでのテスト結果
Lighthouseでのテスト結果
「ブロックエディタに対応」
「ブロックエディタ」に対応している為、ページの作成を直感的に行う事が出来、多くの部分を「ノーコード」で作成できます。
「Bootstrap5」の「グリッドレイアウトシステム」を採用
レイアウトに関しては、便利さと普及率を考慮して、CSSフレームワークで有名なBootstrap5の「グリッドレイアウトシステム」を採用
ただ、それ以外は、全てプレーンでオリジナルなCSSで構築。
WordPress独自のスタイルの読み込みを停止
レイアウト組は、「Bootstrap5」の「グリッドレイアウトシステム」を使用する為、WordPress独自のスタイルと干渉して、意図しない挙動をさせない為、読み込みを停止しています。
「TweenMax」と「ScrollMagic」を使用したアニメーション
近年では、ホームページにアニメーションを取り入れるサイトが大多数です。
弊社のオリジナルWordPressテーマでは、「TweenMax」と「ScrollMagic」というアニメーションライブラリを使用しており、スクロールで滑らかなアニメーションが設定可能です。
脱jQuery
ホームページ内のインタラクションな動きや振る舞いを制御する言語「javascript」では、「jQeury」を使わずに、素の「javascript」で書いてあります。
「jquery」は大変便利なライブラリですが、ページの読み込み速度が遅くなるというデメリットもあり、これにより、若干ではありますが、「jQeury」を使っている場合に比べ、レスポンス向上に寄与しています。
CSSカスタムプロパティ（変数）を使用
ホームページのビジュアルデザインをつかさどるスタイルシートでは、メンテンナンス性を高める為、CSSカスタムプロパティ（変数）を使用して、配色や文字サイズ、余白など、該当の値を1か所を変更すれば、全体に反映される様に設計されています。
テーマカスタマイザの機能
機能は大変シンプルで、必要最低限の機能しかありません。
ビジュアルデザインをカスタマイズしたい場合は、スタイルシートを直接カスタマイズしていただくことが基本となります。
テーマのバージョンによって、若干の違いはあります。
ウィジェットエリア
ウィジェットエリアは、よく利用する箇所に配置しております。
テーマのバージョンによって、若干の違いはあります。
固定ページテンプレート
Weblocoのオリジナルテーマには、３つの固定ページテンプレートが備わっています。
| デフォルトテンプレート | 1カラムで、コンテンツ幅は、containerと同じ幅になっています。 アイキャッチ画像を設定すると、ヘッダータイトルの背景画像として表示されます。 |
|---|---|
| フルワイド | 画面を一杯に使えるフルワイドのテンプレートです。幅の制約はなく、自由にコーディング出来ます。 アイキャッチ画像を設定すると、ヘッダータイトルの背景画像として表示されます。 |
| フリー | 画面を一杯に使えるフルワイドのテンプレートです。幅の制約はなく、自由にコーディング出来ます。 見出し１のタイトルも表示されない仕様なので、見出し１のタイトルも含める必要があります。 |