howiefh.github.io - Landscape-F

hexo优化及主题Landscape-F | 净土

Howiefh.github.io Spined HTML

hexo优化及主题Landscape-F | 净土 净土 乐不在外而在心，心以为乐，则是境皆乐；心以为苦，则无境不苦。 Home Archives  2014-04-20 Hexo hexo优化及主题Landscape-F Contents 1. 安装指南1.1. 安装1.2. 启用1.3. 更新2. 配置指南2.1. 侧边栏3. 优化总结3.1. 返回顶部按钮3.2. 在侧边栏和文章中显示文章目录3.3. 多说评论3.4. 百度分享3.5. 友情链接3.6. 日历3.7. 顶部添加github链接3.8. 默认分享工具添加微博和人人3.9. 改变侧栏样式3.10. 调整头部高度和判断banner-url是否为空3.11. 调整侧边栏样式3.12. 修改article title样式3.13. 文章底部添加更新时间3.14. 添加语言文件3.15. 修改滚动条样式3.16. 添加不蒜子统计访问量4. 其它4.1. 图床4.2. 404页面4.3. hexo文档5. 修改记录 自从去年装好Hexo后就没有更新过，直到最近才把Hexo从1.1.3更新到了2.5.2。发现有了不少的变化，插件比过去多了，还有了新的默认主题，文档也比过去更详细了。但是默认主题有一些我需要的东西还没有，比如文章目录、返回顶部按钮、多说评论，百度分享等等。在网上找了不少Hexo主题，最后还是觉得默认主题比较不错，还有一个Pacman感觉也挺好的。于是就在Landscape基础上主要参考Pacman对默认主题进行了一些优化，这样我的主题Landscape-F就诞生了。 安装指南安装1$ git clone https://github.com/howiefh/hexo-theme-landscape-f.git themes/landscape-f Landscape-F需要安装Hexo 2.4 或以上版本 启用修改你的博客根目录下的_config.yml配置文件中的theme属性，将其设置为landscape-f。 更新升级前最好先备份原来的_config.yml 文件 12cd themes/landscape-fgit pull 配置指南下面是本主题的配置文件内容，你也可以更改source/css/_variables.styl中的一些配色或图片，对主题进行微调。 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475# Headermenu: Home: / Archives: /archivesrss: /atom.xmlgithub: https://github.com/howiefh# Contentexcerpt_link: Read Morefancybox: true# Sidebarsidebar: rightwidgets:- about_me- category- tag- tagcloud- archive- calendar- recent_posts- duoshuo_recent_comments- links# exhibit widgets at the marrow of alphabetize pages (pagination == 2)index_widgets:# - category# - tagcloud# - archive# widget behaviorarchive_type: 'monthly'show_count: true# Miscellaneousgoogle_analytics:baidu_tongji:favicon: /favicon.icotwitter:google_plus:fb_admins:fb_app_id:# Toctoc: article: true ## show contents in article. aside: true ## show contents in aside.# Scroll to topgo_top: true# duoshuoduoshuo_shortname:# baidu sharebaidushare: true# blogrolllinks:- name: 404 page link: http://yibo.iyiyun.com/js/yibo404/key/1# well-nigh meabout_me: title: ABOUT ME gravatar: a@abc.com avatar: /images/github.jpg texts: - Hi,I'm howiefh.# exhibit updateddisplay_updated: true# 不蒜子busuanzi: true menu - 导航菜单 rss - rss 链接 github - github 链接 excerpt_link - “Read More” 链接. 设置为false可以隐藏 fancybox - 启用 Fancybox sidebar - 侧边栏样式. 可以选择 left, right, marrow or false 进行设置. widgets - 侧边栏显示的小工具 google_analytics - Google Analytics ID baidu_tongji - 百度统计ID favicon - Favicon 路径 twitter - Twiiter ID google_plus - Google+ ID toc - 在文章和侧边栏显示文章目录（侧边栏的文章目录默认隐藏，按返回顶部下面的按钮可以显示） go_top - 返回顶部 duoshuo_shortname - 多说short name baidushare - 在文章中激活百度分享，如果设置为false将在文章中显示默认分享工具,首页仍旧使用默认分享工具。 links - 在侧边栏显示友情链接，name链接名称，link链接地址 about_me - 在侧边栏显示关于我。优先使用gravatar，如果没有填写gravatar，将使用设置的avatar图片。texts 可以是一些介绍的文字。 display_updated - 在文章底部显示文章更新时间 busuanzi - 是否启用不蒜子统计访问量 侧边栏Landscape-F提供了9种小工具。 category tag tagcloud gazetteer recent_posts about_me timetable duoshuo_recent_comments links 相比默认主题增加了About Me、日历、多说最近评论、友情链接，并且对tags、tagcloud、categories、archive 的样式做了调整，比如数字的显示。 优化总结返回顶部按钮在文章的页面右下方会显示返回顶部的按钮。 在侧边栏和文章中显示文章目录默认会在侧边栏和文章中显示文章目录，侧边栏文章目录默认隐藏，可以通过文章目录按钮来进行开关侧边栏的文章目录。 多说评论使用了多说评论系统，在侧边栏会显示最近的评论，在主页面文章的右下方显示评论数。 百度分享使用了百度分享，默认启用，如果禁用，文章中使用默认的分享工具。 友情链接侧边栏添加友情链接 日历侧边栏添加日历，如果当月某天发布过博客，对应日期将会显示为链接，仅限当月。需要使用hexo-calendar 顶部添加github链接顶部github 链接可以在_config中设置 默认分享工具添加微博和人人改变侧栏样式调整头部高度和判断banner-url是否为空可以在source/css/_variables设置banner和背景图片。 调整侧边栏样式在archive页面仅显示archive小工具 修改article title样式文章底部添加更新时间添加语言文件修改滚动条样式添加不蒜子统计访问量其它图床如果图片很多的话，把图片都放在github感觉不大明智，使用图床就很有必要了，推荐使用七牛做图床，访问速度极快，支持日志、防盗链和水印。不光是图片，你甚至可以将生成的静态文件放在七牛上。标准用户有每月10GB流量+总空间10GB+PUT/DELETE 10万次请求+GET 100万次请求，应该足够了。 404页面我使用的是益云404公益页面http://yibo.iyiyun.com/Index/web404。把404.html放在landscape-f/source下就可以了。 hexo文档在stylus文件中可以使用 hexo-config(‘title’) 获得配置文件的配置tag pluginsvariablesModel常用方法123site.posts.each()site.posts.sort()site.posts.toArray() 可以在layout/_widget/tagcloud.ejs中使用<%- tagcloud({start_color: '#7dc3de', end_color: '#800080',color: true}) %>替换原有对应内容,实现彩色的标签云。 修改记录 返回顶部按钮 123456modified: layout/_partial/after-footer.ejsmodified: source/css/_variables.stylmodified: source/css/style.styladd layout/_partial/bottomBtn.ejsadd source/css/_partial/bottombtn.styladd source/js/gotop.js 文章目录 123456789modified: layout/_partial/after-footer.ejsmodified: layout/_partial/sidebar.ejsmodified: layout/_partial/article.ejsmodified: source/css/_variables.stylmodified: source/css/style.styladd layout/_partial/bottom-btn.ejsadd source/css/_partial/bottom-btn.styladd source/css/_partial/toc.styladd source/js/toc_aside_toggle.js 多说 1234modified: layout/_partial/after-footer.ejsmodified: layout/_partial/article.ejslayout/_partial/article.ejs中的div 一定要有class="ds-thread" 注意中间的不是下划线,直接在disqus上改的,改完不显示评论纠结半天多加了显示评论数的代码<a href="<%- post.permalink %>#ds_thread" class="ds-thread-count article-comment-link" data-thread-key="<%- config.root %><%- post.path%>">暂无评论</a> 百度分享 12modified: layout/_partial/article.ejsmodified: layout/_partial/after-footer.ejs 最近评论 1add layout/_widget/duoshuo_recent_comments.ejs 友情链接 1add layout/_widget/links.ejs well-nigh me 12add layout/_widget/about_me.ejsadd source/css/_partial/about-me.styl 日历 参考http://www.cnblogs.com/focuslgy/p/3260975.html 123add layout/_widget/calendar.ejsadd source/css/_partial/calendar.styladd helper plugin hexo-calendar github 链接 12modified:layout/_partial/header.ejsmodified:source/css/_partial/header.styl 默认分享添加 微博和人人 1234modified:layout/_partial/article.ejsmodified:source/css/_partial/article.stylmodified:source/css/_variables.stylmodified:source/js/script.js 改变侧栏样式 12modified:source/css/_partial/sidebar.stylmodified: helper plugin list.js 调整头部高度和判断banner-url是否为空 12modified:source/css/_partial/header.stylmodified:source/css/_variables.styl 修改sidebar 当页面是archives时只显示sidebar只显示archives 1modified:layout/_partial/sidebar.ejs 修改article title 样式,显示左侧边框 1modified:layout/_partial/article.ejs 修改滚动条样式 1added:source/css/_partial/scrollbar.styl 文章底部添加更新时间 123modified:layout/_partial/article.ejsmodified:layout/_partial/post/date.ejsmodified:source/css/_partial/article.styl 语言文件 1add languages/ Hexo Updated:2017-08-01 Newer mongodb笔记(一) 安装启动mongodb Older Android布局管理器 Please enable JavaScript to view the comments powered by Disqus. Contents 1. 安装指南1.1. 安装1.2. 启用1.3. 更新2. 配置指南2.1. 侧边栏3. 优化总结3.1. 返回顶部按钮3.2. 在侧边栏和文章中显示文章目录3.3. 多说评论3.4. 百度分享3.5. 友情链接3.6. 日历3.7. 顶部添加github链接3.8. 默认分享工具添加微博和人人3.9. 改变侧栏样式3.10. 调整头部高度和判断banner-url是否为空3.11. 调整侧边栏样式3.12. 修改article title样式3.13. 文章底部添加更新时间3.14. 添加语言文件3.15. 修改滚动条样式3.16. 添加不蒜子统计访问量4. 其它4.1. 图床4.2. 404页面4.3. hexo文档5. 修改记录 ABOUT ME Hi,I'm FengHao. I'll share something interesting and my learning wits with you at this blog. Categories Android3C2Database13MongoDB10MySQL2Eclipse1FTP2Git4Hexo4Java21FreeMarker3Shiro2JavaEE4Hibernate1JSP1Spring2JavaScript5jQuery1Linux2PHP5Suse1Ubuntu5Vim7编程2软件1 Tag Cloud Android C CAS Chrome Clean Code Database Eclipse FTP FreeMarker Gcc Git Github Pages Hexo Hibernate JSP JVM Java JavaMail JavaScript Linux Log Markdown MongoDB MySQL PHP Rhythmbox SSO Servlet Shiro Spring Suse Thinking in Java Ubuntu Vim VirtualBox Vsftpd jQuery pam_mysql 小米 软件 Archives May 20161April 20162September 20151August 20154July 20151May 20155April 20154March 20154February 20152December 20142November 20142October 20144September 20142August 20141July 20141June 20146May 20144April 20144March 20143February 201411January 20141December 20131November 20132August 20133July 20132June 20131May 20134April 20133March 20121TimetableRecent Posts Git 内幕 Hexo日历插件 AES加密时报java.security.InvalidKeyException Illegal key size JavaScript 总结 JavaScript 面向对象程序设计、函数表达式和异步编程 © 2017 howiefh Powered by Hexo and Theme by Landscape-F Total views. Home Archives