WordPressテーマ「METRIX」の詳細


METRIX

METRIX(メトリクス)は、シンプルでミニマルな、デザイン性と機能性を追求したWordPressテーマです。
MAJESTICテーマの機能をすべて踏襲しつつ、さらに、デザインと機能をミニマルに深化させたテーマとなっています。

 

UXを向上させるマイクロインタラクション

UXとは、ユーザーエクスペリエンス(User Experience)の略で、
「ユーザー体験」のことを指します。

UXデザインとは、そのユーザー体験をデザインすることを意味します。
その手法の一つが、マイクロインタラクションと言われるものです。

マイクロインタラクションとは、ユーザーが 特定のアクションを実行したときに表示されるアニメーションや視覚な効果のことで、
こういった演出を加えることにより、サイトをより印象的に魅せる効果があります。
METRIX(メトリクス)テーマは、メインのスライダーだけでなく、サイトをさらに読み進めていくと現れる、
アイキャッチ部分に、マスクエフェクトにより、モニターの表示領域に入ったタイミングで、
アニメーションを伴いながら表示するアクションを実装しました。

※2017年10月現在、アイキャッチ画像のマスクエフェクトは、macOS High Sierraに対応していません。

機能的な目的のもと、存在を強く主張せずに機能させていますが、このアクションが不必要な場合は、設定で無効にすることもできます。
また、このアイキャッチのブロックコンテンツは、動画も表示させることができ、また、このブロックは、複数設置することができます。


【設定可能オプション】

アイキャッチブロック設定
・見出しタイトル
・説明文

TOPページのブロックコンテンツ設定
・アイキャッチ画像
・ブロック間の余白
・ボタンのテキスト

パララックスコンテンツをより簡単に

当テーマでおなじみのパララックスウィジェットは、簡単にパララックスコンテンツを複数作成できるウィジェットです。

画像のアップローダーはもちろん、見出し、説明テキストの設定や、それレぞのアニメーション効果も設定できます。
スライダーと同様に、デバイスを問わずフルスクリーン表示することができます。

ビューポート(画面の表示領域)の設定により、画像をフルスクリーンで表示させることもでき、ビューポート(画面の表示領域)の〇〇%に表示するというような設定も可能です。
また、別ページへ誘導するゴーストボタンや、アニメーション効果も簡単に表示することができます。


【設定可能オプション】
・画像アップローダー
・タイトル
・アニメーションスタイル(11パターン)
・サブタイトル :
・サブタイトルアニメーションスタイル(11パターン)
・オーバーレイヤー色
・テキスト色
・テキストシャドゥ色 :
・パララックス(視差)効果の値
・ビューポートの高さ
・ゴーストボタンタイトル
・ゴーストボタンリンク先URL
・ゴーストボタンリンクターゲット
 

美しい日本語タイポグラフィー

サイトの印象を大きく変えるのが、フォントです。
Google NotoSans、ゴシック(游ゴシック)、明朝(游明朝)の日本語フォントを、見出しタイトルと本文別々に設定できます。(NotoSansは、タイトルのみ。)

さらに、テーマオプションから、要素別に、フォントサイズ、色、行間、文字間など仔細な設定を行うことができます。


【設定可能オプション】
・フォントカラー
・フォントサイズ
・フォントの太さ
・文字間
・行感覚
・余白
・見出しタイトルの日本語フォント
・本文の日本語フォント

魅せる、高機能カルーセルスライダー

