Begin主题正文功能演示Hot

知更鸟 2015年2月22日16:39:498015.1K112
摘要

正文具有二级、三级标题突出显示,四级标题作为文章目录索引,文章摘要、可选择4种文章形式,图片lightbox查看,视频lightbox播放,文章中插入图片幻灯,文字折叠开关,下载按钮、回复可见内容等功能。

Begin主题,CSS3+HTML5、扁平化、响应式设计、自定义颜色风格,不依赖任何前端框架。

正文具有二级、三级标题突出显示,四级标题作为文章目录索引,文章摘要、可选择4种文章形式,图片lightbox查看,视频lightbox播放,文章中插入图片幻灯,文字折叠开关,代码高亮、下载按钮、回复可见内容等功能。

文章形式

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

文章编辑

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

WP自带相册

WordPress自带相册样式演示

文章索引目录

自动将文章中的四级标题<h4>(选中章节文字,点击编辑器“段落”,选择“四级标题即可”)转化为文章索引目录,需要到主题选项中开启该功能。效果如本文。

当页面滚动到第3个四级标题时才会在屏幕左侧边缘显示目录索引,滚动到第2个四级标题时自动隐藏。

文章摘要

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

默认回行段首自动空两格

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

图片lightbox查看

编辑文章插入图片时:

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

点击图片查看图片lightbox效果

Begin主题正文功能演示

图片超链接lightbox查看图片

另外,利用这个图片lightbox查看功能,可以只添加图片的链接而不用将图片添加到文章中,就可实现lightbox查看,可提高页面加载速度,又不影响图片浏览。

比如:图片1图片2图片3

这三张图片只添加了超链接,并没有添加到文章中,也不影响正常lightbox查看。

文章中插入图片幻灯

Begin主题正文功能演示Begin主题正文功能演示Begin主题正文功能演示Begin主题正文功能演示Begin主题正文功能演示Begin主题正文功能演示Begin主题正文功能演示Begin主题正文功能演示Begin主题正文功能演示Begin主题正文功能演示

回复可见

只有在本文留言后才能看见隐藏的内容

此处为隐藏的内容!
发表评论并刷新,方可查看

只有留言评论者才能看见隐藏的内容

密码保护

通过添加短代码为文章部分文字加密,只有输入正确密码才能查看,测试密码:zmingcx

输入密码查看隐藏内容:

通过添加短代码为文章部分文字加密,只有输入正确密码才能查看,测试密码:zmingcx

插入视频

 

文字折叠隐藏及代码高亮

通过添加短代码隐藏部分文字内容

查看隐藏的内容

展开收缩

  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. }

下载按钮

主题集成短代码实现的下载按钮功能,编辑文章时,切换到文本编辑模式,点击编辑工具栏 的下载按钮或者下载链接(可自定义按钮名称),并在文章设置面板中输入下载弹窗中下载按钮名称及下载地址,添加一个下载按钮。

还可以在自定义栏目面板中输 入button2、button3、button4,并分别在值中输入按钮名称,同时再添加url2、url3、url4,在值中输入下载链接,添加总共 4个弹窗中的下载按钮。

无弹窗的链接按钮

文件下载
Begin主题正文功能演示
weinxin
版权声明
本站原创文章转载请注明文章出处
Begin主题正式发布! 原创主题

Begin主题正式发布!

  距Begin主题 1.8版,时隔三个多月,Begin主题 2.0 版正式发布,虽然中间也有多个版本推出,但都没有发文。 如果你第一时启用新版主题,可能并不能感觉到有什么明显变化,这里就介...
响应式设计为什么要求缩略图比例尺寸相同 Web前端

响应式设计为什么要求缩略图比例尺寸相同

响应式主题模板目前大行其道,最大的好处就是一套模板能够兼容多个终端,而无需为不同的终端做特定的主题模板,个人认为这是未来移动互联网浏览最佳解决方案,而不是将网站转化成APP,没人喜...
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

