zabbix_log zabbixlogo替换

项目场景：
开发一个运维系统，需要内嵌zabbix，但是zabbix的logo太过于显眼，难于交付

问题描述：
起初想到要修改zabbix界面，那就得修改zabbix的源码咯，所以起初就往以源码的方式安装zabbix，但是本人没有php基础，并且在内网安装相应的环境，非常的麻烦，后来就想着在自己的互联网笔记本使用docker先安装好，直接搬镜像到内网就可了，最后折腾折腾着，原来直接改docker容器也可以实现的，不过修改后记得保存为新的镜像再重启，要不然容器被删除之后，里面的修改内容也就没有了。下面记录修改方法。

解决方案：
修改内容以及文件总览
修改内容 文件 所在路径
修改对应登录页面和登录后页面左上角的Logo icon-sprite.svg /usr/share/zabbix/assets/img/
浏览器页面title小图标 favicon.ico /usr/share/zabbix/
修改登录后页面右上角显示的文字 zabbix.conf.php /etc/zabbix/web/
修改页脚信息 CBrandHelper.php /usr/share/zabbix/include/classes/helpers/
调整登录后页面右上角的链接地址 layout.htmlpage.menu.php /usr/share/zabbix/app/views/
改后效果图

一.页面Logo修改
1.找到文件
涉及的文件：/usr/share/zabbix/assets/img/icon-sprite.svg

可以使用 find / -name icon-sprite.svg 查找到icon-sprite.svg所在的位置

2.使用Xtfp等工具把 icon-sprite.svg文件下载到本地
3.编辑Logo文件
可以使用在线SVG工具：https://c.runoob.com/more/svgeditor/进行编辑。
操作如下：
step1：浏览器访问在线SVG工具的地地址，打开icon-sprite.svg文件。

 

 

 

 

logo说明

step2：导入图片。
可以是图片格式，也可以是SVG格式的文件。建议先量一个两个图标的像素大小，导入的图片也提前转换成一样的像素大小。如果尺寸不对的话，还可以自由拖拽的。

 

 

 

step3：删除原有的图标，移动新图标到原来的位置

上面的图片的位置x：0，y：864
下面的图片的位置x：0，y：903
在移动新图标的时候可以在右侧直接输入位置
注意：保存svg文件前，需要把墨绿色的背景图片删除，要不然更新上去之后，原来的图标会出现墨绿色背景，如下图：

step4：保存图片。
保存图片，在线工具会自动将修改后的图片下载到本地。

4、使用Xtfp等工具将Logo文件替换Zabbix`

放到/usr/share/zabbix/assets/img/路径下。

因为我是在docker上运行的所以还要重启zabbix-web服务；

如果图标不能成功更新，还可以尝试删除浏览器缓存

快捷键ctrl+shift+del

二.更换小图标

1.找到 favicon.ico文件

/usr/share/zabbix/favicon.ico

 

 

 

2、确认图标文件像素大小
3、生成新图标文件
在线生成图标工具：https://www.bitbug.net/。

4、上传替换原来的文件即可
三、修改登录后的页面右侧显示文字

涉及的文件：/etc/zabbix/web/zabbix.conf.php
1
编辑文件[root@zabbix ~]# vi  /etc/zabbix/web/zabbix.conf.php
#找到下面内容（大约在17行）：
$ZBX_SERVER_NAME = 'zabbix server';
#替换成自定义内容：
$ZBX_SERVER_NAME = '运维系统';
四、修改页脚信息
/usr/share/zabbix/include/classes/helpers/CBrandHelper.php1.编辑文件
#vi /usr/share/zabbix/include/classes/helpers/CBrandHelper.php
# 找到如下内容（大约110行）： 
[
    $with_version ? 'Zabbix '.ZABBIX_VERSION.'. ' : null,
    '© '.ZABBIX_COPYRIGHT_FROM.'–'.ZABBIX_COPYRIGHT_TO.', ',
    (new CLink('Zabbix SIA', 'https://www.zabbix.com/'))
            ->addClass(ZBX_STYLE_GREY)
            ->addClass(ZBX_STYLE_LINK_ALT)
            ->setAttribute('target', '_blank')
]
# 替换成如下内容：
    [
         (new CLink('xxxx公司', '#'))
                 ->addClass(ZBX_STYLE_GREY)
                 ->addClass(ZBX_STYLE_LINK_ALT)
                 ->setAttribute('target', '_blank')
    ]五.删除页面右上角的链接
/usr/share/zabbix/app/views/layout.htmlpage.menu.php

1.编辑文件[root@zabbix ~]# vi /usr/share/zabbix/app/views/layout.htmlpage.menu.php
# 找到大约42-64行内容，将其注释：
/*                      ->addItem(CBrandHelper::isRebranded()
                                ? null
                                : (new CListItem(
                                        (new CLink(_('Support'), $data['support_url']))
 …此处省略一部分代码…
                                ->addClass(ZBX_STYLE_TOP_NAV_HELP)
                                ->setAttribute('target', '_blank')
                                ->setTitle(_('Help'))
                        )*/

由于直接是在docker上面修改的，也没有php基础，找这个文件着实困难

六.以iframe内嵌入自己的前端项目
我的是vue项目，iframe的使用不难，百度一下即可，内嵌zabbix会存在一个安全校验的问题；

找到 Zabbix 下面的 /usr/share/zabbix/include/defines.inc.php 文件，末尾有一行
define('X_FRAME_OPTIONS', 'SAMEORIGIN');
改为
define('X_FRAME_OPTIONS', null);