我正在运行strapi 项目,需要更改strapi 登录屏幕徽标。我已经在 plugins > user-permissions > admin > src > assets > images > logo_strapi.png 中替换了 logo 并运行命令 npm run setup --plugins 但之后它没有加载内容类型数据它只是给我加载器而已
7 回答
您可以在路径中覆盖的徽标 ->./admin/admin/src/assets/images/logo-strapi.png
记住通过npm run build
命令重建项目
AdminUI 包源可以在
./node_modules/strapi-admin/src/
.例如,要更改左上角显示的管理面板的颜色,
./node_modules/strapi-admin/admin/src/components/LeftMenuHeader/styles.scss
应该./admin/src/components/LeftMenuHeader/styles.scss
用您自己的样式覆盖。因此,您正在替换通常位于其中的文件并将
node_modules/strapi-admin/admin/src
它们定向到admin/src/some/file/path
.要应用您的更改,您需要重建您的管理面板
npm run build
资源
由于这个问题有点老了......在当前版本的Strapi (V4)中,更改左侧菜单的图标有点不同(所提供的解决方案已使用 4.0.6 进行了测试)。他的解决方案也适用于更改登录屏幕上的徽标和图标...
在您的项目中,在其中创建一个extension
文件夹./yourProjectName/src/admin/
,您可以放置一个新图像,该图像应该是您的新菜单徽标,即“new-menu-logo.png”
此外,在其中创建一个app.js
文件./yourProjectName/src/admin/
,然后在其中导入扩展文件夹的图像。例子:
// path: ./yourProjectName/src/admin/app.js
import AuthLogo from './extensions/my-new-logo.png';
import MenuLogo from './extensions/new-menu-logo.png';
// import favicon from './extensions/favicon.ico';
export default {
config: {
// Replace the Strapi logo in auth (login) views
auth: {
logo: AuthLogo,
},
// Replace the favicon
// head: {
// favicon: favicon,
// },
// Add a new locale, other than 'en'
locales: ['fr', 'de'],
// Replace the Strapi logo in the main navigation
menu: {
logo: MenuLogo,
},
// Override or extend the theme
theme: {
colors: {
alternative100: '#f6ecfc',
alternative200: '#e0c1f4',
alternative500: '#ac73e6',
alternative600: '#9736e8',
alternative700: '#8312d1',
danger700: '#b72b1a'
},
},
// Extend the translations
translations: {
fr: {
'Auth.form.email.label': 'test',
Users: 'Utilisateurs',
City: 'CITY (FRENCH)',
// Customize the label of the Content Manager table.
Id: 'ID french',
},
},
// Disable video tutorials
tutorials: false,
// Disable notifications about new Strapi releases
notifications: { release: false },
},
bootstrap() {},
};
最后用 ie 重建 AdminUIyarn build
根据文档https://strapi.io/documentation/developer-docs/latest/development/admin-customization.html#customization-options,您可以修改(徽标和css)。这是通过在项目文件夹中写入文件夹和文件来完成的。这些文件将覆盖节点模块的文件。
因此,对于徽标,yourProjectName
您可以在此路径中创建一个文件 ->./yourProjectName/admin/src/assets/images/logo-strapi.png
这个文件应该覆盖最初的strapi logo。
记住通过npm run build
命令重建项目
根据 Strapi 的文档,要更改左上角显示的管理面板的徽标,请将您的自定义图像添加到../admin/src/assets/images/logo-strapi.png
.
如果这些文件夹不存在,您必须创建这些文件夹../admin/src/assets/images/
以覆盖管理员的现有样式。
我对 Strapi 很陌生,我正在寻找如何实现这一目标。根据文档,您需要更改图像./node_modules/strapi-admin/admin/src/assets/images/logo-strapi.png
并运行构建管理面板npm run setup
由于这个问题现在已经有一年多了,可能会让一些初学者感到困惑,我想我会回答我是如何改变它的。这个答案使用yarn
(请注意,上述答案的核心保持不变)
假设您的项目名称是 my-project,导航到my-project/node_modules/strapi-admin/admin/src/assets/images
您将找到一个名为 logo-strapi.png 的文件(将有另一个文件名几乎相似的文件,请确保其为 - 而不是 _ )并将其替换为您想要的徽标。旧标志的大约尺寸为 1100 像素 x 300 像素,因此请确保您的新标志也具有相似的尺寸。
完成后,导航回 my-project 目录并终止所有正在运行的 Strapi 实例。如果您在 Windows 上,请确保关闭所有可能打开项目的任何子文件夹的文件资源管理器窗口,并最好关闭管理面板的任何打开的浏览器选项卡(如果有任何打开的实例,它可能会给出错误在重建时)。
现在运行yarn build
并在它完成构建后,根据需要以生产或开发模式启动您的strapi实例yarn start
或yarn develop
您需要在 ./plugins/users-permissions/admin/src/assets/images/logo_strapi.png 更改图像。
高温高压