Luxeritas カスタマイズ(外観) アニメーション

2017/10/24Luxeritas カスタマイズ(外観)

Luxeritasの用意されているカスタマイズでどこまでできるのか見ていくと、カスタマイズ(外観)メニューもたくさんあるようだし、一つ一つメニューを見ても何ができるのか分からないし、その時に分かってもすぐ忘れるので確かめてみているわけですけど、全ての機能を見ていくとかなり微細なところにまで及んでいるのを実感させられます。

今回の「カスタマイズ(外観) アニメーション」ではデザインだけでなくマウスオン時のズームイン、ズームアウトも可能になっています。

Luxeritas251

サイト名

アニメーション効果なし

Luxeritas260

Luxeritas252
通常状態ではトップページリンクがあるサイト名にマウスを持っていくと、リンクへのマウスオン設定で色が変わったりします。ここに大きさの変更を加えていくのが「アニメーション」という効果です。「アニメーション効果なし」設定なら当然アニメーション効果が無い通常状態のリンクとして表示されています。

ズームイン

Luxeritas261
マウスオンでタイトルはスルスルとだんだん大きくなっていきます。大きさじたいはそれほどでもありませんが、瞬間的に大きくなるのではないのでマウスオンで動きが出ます。

ズームアウト

Luxeritas262
マウスオンでタイトルは小さくくなっていきます。こちらは「ズームイン」の逆バージョンで、スルスル小さくなっていきます。

記事一覧のサムネイル

アニメーション効果なし

Luxeritas253
このサイトはリンクのある画像や文字にマウスがオンになるとピンクにその部分が配色される設定を入れてあるのでいくらか画像の縁などがピンクっぽくなっています。それはアニメーション効果とは無関係です。
「アニメーション効果なし」設定では大きさに変化はありません。

ズームイン

Luxeritas254
サムネイルにマウスオンで大きさが少し変わります。
ヌルヌルと大きくなっていくので、大きさじたいは差異がわかりにくいくらいですが、変化していくので実際はかなり印象に残ります。

ズームアウト

Luxeritas255
サムネイルにマウスオンで大きさが少し変わります。
ヌルヌルと小さくなっていくので、大きさじたいは差異がわかりにくいくらいですが、変化していくので実際はかなり印象に残ります。

SNS シェアボタン

アニメーション効果なし

Luxeritas256
アニメーション効果で大きくしたり小さくしない場合の設定です。

上方移動

Luxeritas263
「上方移動」にチェックを入れて記事下にあるSNSボタンのどれかにマウスカーソル載せます。

Luxeritas257
マウスオンしたSNSボタンがスルスルと少し上昇するアニメーション効果が設定されます。

ズームイン

Luxeritas264
サイト名の「ズームイン」と同じで大きく表示が変わります。

Luxeritas258
マウスオンしたSNSボタンがスルスルと少し大きくなります。画像だとあまり大きくなった変化がわかりにくいくらいですが、だんだん大きくなるので大きさ以上にマウスオンで変化があります。

ズームアウト

Luxeritas265
マウスオンしたSNSボタンがスルスルと少し小さくなります。

Luxeritas266
マウスカーソルを合わせると小さくなっています。

ヘッダーナビ (グローバルナビ)

アニメーション効果なし

Luxeritas267
アニメーション効果で大きくしたり小さくしない場合の設定です。

上方移動

Luxeritas268
上方移動は「SNS シェアボタン」の時と同じようにマウスオンで少し移動が起きます。

Luxeritas259
ヘッダーナビ(グローバルナビ)にマウスオンでスルスルと少し上に上昇します。

ダッシュボード→Luxeritas→カスタマイズ(外観)攻略法

Luxeritas270[6]
サイトタイトル変更とサイトアイコンを設定手順説明
Luxeritas271[6]
横幅、記事一覧、パンくずリンク、関連記事とナビ表示
Luxeritas272[6]
タイル型、カード型グリッドレイアウト表示手順説明
Luxeritas273[5]
カラム変更とサイドバーなどの領域分離or結合を選択
Luxeritas274[6]
ヘッダー/フッターのカスタマイズ
Luxeritas275[4]
コンテンツ&サイド枠線とサイドバー幅変更
Luxeritas276[8]
コメント欄の表示or非表示、枠線
Luxeritas277[4]
キャッチフレーズ、ホーム、PAGE TOP変更
Luxeritas278[3]
メタ情報の表示or非表示と配置
Luxeritas279[7]
サムネイル(アイキャッチ)大きさと配置
Luxeritas280[4]
フォントの変更
Luxeritas281[6]
タイトル、記事など文字サイズの変更
Luxeritas282[3]
文字色の編集
Luxeritas284[3]
背景色と枠線色の編集
Luxeritas283[7]
背景とタイトルとロゴ画像挿入による編集
Luxeritas285[3]
パンくずリンクの配置変更と編集
Luxeritas287[7]
ヘッダーナビ(グローバルナビ)編集
Luxeritas288[3]
ヘッダー上の帯状メニュー編集
私の目次設定カスタマイズ解説ページへのリンクボタン画像
Luxeritasオリジナル目次の挿入とカスタマイズ

Luxeritas289[3]
マウスオンアニメーション

Posted by クチコミ探し