高機能カルーセルスライダーは、投稿ページだけでなく、固定ページも指定可能。
さらに、対象カテゴリーの指定、期間、並び順、ページ(投稿)単位で表示するページ等を指定できます。


 
【設定可能オプション】
・タイトル
・アニメーションスタイル
・サブタイトル
・サブタイトルのアニメーションスタイル :
・投稿タイプ(投稿/固定ページ)
・最大表示件数
・カテゴリー:(投稿タイプで、「投稿」を選択した場合のみ適用)
・並び順 (新着順/コメント数順/ランダム/ID順/親ページのID順/タイトル順/最終更新日順)
・表示期間(過去1年間/過去1ヶ月/過去1週間/過去24時間)
・表示に含める投稿IDを指定 (,(カンマ)区切りで複数入力できます)
・表示に含めない投稿IDを指定 (,(カンマ)区切りで複数入力できます)
・デバイス別表示枚数(480px以下/1024以下/1024px以上)
・アイキャッチ画像のサイズ(正方形/5:3)
・余白
・自動再生 :
・スライドのスピード(ミリ秒)
・ページネーションのスピード(ミリ秒)
・アイテムが最初に戻る時のスピード(ミリ秒)
・ナビゲーションを表示
・ページネーションを表示
・ホバーでストップ
・スライドをループ
・スワイプ動作

デザインを仔細にカスタマイズ可能な、スタイリッシュなGoogle Maps

Google Mapsを、おしゃれにスタイリングするためのテーマオプションを搭載。
オリジナルのマーカーアイコン画像もアップロードすることができます。
ショートコードにも対応。好きなウィジェットエリアに表示することができます。

デザインを仔細にカスタマイズ可能な、スタイリッシュなGoogle Maps
【設定可能オプション】
・APIキー
・マーカーアイコン
・吹き出し
・地図のメインカラー
・彩度
・明るさ
・ガンマ値
・明度を反転
・地図の高さ

カスタムCSS機能で、テーマを編集せずにオリジナルのスタイルシートを編集

デザインをカスタマイズしたい場合、カスタムCSS機能を使うと、
テーマを編集せずにcssを追加、編集することができます。
ここで指定したcssはテーマのアップデート時にも上書きされませんので、テンプレートファイルを編集せずに独自のカスタマイズを行うことができます。

カスタムCSS

基本機能

多彩なテーマオプション
9ウィジェットエリア
Google日本語Webフォント対応
Facebook,Twitter Cards OGP設定
ロゴ画像アップローダー
iPhone用ホームアイコン画像アップローダー
Faviconアップローダー
ページ別に、1~2カラムレイアウト設定
カスタムcss
SNS共有設定
各項目の表示/非表示設定
レスポンシブデザインによりモバイルデバイス対応
microdata対応パンくずリスト
関連記事表示
投稿フォーマット対応
固定ページの投稿オプション
ショートコード
カスタムメニュー

テーマオプション画面

テーマオプションの設定画面のキャプチャ画像をご覧いただけます。(クリックで拡大します。)





搭載ウィジェット

  1. ランキング機能つきタブウィジェット
  2. Facebookページプラグインウィジェット
  3. フリーエリアウィジェット
  4. contact infoウィジェット
  5. カルーセルスライダーウィジェット
  6. パララックスウィジェット
  7. 1カラム記事リストウィジェット
  8. 動画ウィジェット
 

推奨プラグイン

インストールすると便利なプラグインを、一括でインストールすることができます。

manual14
 

■Contact Form 7
定番の、国産メールフォームプラグインです。

■Page Builder by SiteOrigin
シンプルなドラッグ・アンド・ドロップのページビルダーです。
カラムと行を自由に設定・追加することができ、ウィジェットをコンテンツ部分にも入れることが可能で、レスポンシブなページレイアウトをできます。
ライブエデイターにより、サイトをプレビューしながら、レイアウトを組むことができます。

■SiteOrigin CSS
cssの知識が無くても、サイトをプレビューしながらカスタムcssを自動で作成することができます。

■SiteOrigin Widgets Bundle 
「Page Builder by SiteOrigin」用の追加ウィジェットです。

■image-widget
画像をアップロードできるプラグインです。

【参考】
おすすめWordPressプラグイン
//isotype.blue/recommend_plugins/

それぞれのプラグインの使用方法等についてはサポート外となります。

 
27,000円(税込み)
STORES.jpで購入


 




 

テーマ一覧へ