openstack二次开发：如何定制自己（企业）openstack图标、标题等内容

问题导读

1.如何修改dasboard网站颜色？
2.如何修改openstack dasboard网站标题？
3.如何定制自己的logo，及品牌连接？

本文定制包含以下内容：

网站颜色

Logo

网站标题

站点品牌链接

帮助连接

Logo和网站颜色

1.创建两个logo文件，png格式，具有透明背景，使用以下大小：

登录屏幕：365 x 50
登录横幅： 216 x 35

2.上传图片到下列位置

/usr/share/openstack-dashboard/openstack_dashboard/static/dashboard/img/

3.创建css样式，在下面目录

/usr/share/openstack-dashboard/openstack_dashboard/static/dashboard/css/

4.创建css样式，在下面目录

更该颜色和文件名，下面是定制css样式例子

[mw_shl_code=css,true]/*
* New theme colors for dashboard that override the defaults:
* dark blue: #355796 / rgb(53, 87, 150)
* light blue: #BAD3E1 / rgb(186, 211, 225)
*
* By Preston Lee <plee@tgen.org>
*/
h1.brand {
background: #355796 repeat-x top left;
border-bottom: 2px solid #BAD3E1;
}
h1.brand a {
background: url(../img/my_cloud_logo_small.png) top left no-repeat;
}
#splash .login {
background: #355796 url(../img/my_cloud_logo_medium.png) no-repeat center 35px;
}
#splash .login .modal-header {
border-top: 1px solid #BAD3E1;
}
.btn-primary {
background-image: none !important;
background-color: #355796 !important;
border: none !important;
box-shadow: none;
}
.btn-primary:hover,
.btn-primary:active {
border: none;
box-shadow: none;
background-color: #BAD3E1 !important;
text-decoration: none;
}[/mw_shl_code]

5.选择编辑html模板

/usr/share/openstack-dashboard/openstack_dashboard/templates/_stylesheets.html

6.添加一行包括您的新创建的样式表。例如 custom.css文件
[mw_shl_code=css,true]...
<link href='{{ STATIC_URL }}bootstrap/css/bootstrap.min.css' media='screen' rel='stylesheet' />
<link href='{{ STATIC_URL }}dashboard/css/{% choose_css %}' media='screen' rel='stylesheet' />
<link href='{{ STATIC_URL }}dashboard/css/custom.css' media='screen' rel='stylesheet' />
...[/mw_shl_code]

7.重启Apache

Ubuntu
[mw_shl_code=bash,true]service apache2 restart[/mw_shl_code]

Fedora, RHEL, CentOS
[mw_shl_code=bash,true]service httpd restart[/mw_shl_code]

openSUSE
[mw_shl_code=bash,true]service apache2 restart[/mw_shl_code]

8.重启Apache查看效果，查看修改

网站标题

在浏览器顶部，在 local_settings.py添加下面一行
[mw_shl_code=bash,true]SITE_BRANDING = "Example, Inc. Cloud"[/mw_shl_code]

重启Apache查看效果

站点品牌链接

logo可以作为品牌连接，默认连接到 horizon:user_home，如系那个改变在 local_settings.py中添加下面一行
[mw_shl_code=bash,true]SITE_BRANDING_LINK = "http://www.aboutyun.com"[/mw_shl_code]

重启Apache查看效果

帮助连接

1.默认帮助连接指向http://docs.openstack.org.在 local_settings.py中改成自己定制连接
[mw_shl_code=bash,true]'help_url': "http://www.aboutyun.com",[/mw_shl_code]

重启Apache查看效果