大鹏伏魔 狮子震吼

诸恶莫作,众善奉行,最胜菩提,解脱手印

峨眉山金顶

峨眉山金顶 第1张

[login]隐藏的内容

操作指南
CSS3+HTML5、扁平化、响应式设计、自定义颜色风格,不依赖任何前端框架。
正文具有二级、三级标题突出显示,四级标题作为文章目录索引,文章摘要、可选择4种文章形式,图片lightbox查看,视频lightbox播放,文章中插入图片幻灯,文字折叠开关,代码高亮、下载按钮、回复可见内容等功能。

文章形式

  • 主题支持标准、日志、图像、引用(软件)四种形式。编辑文章时:
  • 有缩略图的文章可以选择标准形式
  • 无缩略图的选择日志形式
  • 文字少图片多的日志可选择图像形式
  • 不同的文章形式,在文章列表页面,会显示不同的外观布局

文章编辑

主题集成了常用自定义栏目添加面板,自定义缩略图、文章描述、幻灯中的图片、设置为侧边推荐文章等都可以在此添加。

文章索引目录

自动将文章中的四级标题<h4>(选中章节文字,点击编辑器“段落”,选择“四级标题即可”)转化为文章索引目录,需要到主题选项中开启该功能。效果如本文。
当页面滚动到第3个四级标题时才会在屏幕左侧边缘显示目录索引,滚动到第2个四级标题时自动隐藏。

文章摘要

编辑文章时可以在编辑器下面的“摘要”面板中输入一段摘要内容,用于显示在正文顶部,并同时显示在文章列表中,有利于SEO,摘要控制在180字符以内,多出的部分会被截断。

默认回行段首自动空两格

按住上档键(shift)的同时,按回车键(Enter),则无空格。

图片lightbox查看

编辑文章插入图片时:

  1. 从URL插入(外链)必须选择链接到:图像URL;
  2. 本地上传,必须选择链接到:媒体文件
  3. 图片名称不能为中文汉字,否则不会启用图片lightbox查看。

点击图片查看图片lightbox效果 峨眉山金顶 第2张

图片超链接lightbox查看图片

另外,利用这个图片lightbox查看功能,可以只添加图片的链接而不用将图片添加到文章中,就可实现lightbox查看,可提高页面加载速度,又不影响图片浏览。
比如:图片1图片2图片3 这三张图片只添加了超链接,并没有添加到文章中,也不影响正常lightbox查看。

文章中插入图片幻灯

[img] 峨眉山金顶 第3张峨眉山金顶 第4张峨眉山金顶 第5张峨眉山金顶 第6张峨眉山金顶 第7张峨眉山金顶 第8张峨眉山金顶 第9张峨眉山金顶 第10张峨眉山金顶 第11张峨眉山金顶 第12张[/img]

回复可见

只有在本文留言后才能看见隐藏的内容
[reply]
看到这句,说明你已为本博客添加了一条留言[/reply]
只有留言评论者才能看见隐藏的内容

密码保护

通过添加短代码为文章部分文字加密,只有输入正确密码才能查看,测试密码:zmingcx
[password key=zmingcx]
如果您看到这句,说明您输入了正常的查看密码[/password]
通过添加短代码为文章部分文字加密,只有输入正确密码才能查看,测试密码:zmingcx

视频lightbox播放

[videos href=http://player.youku.com/embed/XMjM2OTE3ODg4]http://zmingcx.com/wp-content/uploads/2015/03/ladyd.jpg[/videos]
正常插入视频地址:

文字折叠隐藏及代码高亮

通过添加短代码隐藏部分文字内容
查看隐藏的内容[s]
[p]

  1. #tag_cloud-2 {
  2. position:relative;
  3. height:340px;
  4. margin: 10px auto 0;
  5. }
  6. #tag_cloud-2 a {
  7. position:absolute;
  8. color: #fff;
  9. text-align: center;
  10. text-overflow: ellipsis;
  11. whitewhite-space: nowrap;
  12. top:0px;
  13. left:0px;
  14. padding: 3px 5px;
  15. border: none;
  16. }
  17. #tag_cloud-2 a:hover {
  18. background: #d02f53;
  19. display: block;
  20. }
  21. #tag_cloud-2 a:nth-child(n) {
  22. background: #666;
  23. border-radius: 3px;
  24. display: inline-block;
  25. line-height: 18px;
  26. margin: 0 10px 15px 0;
  27. }
  28. #tag_cloud-2 a:nth-child(2n) {
  29. background: #d1a601;
  30. }
  31. #tag_cloud-2 a:nth-child(3n) {
  32. background: #286c4a;
  33. }
  34. #tag_cloud-2 a:nth-child(5n) {
  35. background: #518ab2;
  36. }
  37. #tag_cloud-2 a:nth-child(4n) {
  38. background: #c91d13;
  39. }

[/p]

下载按钮

主题集成短代码实现的下载按钮功能,编辑文章时,切换到文本编辑模式,点击编辑工具栏 的下载按钮或者下载链接(可自定义按钮名称),并在文章设置面板中输入下载弹窗中下载按钮名称及下载地址,添加一个下载按钮。
[file]
还可以在自定义栏目面板中输 入button2、button3、button4,并分别在值中输入按钮名称,同时再添加url2、url3、url4,在值中输入下载链接,添加总共 4个弹窗中的下载按钮。
无弹窗的链接按钮
[url href=http://pan.baidu.com/s/1jGiqJps]链接按钮[/url]

[/login]

降措 佛陀正法 2 3784 2016-05-28

发表评论

评论:

2 条评论,访客:2 条,博主:0 条