テーマは、コミュニティのブランドカラー、フォント、角丸、シャドウを、ライトモードとダークモードそれぞれに設定するものです。テーマを使って、ブランドの配色に合わせたり、メンバーにデフォルトでライトモードとダークモードのどちらを表示するかを選んだりできます。
対象者:オーナーと管理者。ライトモードかダークモードかは、メンバーが自分で選びます。 · 場所:ウェブ(管理画面)。メンバーはウェブと Mateflow アプリでモードを切り替えます。 · プラン:テーマと色にはプランによる制限はありません。カスタム CSS はプラットフォームプランによって異なります。
テーマページを開く
管理画面 → 外観 → テーマに移動します。ブランディングページのテーマでカラー&フォントを管理 → をクリックしても開けます。
- アクティブテーマには、現在メンバーに表示されているテーマが表示されます。ライブバッジが付いています。
- テーマライブラリには、ほかのテーマが一覧表示されます。検索したり、最近更新などで並べ替えたりできます。
- 上部のボタンは、App Theme、Settings、Add Theme です。
プリセットから新しいテーマを追加する
- Add Theme をクリックします。
- テーマ名を入力します(50 文字まで)。
- プリセットを選びます。プリセットを検索... またはカテゴリのフィルターで探せます。テーマは必ずプリセットから作成します。
- すぐに公開するには、すぐに公開にチェックを入れます。
- テーマを作成をクリックします。
既存のテーマをコピーする場合は、そのテーマの ⋯ メニューを開いてクローンをクリックし、新しいテーマ名を入力して、テーマを複製をクリックします。コピーには、ライトとダークの色、タイポグラフィ、余白、枠線、シャドウがすべて引き継がれます。
テーマの色とフォントを編集する
アクティブテーマのカスタマイズをクリックするか、ほかのテーマの ⋯ メニューを開いて編集をクリックします。エディターは、テーマを編集: とテーマ名のタイトルで開きます。
- カラーモードで、ライトまたはダークを選びます。モードごとに色が分かれているため、両方を設定してください。
- カラータブで、Background、Primary、Accent、Card、Sidebar などの色を設定します。各テキストカラーには、コントラスト比が表示されます。WCAG AA のコントラスト基準を満たさない色は、スマート調整をクリックすると修正できます。
- タイポグラフィタブで、フォントファミリーと文字間隔を選びます。
- その他タブで、角丸とシャドウを設定します。プラットフォームプランに含まれている場合は、カスタム CSS もここにあります。
- ライブプレビューを確認します。フィード、投稿、プロフィール、UI を切り替えたり、デスクトップ表示とモバイル表示を切り替えたりできます。
- 保存をクリックします。
アクティブテーマを保存すると、メンバーに表示される内容が変わります。変更を安全に試すには、ライブラリのテーマを編集し、準備ができてから公開してください。
テーマを公開する
テーマライブラリのテーマで公開をクリックします。そのテーマがアクティブテーマになり、それまでのテーマはライブラリに戻ります。公開できるテーマは一度に 1 つだけです。
公開中のテーマ以外は削除できます。テーマの ⋯ メニューを開いて削除をクリックし、確認します。削除は元に戻せません。
テーマを以前のバージョンに戻す
Mateflow は、テーマが編集、公開、復元されるたびにスナップショットを保存します。
- テーマの ⋯ メニューを開いて、履歴をクリックします。
- バージョン履歴で、戻したいバージョンを探して元に戻すをクリックします。
- 確認します。Mateflow はまず現在の状態を新しいスナップショットとして保存するため、元に戻す操作自体も取り消せます。
デフォルトのライトモード/ダークモードを設定する
デフォルトのモードは、自分でモードを選んでいないすべての人に適用されます。
- テーマページで Settings をクリックします。
- デフォルト外観で、ライト、ダーク、システム(自動) のいずれかを選びます。システム(自動)は、各自のデバイスの設定に従います。
- 設定を保存をクリックします。
メンバーがライトモードとダークモードを切り替える方法
メンバーは、いつでもあなたのデフォルト設定を上書きできます。
- ウェブ:アバターをクリックし、外観をクリックします(または設定 → 外観に移動します)。テーマで、コミュニティに合わせる、システム、ライト、ダークのいずれかを選びます。コミュニティに合わせるには、あなたがデフォルトに設定したモードが表示されます。
- アプリ:設定とプライバシー → 表示を開きます。テーマで、コミュニティに合わせる、システムに合わせる、ライト、ダークのいずれかを選びます。
メンバーが別のテーマを選ぶことはできません。公開中のテーマの色が、各メンバーの選んだモードで全員に適用されます。
Mateflow アプリに独自の色を設定する
デフォルトでは、Mateflow アプリは公開中のウェブテーマから取った色を使います。アプリだけ色を変えるには、次の手順に従います。
- テーマページで App Theme をクリックします。
- ライトまたはダークを選び、変更したい色を設定します。空欄のままの色には、アプリのデフォルトが使われます。Derive from web をクリックすると、ウェブテーマをもとにした下書きが入力されます。
- 保存をクリックします。
アプリ用の上書き設定は公開中のテーマと一緒に保存され、フォントはアプリ独自のものが使われます。アプリを再びウェブテーマに合わせるには、Clear override をクリックして確認します。
関連記事
このガイドは役に立ちましたか?