您可以使用CSS,方便地自定义帮助中心的外观和风格。此库克书旨在帮助您使帮助中心看起来是您想要的方式。
要访问并编辑 Guide 中的CSS,请查阅 自定义CSS或JavaScript。
如果你是新的CSS,或者有点脏,看看以下教程,使您能加快速度:
您也可以使用帮助中心模板化语言或JavaScript自定义帮助中心的外观:
内容表
库克书被组织到一个帮助中心元素的组别中。每个组别都包含CSS代码,您可以直接粘贴到主题的样式表中。使用代码为,或编辑,使其成为您自己的。
库克书不是肉食书。通过修改HTML模板和CSS样式表,您可以进行的数量仅受到想象中的限制。
搜索
知识库文章
页首和页脚
页首根据主题和用户角色显示一个徽标和其它组件。您可以使用页脚显示相关链接、关于您公司的信息,或法律通知。
返回 内容表。
更改页首或页脚的背景颜色
更改或添加以下选择器中的 背景颜色 属性。
头:
.header {
background-color: #666;
}
页脚:
.footer {
background-color: #333;
}
更改页首或页脚的高度
更改或添加以下选择器中的 高度 属性。
头:
.header {
height: 70px;
}
页脚:
.footer {
height: 20px;
}
更改页首或页首以下的空间
在以下选择器中更改或添加利润 底部 和 顶部 属性。
头:
.header {
margin-bottom: 20px;
}
页脚:
.footer {
margin-top: 10px;
}
更改已选择语言的外观
添加以下选择器和属性:
.language-selector .dropdown-toggle {
color: green;
}
更改提交请求链接的外观
添加以下选择器并修改文本属性:
.submit-a-request {
font-size: 14px;
color: green;
}
隐藏提交请求链接
修改以下选择器:
.submit-a-request {
display:none;
}
更改登录链接的外观
在以下选择器中添加或修改文本属性:
.login {
font-size: 14px;
color: green;
}
更改徽标尺寸
尽管建议的徽标图像大小为 200px,但如果需要的话,您可以覆盖此默认。
要更改徽标大小
- 在 Guide 中,单击侧栏中自定义设计图标 ()。
- 单击 编辑主题。
- 单击 CSS 打开CSS样式表,然后搜索以下规则:
.logo img { max-height: 37px; }
要搜索,单击代码编辑器内部,按“控制+F(Windows)或 Cmd+F(Mac)。
- 修改“.徽标 img”选择器中的 高度 属性,以匹配图像的高度。
- 单击保存。
搜索
更改搜索字段的宽度或高度
更改以下选择器中的 宽度 或 高度 值。
大型搜索框:
.search input[type=search] {
height: 50px;
width: 90%;
}
小搜索框:
.search-small input[type=search] {
height: 50px;
width: 320px;
}
更改搜索字段的背景颜色
更改以下选择器中的 后台 属性。
大型搜索框:
.search input[type=search] {
background: #999;
}
小搜索框:
.search-small input[type=search] {
background: #999;
}
更改搜索文本的外观
在以下选择器中更改或添加文本属性。
大型搜索框:
.search {
font-size: 12px;
font-family: Tahoma, Arial, sans-serif;
}
小搜索框:
.search-small {
font-size: 12px;
font-family: Tahoma, Arial, sans-serif;
}
更改结果页面标题的外观
搜索结果页面上的标题包括搜索词返回的结果数量。例如:“序列号”的 9 条结果。
如果不在样式表中,则添加以下选择器,并更改或添加文本属性:
.search-results-heading {
font-size: 36px;
font-family: Tahoma, Arial, sans-serif;
}
更改搜索结果关键字突出显示的外观
搜索结果中的突出显示术语用内嵌元素<em 包装>在 .搜索结果描述集装箱下。如果您想有突出显示的突出显示以黄色背景显示,那么您将进行以下操作:
.search-result-description em {
font-weight: bold;
background-color: #FFF3CA;
padding: 0px 3px 2px;
border-radius: 3px;
}
更改知识库和社区标题的外观
在以下选择器中添加或修改文本属性:
.search-results-subheading {
font-size: 24px;
font-family: Tahoma, Arial, sans-serif;
}
更改结果之间的条
在以下选择器中添加一个 利润底部 属性:
.search-result {
margin-bottom: 20px;
}
更改结果文本的外观
在以下选择器中更改或添加文本属性:
.search-result {
font-size: 105%;
font-family: Arial, Helvetica, sans-serif;
}
更改结果链接的颜色
在以下选择器中添加或修改 颜色 属性:
.search-result a {
color: #484;
}
面包 屑
更改上面和下面的宽度
在以下选择器中添加或更改 填充 属性:
.breadcrumbs {
padding-top; 20px;
padding-bottom: 16px;
}
改变条文本的外观
在以下选择器中更改或添加文本属性:
.breadcrumbs li {
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
}
更改面条条链接的颜色
添加以下选择器和属性:
.breadcrumbs li a {
color: #484;
}
更改条指针字符(>)
更改以下选择器中的 颜色 和 内容 属性:
.breadcrumbs li + li:before {
color: #158EC2;
content: ">>";
}
文章列表
根据主题,文章列表可用于主页、类别着陆页,以及组别的着陆页。
返回 内容表。
更改文章列表周围的空间
添加或修改以下选择器和 填充 属性:
.article-list {
padding-left: 16px;
padding-right; 20px;
}
改变文章之间的差距
在以下选择器中更改 边缘 属性:
.article-list > li {
margin-bottom: 10px;
}
更改文章链接的外观
在以下选择器中更改或添加文本属性:
.article-list > li {
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
}
更改文章链接的颜色
添加以下选择器和属性:
.article-list li a {
color: #FFF;
}
知识库文章
您可以更改知识库中文章的外观和感觉。
返回 内容表。
更改文章标题的外观
添加或修改以下选择器和属性:
.article-header h1 {
color: #993;
font-family: Verdana, Geneva, sans-serif;
font-size: 20px;
}
更改文章文本的外观
添加或修改以下选择器和属性:
.article-body {
color: #666;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
}
更改文章链接的颜色
添加或修改以下选择器和属性:
.article-body a {
color: #930;
}
更改作者名称的外观
添加或修改以下选择器和属性:
.article-author a {
color: #669;
font-family: Georgia, Times New Roman, serif;
font-size: 16px;
}
更改最后更新字符串的外观
添加或修改以下选择器和属性:
.article-updated {
color: #CCC;
font-family: Tahoma, Geneva, sans-serif;
font-size: 13px;
}
更改“这篇文章有帮助吗?”
添加或修改以下选择器和属性:
.article-votes-question {
color: #763;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
}
更改投票计数器的外观
例如:“6 分之 8 发现这个有帮助”。添加或修改以下选择器和属性:
.article-vote-label {
font-family: Georgia, Times New Roman, serif;
font-size: 10px;
}
更改“有更多疑问”的外观?提交请求”
添加或修改以下选择器和属性:
.article-more-questions {
font-family: Arial, Helvetica, sans-serif;
font-size: 105%;
}
更改评论标题的外观
添加或修改以下选择器和属性:
.article-comments h2 {
color: #666;
font-family: Georgia, Times New Roman, serif;
font-size: 130%;
}
更改评论文本的外观
添加或修改以下选择器和属性:
.comment-body {
color: #666;
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
}
社区问题和答案
您可以更改社区中内容的外观和感觉。
返回 内容表。
更改问题标题的外观
添加或修改以下选择器和属性:
.question-title {
color: #484;
font-family: Verdana, Geneva, sans-serif;
font-size: 120%;
}
更改问题文本的外观
添加或修改以下选择器和属性:
.question-text {
color: #666;
font-family: Tahoma, Geneva, sans-serif;
font-size: 14px;
}
更改问题链接的颜色
添加或修改以下选择器和属性:
.question-text a {
color: #484;
}
更改问题作者名称的外观
添加或修改以下选择器和属性:
.question-author {
font-family: Georgia, Times New Roman, serif;
font-size: 12px;
}
要更改链接颜色,添加或修改以下选择器和属性:
.question-author a {
color: #484;
}
由于问题作者的姓名,自问题发布以来的时间,共享链接通常按页面分组,因此要使所有三个元素的外观相同,这具有良好的设计意义。要做到这一点,请使用以下综合选择器:
.question-author, .question-published, .question-share {
font-family: Georgia, Times New Roman, serif;
font-size: 12px;
}
更改自问题发布以来的时间外观
添加或修改以下选择器和属性:
.question-published {
font-family: Georgia, Times New Roman, serif;
font-size: 12px;
}
更改共享问题链接的外观
添加或修改以下选择器和属性:
.question-share {
font-family: Georgia, Times New Roman, serif;
font-size: 12px;
}
更改答案标题的外观
添加或修改以下选择器和属性:
.answer-list-heading {
color: #4CC;
font-family: Verdana, Geneva, sans-serif;
font-size: 105%;
}
更改答案文本的外观
添加或修改以下选择器和属性:
.answer-text {
color: #333;
font-family: Tahoma, Geneva, sans-serif;
font-size: 105%;
}
更改答案作者名称的外观
添加或修改以下选择器和属性:
.answer-author {
font-family: Georgia, Times New Roman, serif;
font-size: 12px;
}
要更改链接颜色,添加或修改以下选择器和属性:
.answer-author a {
color: #484;
}
由于答案作者的姓名,自答案发布以来的时间,共享链接通常按页面分组,因此使所有三个元素都看起来相同,这具有良好的设计意义。要做到这一点,请使用以下综合选择器:
.answer-author, .answer-published, .answer-share {
font-family: Georgia, Times New Roman, serif;
font-size: 12px;
}
更改自回复发布以来的时间外观
添加或修改以下选择器和属性:
.answer-published {
font-family: Georgia, Times New Roman, serif;
font-size: 12px;
}
更改共享答案链接的外观
添加或修改以下选择器和属性:
.answer-share {
font-family: Georgia, Times New Roman, serif;
font-size: 12px;
}
翻译免责声明:本文章使用自动翻译软件翻译,以便您了解基本内容。 我们已采取合理措施提供准确翻译,但不保证翻译准确性
如对翻译准确性有任何疑问,请以文章的英语版本为准。