评论:80   其中:访客  77   博主  3
    • 残缺无法完美
      残缺无法完美 0

      真是太喜欢你的主题了,功能十分强大,界面也非常美观,现在还买不起只能每天来看看,等我有能力一定要买下来!

      • 醉兔
        醉兔 0

        :mrgreen: :mrgreen: :mrgreen: :mrgreen: :mrgreen: 嘿嘿

        • Aron
          Aron 0

          非常喜欢

          • 关于鸟哥主题 一些 阅读体验方面建议
            关于鸟哥主题 一些 阅读体验方面建议 1

            1.移动端前面“最新”文章列表,或者博客布局首页文章列表,建议在标题下面 阅读,评论 前面加上 发布时间,以纯数字形式显示:“2015-10-01”,时间二字就不用写了。

            我觉得像现在手机阅读成习惯,手机文章列表时间显示是非常重要的。

            2.置顶幻灯片,建议移动端 在图片上部 也要显示 文章标题
            现在电脑端图片上是可以显示文章标题的。

            3.移动端文章页的文章标题,当标题较长时,在手机上显示两行时,两行应该距离缩近一些,目前空开太多,

            再如果显示居中会不会更好?

            4.关于文章页布局:

            这个主题应该说风格独树一帜,很有个性,很漂亮。

            但是我觉得有些东西还是应该尊重现在主流访客浏览习惯,在这方面不一定非要创新。

            特别是文章页面布局,我看了一些大型新闻站点,

            像腾讯、站长网,一般文章页布局都是这样:一个面包屑导航,下在就是显目的标题,文章标题字不一定要加粗,但是要居中,如果标题一行写不下,写到第二行,两行之前不要离开太多。在标题下面:小字显示 日期:2015-09-30,分类:kkk,阅读(),评论 等。

            然后就是正文,

            正文结束 点赞加分享,再一行加上文章标签等等。

            案例:
            http://www.chinaz.com/news/2015/1005/453713.shtml

            我觉得这是目前主流媒体都这样布局,之所以不创新,因为这是多年来最符合访客阅读习惯,最省力的布局。同时也非常大气。

            建议鸟哥也这样布局。

            鸟哥目前文章页这样布局,总给人以一种凌乱感。

            因为访客习惯肯定是先看标题,再看文章,余光看一下发表时间等信息。目前布局一上来就看 评论数,阅读数,有些唐突。

            5.鸟哥你的官网文章底部 分享按钮按了后,再微信分享怎么按了没反应?

            =——上面这些访问体验如果能得到解决,我觉得就挺完美,那样我会果断买主题了。目前还在观望,我觉得上面1-4点关于用户访问体验方面意见太重要了。上接关系访问来网站看文章轻不轻松,体验是不是好。

            总得来说,我觉得主题风格创新是很重要的,但是与访问相关的一些自然习惯却是要尊重的,这些却不能创新。鸟哥应该多看看一些大型网站这方面情况,他们这样做肯定是有一些道理。

              • 知更鸟
                知更鸟

                @ 关于鸟哥主题 一些 阅读体验方面建议 你的建议,大部分是你的个人的喜好,就像win8,大部分人都不习惯,但又有很多人很喜欢
                就拿这个文章发表时间,很多人会刻意隐藏这个,因为博客很少更新,不想让人看见…..

                  • 小撒拉
                    小撒拉 2

                    @ 知更鸟 鸟哥 你有没有注意到,每次发表表情的时候,看起来是大的,实际出来的效果,还是受制于文字的大小。就变的很小很小了,根本看不清楚。就像前两楼的效果。
                    求解决!!!

                • 关于鸟哥主题 一些 阅读体验方面建议
                  关于鸟哥主题 一些 阅读体验方面建议 1

                  鸟哥主题在大的博客布局方面,一些细节方面都做得很好。
                  但是对于文章阅读习惯,还有移动端阅读体验,文章列表方面把握还是有些欠缺。

                  网站,首要功能就是给 来访者 阅读文章,这应该要符合访客的一些多年形成的稳定的习惯,这好重要。关系到一个主题友好不友好。

                  • 很不错哎
                    很不错哎 0

                    很不错,下载来看看

                    • 阿荣Aron
                      阿荣Aron 0

                      不错长见识了

                      • 暗室逢灯
                        暗室逢灯 0

                        • 明天
                          明天 0

                          分享点了没反应。点开后分享不了。 :?:

                          • 我爱一根柴
                            我爱一根柴 0

                            试试回复可见

                            • 9523
                              9523 0

                              看看是什么情况 :?:

                              • 硬霸楠哥
                                硬霸楠哥 1

                                没什么事情,就是为了情怀专门进网站赞一下,知更鸟确实很不错

                                • 东方时尚
                                  东方时尚 0

                                  知更鸟确实很不错

                                  • 二大跌
                                    二大跌 0

                                    我来试一试

                                    • dongn
                                      dongn 3

                                      只想看看效果

                                      • 短信运营者
                                        短信运营者 1

                                        测试评论功能

                                        • 成人港湾
                                          成人港湾 0

                                          只想看看效果

                                          • 热门电影
                                            热门电影 0

                                            博主的这个主题真不错,非常喜欢。

                                            • 本来清净
                                              本来清净 1

                                              想了解一下。

                                              • 部分的改变
                                                部分的改变 0

                                                获得查看密码

                                                • 小小默
                                                  小小默 0

                                                  鸟哥,你的回复可见可以在这个分类里看到,代码都看的到哟,算不算bug

                                                  • usmedium
                                                    usmedium 2

                                                    我想查看一下上面的内容。

                                                    • YounG
                                                      YounG 0

                                                      测试回复可见

                                                      • 匆匆如流水
                                                        匆匆如流水 0

                                                        真心学习@

                                                        • 转手绘
                                                          转手绘 0

                                                          测试回复可见

                                                          • 包子
                                                            包子 0

                                                            试试!!11

                                                            • 紫杉小白龙
                                                              紫杉小白龙 0

                                                              查看!!!

                                                              • Jay
                                                                Jay 0

                                                                好的主题

                                                                • 囧笑话
                                                                  囧笑话 0

                                                                  试试功能

                                                                  • 学习
                                                                    学习 0

                                                                    谢谢了亲

                                                                    • 俊霖
                                                                      俊霖 0

                                                                      喜欢这个主题

                                                                      • 无为客
                                                                        无为客 1

                                                                        一直在看主题,功能还是不错的,打算使用

                                                                        • 无为客
                                                                          无为客 1

                                                                          整体挺漂亮的,实用。后台用户中心页面不能自适应设备,尤其我的文章,那个表格不好看,不能看,挤在一起 :cool:

                                                                          • 李兰y
                                                                            李兰y 0

                                                                            哈哈哈哈 我要看看!!!

                                                                            • ces
                                                                              ces 0

                                                                              测试

                                                                              • 老虎
                                                                                老虎 0

                                                                                不错,试试看看!~

                                                                                • shunzi
                                                                                  shunzi 1

                                                                                  测试评论功能

                                                                                  • q
                                                                                    q 1

                                                                                    非常好 的主题,看看

                                                                                    • 大老虎
                                                                                      大老虎 1

                                                                                      测试评论功能

                                                                                      • 至于
                                                                                        至于 0

                                                                                        风格整体看起来很凌乱,虽然功能较多,但是界面调理真的不是很清晰,作者应该是个技术控,对界面把握还是欠缺火候,看上面别人留言提到修改意见,作者却总是拿这拿那怎样怎样。不愿意吸取精华,心塞!

                                                                                          • 知更鸟
                                                                                            知更鸟

                                                                                            @ 至于 主题各功能模块都可开启或者关闭,出售的是我的设计作品,并不是为个人定制的主题,个人喜好不同,不可能满足所有人的需求,好的建议自然会听取,至于个人的喜好,只能定制了

                                                                                          • Byrd
                                                                                            Byrd 1

                                                                                            我只是看看而已

                                                                                            • 泡沫Sugar
                                                                                              泡沫Sugar 0

                                                                                              鸟哥主题牛B

                                                                                              • 个个
                                                                                                个个 1

                                                                                                很棒啊

                                                                                                • 主旨
                                                                                                  主旨 1

                                                                                                  保持更新

                                                                                                  • 主旨
                                                                                                    主旨 1

                                                                                                    试试 [img]http://www.99lishi.cn/wp-content/uploads/2016/05/001.jpg[/img]

                                                                                                    • 111111
                                                                                                      111111 0

                                                                                                      顶顶顶顶v

                                                                                                      • Xx丶IT
                                                                                                        Xx丶IT 0

                                                                                                        学习了,感谢鸟哥的分享

                                                                                                        • 随之长风
                                                                                                          随之长风 1

                                                                                                          不错的主题。

                                                                                                          • 内涵客栈
                                                                                                            内涵客栈 1

                                                                                                            真的太强大了,这主题

                                                                                                            • 好的
                                                                                                              好的 0

                                                                                                              看看,不错

                                                                                                              • sq
                                                                                                                sq 0

                                                                                                                • 号都没喝过
                                                                                                                  号都没喝过 1

                                                                                                                  好东西

                                                                                                                  • 勇PAN高峰
                                                                                                                    勇PAN高峰 0

                                                                                                                    好东西

                                                                                                                    • sam
                                                                                                                      sam 0

                                                                                                                      矮油、、非常感谢楼主的分享!支持…

                                                                                                                      • 小铃铛
                                                                                                                        小铃铛 0

                                                                                                                        看看,学学

                                                                                                                        • 白河岸边
                                                                                                                          白河岸边 0

                                                                                                                          很漂亮的主题

                                                                                                                            • ℡愛國々飯團,安之若素...
                                                                                                                              ℡愛國々飯團,安之若素... 1

                                                                                                                              @ 白河岸边 测试下回复哦…

                                                                                                                            • alex1111
                                                                                                                              alex1111 0

                                                                                                                              棒棒的

                                                                                                                              • honeypotato
                                                                                                                                honeypotato 0

                                                                                                                                非常喜欢这个主题

                                                                                                                                • 伊凡
                                                                                                                                  伊凡 1

                                                                                                                                  不错,试试看

                                                                                                                                  • Leo
                                                                                                                                    Leo 0

                                                                                                                                    要看

                                                                                                                                    • mengkun
                                                                                                                                      mengkun 1

                                                                                                                                      代码高亮功能有个很严重的BUG,比如说高亮这个php代码……
                                                                                                                                      if(empty($GET_[‘a’])):
                                                                                                                                      http://v2.freep.cn/3tb_161229191628s4oe512293.png

                                                                                                                                      • 东方大厦
                                                                                                                                        东方大厦 1

                                                                                                                                        此次v

                                                                                                                                        • 明月登楼的博客
                                                                                                                                          明月登楼的博客 5

                                                                                                                                          不错,赞一个先!

                                                                                                                                          • sywb0596
                                                                                                                                            sywb0596 0

                                                                                                                                            看看 貌似很不错的样子

                                                                                                                                            • 45641
                                                                                                                                              45641 0

                                                                                                                                              卖主题的那个QQ什么时候能够上线给回复呀!

                                                                                                                                              • leezorg
                                                                                                                                                leezorg 0

                                                                                                                                                看一下。学习一下。

                                                                                                                                                • wang
                                                                                                                                                  wang 0

                                                                                                                                                  看看~~~~~~

                                                                                                                                                  • Distance
                                                                                                                                                    Distance 1

                                                                                                                                                    真不错呀

                                                                                                                                                    • 啦啦测试
                                                                                                                                                      啦啦测试 0

                                                                                                                                                      厉害

                                                                                                                                                      • 测试一下
                                                                                                                                                        测试一下 0

                                                                                                                                                        支持鸟哥

                                                                                                                                                        • 好的
                                                                                                                                                          好的 0

                                                                                                                                                          感谢分享

                                                                                                                                                          • nemoxy
                                                                                                                                                            nemoxy 0

                                                                                                                                                            怎么使用回复可见,一直找不到,很想学习

                                                                                                                                                            • itbcx中文
                                                                                                                                                              itbcx中文 0

                                                                                                                                                              看看

                                                                                                                                                              • bug小能手
                                                                                                                                                                bug小能手 0

                                                                                                                                                                请问博主怎么添加外链跳转,另外夜间模式能自定义时间开启吗,比如在晚上8点到6自动启用夜间模式

                                                                                                                                                                  • 知更鸟
                                                                                                                                                                    知更鸟

                                                                                                                                                                    @ bug小能手 外链跳转百度搜一堆方法
                                                                                                                                                                    夜间模式对正常浏览者没有任何P用,主题有这个玩意只是为了彰显功能多而已