イラスト素材始めました by webmo

LIONMEDIAカスタマイズ 超基本編3 デザインスキン設定

LIONMEDIAカスタマイズ 超基本編3 デザインスキン設定

 

こんにちは、NATSUMI(@webmomotaro)です。

LION MEDIAでサイトデザインをガラっと変えられるカスタマイズがデザインスキン設定です。1分で終わる設定なので早速始めましょう。

デザインスキン設定

ここでは、サイトのテーマカラーを簡単に変更することができます。最初はオレンジ×ブラックの設定になっています。

ライオンメディア デザインスキン設定

ベースデザインを選択

DARKLIGHTの2種類から選べます。ここを変えるだけでも雰囲気が大きく変わります。最初はDARKになっているのでLIGHTに変更してみました。

ベースカラー設定

ほんのりリッチなデザインに仕上げるというチェックボックスがありますが、私には違いが分かりませんでした・・・。

テーマカラーを選択

ヘッダー、カテゴリー名、注目キーワード、ウィジットタイトルなどの色が対象です。最初のオレンジからターコイズブルーに変更してみました。

色を選択をクリックするとカラーパレットが表示されるので好みの色を探しながら設定しても良いですが、色の16進数(#11c6baの部分)でも指定ができるので、こちらのほうが確実で早いです。

カラーコード表

▲16進数が一覧で確認でき、コピーできるのでチェックしてみましょう。

テーマカラー設定

カテゴリ用ユーザー定義カラーを選択

カテゴリごとにタブの色を変更することができます。試しにユーザー定義カラー01をピンク色にしてみましょう。

カテゴリ定義カラー設定

一度公開で保存を行い、カスタマイズページから離れます。

投稿のカテゴリへ移動

投稿 > カテゴリー に移動して、登録済みのカテゴリ名を選択します。

カテゴリ設定

イメージカラーのプルダウンを開くと、先ほどピンク色を設定したユーザー定義カラー01があるので指定します。

ユーザー定義カラー

プレビュー確認

カラー設定プレビュー

記事サムネイルの上に掲載されているカテゴリ名の色が指定した色に変更されていればOK。同様に全てのカテゴリカラーを変更してユーザーが使いやすいサイトを目指しましょう。

画像では分かりやすくピンクにしましたが、同系色のほうが無難です。

また、色には一定のイメージがあるので、イメージにあった色使いをすることで居心地の良いサイトづくりに繋がりますよ。

色のイメージを使いこなすツール / カラーイメージスケールTOYOINK

サイトカラーが変わると印象が大きく変わりますね。あなたのサイトテーマにあったカラー設定を行ってみて下さい。

LIONMEDIAのカスタマイズシリーズ更新中です。

LION MEDIA カスタマイズ超基本編

LION MEDIA カスタマイズ 超基本2 基本機能設定

LIONMEDIAカスタマイズ 超基本編3 デザインスキン設定(この記事)

LIONMEDIAカスタマイズ 投稿スキン設定で見出しデザインを簡単変更

 

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

Twitter でwebmoをフォローしよう!

ホームページ作成カテゴリの最新記事