1. 前言
wiki是在公司里最常用的工具之一，本文总结记录一些wiki使用技巧，希望对大家也有一些帮助。
2. 标题自动编号
2.1. 背景
给文档标题手动添加编号很麻烦，而且容易写错。如果插入或删除章节，后面的编号都要重新修改一遍，无法接受。
2.2. 目的
实现wiki标题自动编号。
2.3. 原理
通过wiki的markdown插件，可以插入一些自定义的css/js，来自定义页面内容。
参考文档：MarkDown标题自动添加编号。
2.4. 方法
1、插入，其他宏，markdown。
2、markdown中填入如下css代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
| <style type="text/css">
#main-content { counter-reset: h1counter; }
#main-content h1 { counter-reset: h2counter; }
#main-content h2 { counter-reset: h3counter; }
#main-content h3 { counter-reset: h4counter; }
#main-content h4 { counter-reset: h5counter; }
#main-content h5 { counter-reset: h6counter; }
#main-content h6 { }
#main-content h1:before {
counter-increment: h1counter;
content: counter(h1counter) ".\0000a0\0000a0";
}
#main-content h2:before {
counter-increment: h2counter;
content: counter(h1counter) "."
counter(h2counter) ".\0000a0\0000a0";
}
#main-content h3:before {
counter-increment: h3counter;
content: counter(h1counter) "."
counter(h2counter) "."
counter(h3counter) ".\0000a0\0000a0";
}
#main-content h4:before {
counter-increment: h4counter;
content: counter(h1counter) "."
counter(h2counter) "."
counter(h3counter) "."
counter(h4counter) ".\0000a0\0000a0";
}
#main-content h5:before {
counter-increment: h5counter;
content: counter(h1counter) "."
counter(h2counter) "."
counter(h3counter) "."
counter(h4counter) "."
counter(h5counter) ".\0000a0\0000a0";
}
#main-content h6:before {
counter-increment: h6counter;
content: counter(h1counter) "."
counter(h2counter) "."
counter(h3counter) "."
counter(h4counter) "."
counter(h5counter) "."
counter(h6counter) ".\0000a0\0000a0";
}
</style>
|
保存后，即可看到标题编号后的效果。
3、目录
在插入目录宏时，通过css加的编号效果在目录中不会显示，勾选 “显示节数” 即可自动编号。
3. 浮动目录
3.1. 背景
wiki 的标题无浮动功能，对于大文档阅读体验不佳。
3.2. 目的
通过自定义css/js，达到浮动目录的效果，提高长文档的阅读体验。
3.3. 原理
通过wiki的markdown插件，可以插入一些自定义的css/js，来自定义页面内容。
3.4. 方法
1、页面布局，修改为两列
一列放内容，另外一列放目录。
2、插入目录宏，CSS类名填入 floating_catalog
3、插入，其他宏，markdown，填入如下内容：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
| <style type="text/css">
.floating_catalog {
position: fixed;
background-color: #FFF;
background: #FFF;
margin-top: -80px;
font-size: 12px;
z-index:100;
}
.current_catalog {
font-size: 14px;
font-weight: bolder;
background-color: yellow;
}
</style>
<script type="text/javascript">
function updateCatalog(){
var catalog = $('.floating_catalog a');
var isFirst = true;
for (var i = catalog.length - 1; i >= 0; --i) {
var header = $(decodeURIComponent(catalog[i].hash).replace(/([ ;?%&,.+*~\':"!^$[\]()=>|\/@])/g,'\\$1'));
if (isFirst && (i == 0 || (!(header === null) && header[0].getBoundingClientRect().top < 20))) {
catalog[i].parentElement.classList.add('current_catalog');
isFirst = false;
}
else {
catalog[i].parentElement.classList.remove('current_catalog');
}
}
}
$(document).ready(updateCatalog);
$(document).scroll(updateCatalog);
</script>
|
保存后，即可看到浮动标题的效果。
4. 引用页面
4.1. 背景
工作内容通常会放在公共wiki，个人工作内容无法很好汇总。
wiki的收藏功能不能分层级，不是很好用。
4.2. 目的
创建引用页面，即：
创建一个页面，本身没有内容，但是会将其他页面内容引用过来，进行展示。
可以方便个人信息汇总，创建多层级页面收藏等。
4.3. 原理
通过wiki的markdown插件，可以插入一些自定义的css/js，来自定义页面内容。
4.4. 方法
1、新建wiki，标题随意
2、插入，其他宏，markdown，填入如下内容：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
| <script type="text/javascript">
function setupPage(sourcePage) {
$('.page-metadata-modification-info').append(' | 当前页面是其他页面的引用，无法导出pdf/work，如需导出请点击<a class="like-button" href="' + sourcePage + '">【阅读原文】</a>');
$('#main-content').append($('<iframe id="frame_load_other_page" style="display:none" width="100%" height="100%" src="' + sourcePage + '"></iframe>'));
var frame_load_other_page = $('#frame_load_other_page');
frame_load_other_page.on("load", function() {
setTimeout(function(){
main_content = $('#main-content', frame_load_other_page.contents()).html();
$('#main-content').append(main_content);
frame_load_other_page.remove();
$('div[id^=expander-control-]').click(function(event){
let item = $("#" + event.currentTarget.id.replace('control', 'content'));
item.css('display', item.css('display') == 'none' ? 'inline' : 'none');
});
$('.gliffy-chrome-container').css("display", "none");
}, 100);
});
}
$(document).ready(function(){
setupPage("http://wiki.baidu.com/pages/viewpage.action?pageId={PAGE_ID}");
});
</script>
|
其中，{PAGE_ID} 需要替换成引用的wiki页面的url。
保存后，即可看到引用效果。
