ヘッダーのメニュー文言を変更する

カスタムプランでは、TUNAGに会社のカラーを反映できる『カスタムテーマ機能』と、自社オリジナルのサンクスカードを実現できる『カスタムサンクス機能』の2つをセットでご利用いただけます。

『カスタムテーマ』では、画面上部のヘッダー部分にて、ロゴやカラーを自由に変更することが可能です。

__________2023-02-28_10.46.41.png

設定の手順

ヘッダーに表示されるメニューの文言と文字色を変更することができます。

 

1. 「カスタム」→「カスタムテーマ」から、ヘッダーの文言設定欄を開く

スクリーンショット 2024-07-18 11.53.19.png

 

2. 「カスタムカラーを追加」ボタンをクリックし、メニュー文言の文字色を設定する

fae0c49d-d4a8-4e9d-89ae-35e28e7554dd-1920x610r.png

カラーコード、もしくはRGB値を指定することで、色を設定することができます。

616e1915-7c07-417d-8b6b-9bf30f4e3f60-1920x651r.png

 

3. 文言の「編集」ボタンをクリックし、メニュー文言の内容を設定する

「編集」ボタンから、文言編集フォームを開きます。
文字数の制限があり、全角6文字以内または半角12文字以内で入力してください。

e7dd87ac-1f70-4f94-bffe-09af9c410e5d-1920x610r.png

 

「決定する」ボタンを押すとプレビューに反映されます。

43ae92a8-b9cf-4cb3-9981-40371c6296c0-1920x635r.png

 

4. プレビューを確認して、TUNAGに反映する

TUNAGへの反映を行う前に、プレビューを確認することができます。
プレビューを確認後、「TUNAGに反映する」ボタンを押すと、設定がTUNAGに反映されます。

※「TUNAGに反映する」ボタンを押さずにページを離れた場合、設定中の情報は破棄されます。

スクリーンショット 2024-07-18 11.45.22.png

スクリーンショット 2024-07-18 11.44.17.png

そのほかの変更も合わせて実施する場合はこちら

ヘッダーのロゴを変更する
ヘッダーの背景色を変更する

 

運用のポイント

カラーコードとは?

正確な色を表現するために、アルファベットや数字の形式で表したものです。
コーポレートサイトなどで使用されている色をそのまま使いたい場合には、Google Chromeの拡張機能を用いて、表示された色のカラーコードを調べることができます。

ColorPick Eyedropper
https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg

 

おすすめの配色

背景と文字の色を選ぶ際は、明るさの違いがはっきりした組み合わせにすると見やすいデザインにできます。

  • 背景が濃い色の場合→テキストは薄い色
  • 背景が薄い色の場合→テキストは濃い色

また、非常に鮮やかな色同士を組み合わせると、文字が見づらい画面になってしまう場合があるためご注意ください。

 

6367543e-25ce-418d-b7e4-17d0125ce84c-1920x1080r.png

 

------------------------------------------------------------------------------------
※本機能は有料のオプション機能となります。ご利用にはお申し込みが必要となります。
※ご利用料金については、弊社担当までお問い合わせください。

 

この記事は役に立ちましたか?

0人中0人がこの記事が役に立ったと言っています

他にご質問がございましたら、リクエストを送信してください