ブックのデザインをカスタマイズする

管理画面の「デザイン設定」で簡単にデザインの変更が可能です。

【カスタマイズ可能な設定一覧】クリックするとそれぞれの見出しに移動します。

01. ブランドロゴの変更
02. アイコンカラーの変更(白 / 黒)
03. リンクカラーの変更
04. リンクカラーの不透明度の変更
05. リンクフェードアウト時間
06. メニューカラーとハイライトカラー

ver.別 設定可能一覧 ver.5 ver.4.5 ver.3
ブランドロゴの変更
アイコンカラーの変更 変更不可
リンクカラーの変更
リンクカラーの不透明度の変更 変更不可
リンクフェードアウト時間 変更不可 変更不可
メニューカラーとハイライトカラー 変更不可
デバイス別 設定可能一覧 PC/タブレット横 スマートフォン/タブレット縦
ブランドロゴの変更 対象外
アイコンカラーの変更 対象外
リンクカラーの変更
リンクカラーの不透明度の変更
リンクフェードアウト時間
メニューカラーとハイライトカラー 対象外
(ハイライトカラー:◯)

01. ブランドロゴの変更

ロゴを変更することができます。初期設定は「5」ebook5のロゴになっています。
brand_logo

ロゴ画像の変更(オリジナルロゴへの変更)
・リンク先のURLを設定することも可能です。
・ロゴ画像を変更しないとリンク先URLは設定できません。
・変更した画像は「ファビコン」に反映されます。(ブラウザタブに表示)

ロゴの非表示
・ロゴを非表示にしてもファビコンは「ebook5」のロゴが表示されます。
リセット(初期設定に戻す)
オリジナルロゴに使用する画像について
・対応画像は「JPG」「GIF」「PNG」になりなります。
・サイズは最大長辺100pxにリサイズされます。
・100px以上で縦横比が等しい正方形で作成されることをおすすめいたします。
・縦横比が異なっていると閲覧環境によってはぼやけて表示される可能性があります。

 
※ver.3は変更不可です。
※スマートフォン/タブレット縦(Portraitモード)は対象外です。

02. アイコンカラーの変更(白 / 黒)

アイコンカラーを(White / Black)の2種類から選択することができます。
icons

メニュー部分の背景色(ベース)となる「メニューカラー」に合わせて選択してください。

 
※ver.3は変更不可です。
※スマートフォン/タブレット縦(Portraitモード)は対象外です。

03. リンクカラーの変更

リンクカラーを変更することができます。

link_color

・カラーコード、またはカラーピッカーから色を選択してください。
・初期設定の色に戻したい時は「空白」にして保存してください。

04. リンクカラーの不透明度の変更

リンクカラーの不透明度を変更することができます。

画像の設定はリンクカラー:#ffffff(白)不透明度:60%

初期設定は0%(透明)になっていますので、ページを開くとリンクカラーは表示された後に透明になります。
不透明度の数字を上げることで、リンク箇所の表示を明確に表示することができます。
数字が上がる=透明度が下がる=リンク箇所が明確になるということです。

 
※ver.3は変更不可です。

05. リンクフェードアウト時間

リンク箇所のフェードアウトする時間を変更することができます。
フェードアウト時間:2秒

フェードアウト時間:1秒

フェードアウト時間:0秒

初期設定は2秒になっています。
リンク箇所が2秒カラー表示されてから、透明(不透明度に設定した値)になります。
秒数を下げることで、リンク箇所の強調を抑えて表示することができます。

 
※ver.3とveer.4.5は変更不可です。

06. メニューカラーとハイライトカラー

メニュー部分の背景色(ベース)となる「メニューカラー」とアイコン等の「ハイライトカラー」を変更することができます。
オリジナルカラー

・カラーコード、またはカラーピッカーから色を選択してください。
・初期設定の色に戻したい時は「空白」にして保存してください。

 
※ver.3は変更不可です。


▼参考リンク
ベースカラーとハイライトカラーの詳細設定はこちらをご参照ください。
【デザイン設定】メニューベースカラーとハイライトカラーの適用範囲
ブック最新バージョン「ver.5」の機能はこちらをご参照ください。
ビューア ver.5の新機能のご紹介

Tagged: