说明

本次样式是基于 Jenkins ver. 2.235.1 写的,所有对于之前的版本可能样式不兼容,好像变化挺大的。个人测试了在用的 Jenkins ver. 2.190.1,完全不行,所有建议想要使用的安装最新版本的 Jenkins。

当然,这个项目给就是给大家一个思路,这个页面可以长这样子,你只需要照抄就能重新根据自己版本设计属于你自己的 Jenkins 主题。

配置说明

1. 更换 Logo

我这里使用的 war 包,所以很好找到他的目录结构:在解压出来的 Jenkins 目录中:

配置标题和名称:

2. 安装 Jenkins 插件

配置主题需要插件:Simple Theme Plugin

具体配置方式可以参考我的博客:

https://www.cnblogs.com/Dy1an/p/10696849.html

3. 粘贴 CSS

代码如下:

*{font-size:12px !important;letter-spacing:1px;font-weight:normal !important;border-radius:0 !important;color:#333333;}body{margin:;padding:;background-color:#F2F2F2;}a{color:#333333 !important;text-decoration:none !important;}a:link{text-decoration:none !important;color:#333333 !important;}a:visited{text-decoration:none !important;color:#333333 !important;}a:hover{text-decoration:none !important;color:#009688 !important;}a:active{text-decoration:none !important;color:#333333 !important;}a:focus{text-decoration:none !important;color:#333333 !important;}.page-header{position:fixed;height:50px;line-height:50px;top:;width:100%;background-color:white;z-index:;}#header .logo{width:300px !important;background-color:#20222A;margin-left:;padding:0 15px;}#jenkins-head-icon{width:30px;height:30px;}#jenkins-name-icon{height:30px;}#searchform{height:30px;}.searchbox{position:absolute;left:300px;padding:0 20px;}#search-box.main-search__input{padding:2px 5px 2px 30px;margin:;line-height:30px;border:none;}#search-box.main-search__input:focus{border:none;outline:none;}.main-search__icon-leading{height:30px;width:30px;padding:4px;}.main-search__icon-trailing{display:none;}.page-header__hyperlinks A{padding:0 10px;}.page-header__hyperlinks .svg-icon{display:none;}.page-header__hyperlinks A:hover,.page-header__hyperlinks A:focus,.page-header__hyperlinks A.mouseIsOverMenuSelector{background:none;}#visible-am-container.visible #visible-am-button{background:none;}#breadcrumbs{height:30px !important;line-height:30px !important;min-height:30px !important;}#breadcrumbs LI{height:30px !important;line-height:30px !important;min-height:30px !important;}#breadcrumbs LI A{height:30px !important;line-height:30px !important;min-height:30px !important;}.breadcrumbs__wrapper{line-height:30px !important;min-height:30px !important;background-color:white !important;position:fixed;top:50px;left:;right:;padding:0 20px 0 320px !important;border-top:1px solid #eeeeee;border-bottom:1px solid #eeeeee;}.top-sticker-inner{border:none;}#side-panel{background-color:#20222A;position:fixed;top:50px;bottom:;left:;padding:30px 0;z-index:;}body.two-column #side-panel{width:300px;}#tasks{width:300px;margin-bottom:;}#tasks .task{margin-bottom:;max-width:300px;padding:0 15px;line-height:40px;display:block;}#tasks .task:hover{background-color:#009688;cursor:pointer;}#tasks .task *{letter-spacing:2px !important;color:#ffffff !important;}#tasks .task .task-link{height:40px;line-height:40px;}#side-panel .container-fluid{margin:20px 15px;}#side-panel .pane-header{padding:5px !important;}#side-panel td.pane{padding:5px;}#side-panel td{float:left;color:#ffffff;}#side-panel #tasks .task-icon-link{display:none;}#description{display:none;}body.two-column #main-panel{margin-left:310px;}#main-panel{position:relative;top:80px;left:;right:;background-color:#ffffff;margin:10px;padding:15px;}#main-panel > h1{height:50px !important;line-height:20px !important;font-size:14px !important;letter-spacing:2px;margin:-15px -15px 10px -15px;padding:15px;border-bottom:1px solid #f2f2f2;}h1{margin:15px 0;}#main-panel .call-to-action{width:100%;margin:15px 0;padding:10px 10px;background-color:#F2F2F2;border-left:4px solid #009688;}.col-md-offset-2{margin:;padding:;}.col-md-20{width:100%;}.container{margin:;padding:0 290px;width:100%;}.h3{font-weight:bolder !important;font-size:19px !important;}.j-item-options .icon-xlg{height:48px !important;width:48px !important;}#add-item-panel .icon:before{background:none;}#add-item-panel .icon{border:none;background:none;}h1 img{height:20px !important;line-height:20px !important;width:20px !important;}.tabBar .tab:first-child{margin-left:;}.manage-option .icon{width:40px;height:40px;}.manage-option dl{min-height:40px;}.manage-option dl dt{font-size:14px;height:40px;line-height:40px;}.manage-option dl dd{display:none;}#main-panel h2{border-left:4px solid #009688;padding-left:10px;height:35px;line-height:35px;background-color:#f2f2f2;margin:20px 0;}.yui-button button,input[type="button"],input[type="reset"],input[type="submit"],a.yui-button:link,a.yui-button:visited{border:1px solid !important;padding:3px 1rem !important;min-height:28px !important;margin-left:0 !important;}.section-header{margin-top:20px !important;font-weight:bold !important;font-size:14px !important;}table,td,th,form,input,textarea,select{font-size:12px !important;text-align:left !important;}.manage-page__category:not(:last-child){margin-bottom:15px;}.setting-input{padding:5px 15px;}input:focus{outline:none !important;}.hidden-password-legend > svg{height:20px;}.icon-xlg{width:20px !important;height:20px !important;margin-right:10px;}.icon-lg{width:20px !important;height:20px !important;}.icon-md{width:20px !important;height:20px !important;}.icon-sm{height:12px;width:12px;}.build-row{background-color:#20222A !important;}.build-row a{color:#ffffff !important;}#buildHistory td{width:100%;}#buildHistory td:hover{background-color:#20222A !important;}#buildHistory a:hover{background-color:#20222A !important;}.pane-footer{display:none;}.build-row.model-link-active{background:#20222A !important;}td{vertical-align:middle !important;}.page-headline{max-width:100% !important;}#projectstatus th{padding:5px;}.bigtable td{padding:5px;}.permalinks-list{padding-left:20px;}.permalink-item{margin:5px 15px;}#filter-container{margin-left:0 !important;}.plugin-manager__icon-leading{padding:5px !important;}a.yui-button.primary{color:#fff !important;}footer{display:none;}

当然,最新的代码可以参考我的 GITHUB:

https://github.com/KU4NG/jenkins-theme-v2

不定期修复显示  BUG!

4.效果预览:

主页效果:

设置界面:

设置详情:

构建历史:

人很忙,样式不定期更新,如果喜欢,可以博客园推荐,也可以 GITHUB star!

Jenkins 主题:jenkins-theme-v2的更多相关文章

  1. [原]jenkins(五)---jenkins添加项目

    /** * lihaibo * 文章内容都是根据自己工作情况实践得出. http://www.cnblogs.com/horizonli/p/5332258.html 版权声明:本博客欢迎转发,但请保 ...

  2. Jenkins系列-Jenkins介绍与部署

    Jenkins是什么? Jenkins是一个功能强大的应用程序,允许持续集成和持续交付项目,无论用的是什么平台.这是一个免费的源代码,可以处理任何类型的构建或持续集成.集成Jenkins可以用于一些测 ...

  3. CD 基金会、Jenkins、Jenkins X、Spinnaker 和 Tekton 的常问问题

    转载:https://mp.weixin.qq.com/s/bQLqGrCM9NZYI0Njlu4N-w FAQ 什么是持续交付(CD)? CD是一种软件工程方法,团队在短周期内生成软件,确保软件可以 ...

  4. Yii2创建多界面主题(Theme)

    Yii2界面主题上的设计总体上和Yii1.x保持一致,区别在于两个地方: 1. 由于Yii2引入了独立的视图(View)类,因此界面主题(Theme)也交由视图来管理: 2. 视图文件和Web资源在目 ...

  5. 【Jenkins】jenkins简单搭建并执行任务

    part 1  jenkins用户名的配置(gerrit 2.11) #安装jenkins $ sudo apt-get install jenkins #为jenkins用户设定密码 $ sudo ...

  6. Jenkins 解决Jenkins下java无法运行slave-agent jnlp程序连接Windows Slave主机

    解决Jenkins下java无法运行slave-agent jnlp程序连接Windows Slave主机   by:授客 QQ:1033553122 测试环境 java下载地址:http://www ...

  7. [原]Jenkins(二)---jenkins之Git+maven+jdk+tomcat

    /** * lihaibo * 文章内容都是根据自己工作情况实践得出. *版权声明:本博客欢迎转发,但请保留原作者信息! http://www.cnblogs.com/horizonli/p/5331 ...

  8. [原]Jenkins(三)---Jenkins初始配置和插件配置

    /** * lihaibo * 文章内容都是根据自己工作情况实践得出. *版权声明:本博客欢迎转发,但请保留原作者信息! http://www.cnblogs.com/horizonli/p/5331 ...

  9. [原]Jenkins(四)---Jenkins添加密钥对

    /** * lihaibo * 文章内容都是根据自己工作情况实践得出. *版权声明:本博客欢迎转发,但请保留原作者信息! http://www.cnblogs.com/horizonli/p/5332 ...

随机推荐

  1. css3 属性阴影效果--box-shadow,text-shadow

    1.text-shadow:h-shadow v-shadow blur color; h-shadow:水平阴影的位置,可以是负值,正值向右,负值向左 v-shadow:水平阴影的位置,可以是负值, ...

  2. Java实现 蓝桥杯 历届试题 核桃的数量

    历届试题 核桃的数量 时间限制:1.0s 内存限制:256.0MB 问题描述 小张是软件项目经理,他带领3个开发组.工期紧,今天都在加班呢.为鼓舞士气,小张打算给每个组发一袋核桃(据传言能补脑).他的 ...

  3. Java实现 蓝桥杯 算法训练 谁干的好事?

    试题 算法训练 谁干的好事? 资源限制 时间限制:1.0s 内存限制:256.0MB 问题描述 ABCDE中num个人做了好事,truth个人说真话. A说:"我和X中有且只有一个做了好事& ...

  4. Java实现 LeetCode 89 格雷编码

    89. 格雷编码 格雷编码是一个二进制数字系统,在该系统中,两个连续的数值仅有一个位数的差异. 给定一个代表编码总位数的非负整数 n,打印其格雷编码序列.格雷编码序列必须以 0 开头. 示例 1: 输 ...

  5. 使用Python爬取网页的相关内容(图片,文字,链接等等)

    代码解释的很详细了,有不明白的欢迎评论 ~~~滑稽 import requests from bs4 import BeautifulSoup # #获取图片 输入网址 req=requests.ge ...

  6. java实现拉丁方块填数字

    "数独"是当下炙手可热的智力游戏.一般认为它的起源是"拉丁方块",是大数学家欧拉于1783年发明的. 如图[1.jpg]所示:6x6的小格被分为6个部分(图中用 ...

  7. .NET Core Session源码探究

    前言     随着互联网的兴起,技术的整体架构设计思路有了质的提升,曾经Web开发必不可少的内置对象Session已经被慢慢的遗弃.主要原因有两点,一是Session依赖Cookie存放Session ...

  8. UBoot配置编译及Makefile分析

    一. UBoot配置编译初步分析 1. UBoot源码结构 (1)UBoot工程项目中的文件可以分为3类 ① 第1类目录:与处理器体系结构或开发板硬件直接相关 ② 第2类目录:一些通用的函数或驱动程序 ...

  9. react后台管理系统路由方案及react-router原理解析

        最近做了一个后台管理系统主体框架是基于React进行开发的,因此系统的路由管理,选用了react-router(4.3.1)插件进行路由页面的管理配置. 实现原理剖析 1.hash的方式   ...

  10. 在Asp.NET Core中如何优雅的管理用户机密数据

    在Asp.NET Core中如何优雅的管理用户机密数据 背景 回顾 在软件开发过程中,使用配置文件来管理某些对应用程序运行中需要使用的参数是常见的作法.在早期VB/VB.NET时代,经常使用.ini文 ...