标志

🌐 Logos

Page summary:

通过扩展管理应用来更新登录和导航徽标。优先使用 SVG 以获得清晰的显示效果；如可能，请提供明/暗两种版本以增强对比度。

Strapi 的 管理面板 在登录屏幕和主导航中显示其品牌标识。更换这些图片可以让界面与你的身份保持一致。本页展示了如何通过管理面板配置覆盖这两个徽标文件。如果你更喜欢直接在 UI 中上传，请参见 自定义徽标。

🌐 Strapi's admin panel displays its branding on both the login screen and in the main navigation. Replacing these images allows you to match the interface to your identity. The present page shows how to override the two logo files via the admin panel configuration. If you prefer uploading them directly in the UI, see Customizing the logo.

Strapi 管理面板在 2 个不同位置显示徽标，由管理面板配置中的 2 个不同键表示：

🌐 The Strapi admin panel displays a logo in 2 different locations, represented by 2 different keys in the admin panel configuration: | 在用户界面中的位置 | 要更新的配置键 || --- | --- || 在登录页面 | config.auth.logo || 在主导航中 | config.menu.logo |

Note

通过管理面板上传的徽标将取代通过配置文件设置的任何徽标。

🌐 Logos uploaded via the admin panel supersede any logo set through the configuration files.

管理面板中的标志位置

🌐 Logos location in the admin panel

config.auth.logo 处理的徽标只显示在登录屏幕上：

🌐 The logo handled by config.auth.logo logo is only shown on the login screen:

config.menu.logo 处理的徽标位于管理员面板左上角的主导航中：

🌐 The logo handled by config.menu.logo logo is located in the main navigation at the top left corner of the admin panel:

更新标志

🌐 Updating logos

要更新徽标，请将图片文件放入 /src/admin/extensions 文件夹，在 src/admin/app 中导入这些文件，并按以下示例更新相应的键：

🌐 To update the logos, put image files in the /src/admin/extensions folder, import these files in src/admin/app and update the corresponding keys as in the following example:

JavaScript

/src/admin/app.js

import AuthLogo from "./extensions/my-auth-logo.png";
import MenuLogo from "./extensions/my-menu-logo.png";

export default {
  config: {
    // … other configuration properties 
    auth: { // Replace the Strapi logo in auth (login) views
      logo: AuthLogo,
    },
    menu: { // Replace the Strapi logo in the main navigation
      logo: MenuLogo,
    },
    // … other configuration properties 

  bootstrap() {},
};

TypeScript

/src/admin/app.ts

import AuthLogo from "./extensions/my-auth-logo.png";
import MenuLogo from "./extensions/my-menu-logo.png";

export default {
  config: {
    // … other configuration properties 
    auth: { // Replace the Strapi logo in auth (login) views
      logo: AuthLogo,
    },
    menu: { // Replace the Strapi logo in the main navigation
      logo: MenuLogo,
    },
    // … other configuration properties 

  bootstrap() {},
};

Note

通过配置文件设置的图片文件没有大小限制。

🌐 There is no size limit for image files set through the configuration files.