コミュニティの見た目をブランドに合わせましょう。ブランディングページでは、ロゴ、ファビコン、アプリアイコンをアップロードし、コミュニティがシェアされたときに表示される画像を設定し、サインインページに背景を追加します。ブランドカラーとフォントはテーマで設定します。
対象者：オーナーと管理者。 · 場所：ウェブ（管理画面）。 · プラン：ロゴとアイコンにはプランによる制限はありません。Mateflow のブランド表示を消す機能（ホワイトラベル）は、プラットフォームプランによって異なります。
ブランディングページを開く
管理画面 → 外観 → ブランディングに移動します。画面が広い場合は、右側のライブプレビューに、サイドバー＆フィード、ブラウザタブ、アプリアイコン、ソーシャルシェアカード、認証ページでの画像の見え方が、ライトモードとダークモードで表示されます。
Save Changes をクリックするまで、メンバーには何も反映されません。Reset Changes は保存していない編集を破棄します。保存していない変更がある状態でページを離れようとすると、Mateflow から確認が表示されます。
ナビゲーションでのロゴの表示方法を選ぶ
ナビゲーションヘッダーで、表示スタイルを選びます。
- ワードマーク：横長のロゴです。高さはナビゲーション表示サイズで、小、中、大から設定します。
- アイコン＋名前：正方形のロゴをコミュニティ名と並べて表示します。
- アイコンのみ：正方形のロゴだけを表示します。
スタイルに必要なロゴがない場合、Mateflow は代わりの表示を使います。たとえば、メインロゴがない状態でワードマークを選ぶと、正方形のロゴとコミュニティ名が表示されます。
メインロゴをアップロードする
メインロゴで、ライトモードロゴ（明るい背景用の、暗い色の文字やアイコン）とダークモードロゴ（暗い背景用の、明るい色の文字やアイコン）をアップロードします。これらはナビゲーションとサインインページに表示されます。
透明な背景のシンプルなワードマークを使い、縦横比は約 3:1～5:1 の横長にしてください（例：400×100px）。小さく表示されるため、写真や細かいデザインは避けてください。アップロードできるのは、10 MB までの JPG、PNG、GIF、WebP ファイルです。SVG ファイルには対応していません。
ロゴがまだない場合は、テキストから生成をクリックすると、コミュニティ名からロゴを作成できます。フォント、ウェイト、ケース、文字間隔、ライトモードのテキストカラーを選び、正方形アイコンやファビコンも必要なら正方形アイコンも生成とファビコンも生成にチェックを入れます。生成して適用をクリックしてから、Save Changes をクリックします。
ファビコンと正方形のアプリアイコンを追加する
アプリアイコン＆ファビコンには、次の項目があります。
- スクエアロゴ（ライト） とスクエアロゴ（ダーク）：1:1 の画像で、サイズは 256×256px です。モバイルのヘッダー、コミュニティをホーム画面に追加したとき、横長のロゴがない場合のサイドバーで使われます。
- ファビコン：ブラウザのタブに表示される小さなアイコンです。32×32px の ICO、PNG、WebP ファイルを使ってください。
ソーシャルシェア画像を設定する
ソーシャルシェアで、OG画像（Open Graph 画像）をアップロードします。推奨サイズは 1200×630px です。Facebook、X、LinkedIn などでコミュニティへのリンクがシェアされたときに、デフォルトのプレビュー画像として表示されます。
サインインページに背景画像を追加する
認証ページ背景で、認証背景画像をアップロードします。この画像は、サインイン、サインアップ、パスワードの再設定、二要素認証のページのサイドパネルに表示されます。短辺が 1080px 以上の縦長の画像を、JPG、PNG、WebP 形式、2 MB 以下で用意してください。空欄のままにすると、デフォルトの暗い背景が使われます。
ブランディング画像を差し替える・削除する
アップロードした画像にカーソルを合わせると、2 つのボタンが表示されます。アップロードボタンは画像を差し替え、ゴミ箱ボタンは画像を削除します。そのあと Save Changes をクリックします。削除した画像は、保存するまでメンバーには表示されたままです。
ブランドカラーとフォントを変更する
ブランドカラーとフォントは、ブランディングページではなくテーマで設定します。ブランディングページの上部にあるテーマでカラー＆フォントを管理 → をクリックするか、管理画面 → 外観 → テーマに移動します。色はライトモードとダークモードで別々に設定できます。テーマとダークモードを選ぶを参照してください。
ホワイトラベルのコミュニティでモバイルアプリを表示する
プラットフォームプランで Mateflow のブランド表示を消している（ホワイトラベル）場合、モバイルアプリには Mateflow の名前が入っているため、アプリのダウンロードページ、メニューのリンク、インストールの案内はメンバーに表示されません。表示するには、ブランディングページのモバイルアプリカードでメンバーにモバイルアプリを表示するをオンにします。このスイッチは Save Changes を押さなくても、すぐに保存されます。メンバーは App Store と Google Play で、Mateflow という名前のアプリを見つけられます。
関連記事
このガイドは役に立ちましたか？