Heim > Web-Frontend > HTML-Tutorial > Fexo 文档_html/css_WEB-ITnose

Fexo 文档_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-21 08:54:34
Original
1632 Leute haben es durchsucht

打开博客根目录的 _config.yml设为 theme: fexo

升级

$ cd themes/fexo$ git pull
Nach dem Login kopieren

配置主题

主题配置全部在 theme/fexo里面完成,所里下面所有配置指的是配置 theme/fexo/_config.yml。

设置基本信息

blog_name: Forsignerslogan: Find the bug of the world
Nach dem Login kopieren

设置头像

# relative urlavatar: /images/avatar.jpg# or absolute urlavatar: https://avatars0.githubusercontent.com/u/2668081?v=3&s=460
Nach dem Login kopieren

设置favicon

favicon: /favicon.ico
Nach dem Login kopieren

设置关键词

关键词主要作用是优化SEO

keywords: forsigner,前端,设计,Hexo主题,前端开发,用户体验,设计,frontend,design,nodejs,JavaScript
Nach dem Login kopieren

自定义博客名的字体

由于中文字体文件太大,有的快10M,所以 Fexo 没有引入中文字体,导致博客名有点难看。

但是可以通过提取字体来减小字体文件大小,让字体只有几KB。

一下步骤可以让你实现自定义博客名字体,包括英文和中文:

  1. 下载免费可用的ttf格式字体
  2. 利用Web-Fontmin 提取字体,然后下载 Web 字体和样式
  3. 在博客根目录的s source文件夹新建两个子目录: fonts 和 css
  4. 把下载的字体方式fonts文件夹,把CSS文件放入css文件夹
  5. 修改 theme/fexo/_config.yml:

 # 这是css文件里的font-familiy的值 ,例如里面是 font-familiy: "myfontName"blog_name_font_familiy: myFontNamefonts_css_path:  - /css/calligraffittiregular.css  - /css/second-font.css
Nach dem Login kopieren

设置首页内容

你可以设置是否在首页直接显示文章

init_page_content: HOME_NAV  # HOME_NAV | POST
Nach dem Login kopieren

设置首页导航

home_nav:  - name: Blog    url: /archives  - name: Github    url: https://github.com/forsigner    target: _blank  - name: Douban    url: http://www.douban.com/people/forsigner/    target: _blank  - name: Twitter    url: https://twitter.com/forsigner    target: _blank
Nach dem Login kopieren

设置页面导航

page_nav:  - 博客: /archives/  - 分类: /category/  - 标签: /tag/  - 友链: /link/  - 关于: /about/  - RSS: /atom.xml
Nach dem Login kopieren

设置页面导航样式

page_nav_style: CIRCLE  # CIRCLE|ROUND_RECT
Nach dem Login kopieren

设置面包屑

breadcrumb:  isShow: true # true|fase
Nach dem Login kopieren

设置盒子

toolbox:  isShow: true # true|fase
Nach dem Login kopieren

设置文章标题对齐方式

post:  header_align: center # left|center
Nach dem Login kopieren

启用分类页面

  1. 在博客根目录执行 hexo new page category
  2. 修改 my-blog/source/category/index.md里面的内容:

---title: categorylayout: categorycomments: false---
Nach dem Login kopieren

启用标签页面

  1. 在博客根目录执行 hexo new page tag
  2. 修改 my-blog/source/tag/index.md里面的内容:

---title: taglayout: tagcomments: false---
Nach dem Login kopieren

启用友链页面

  1. 在博客根目录执行 hexo new page link
  2. 修改 my-blog/source/link/index.md里面的内容:

---title: linklayout: linkcomments: false---
Nach dem Login kopieren

启用关于页面

  1. 在博客根目录执行 hexo new page about
  2. 修改 my-blog/source/about/index.md里面的内容:

---title: aboutlayout: aboutcomments: false---
Nach dem Login kopieren

启用统计

google_analytics:baidu_analytics: 57e94d016sfsf1fba3xxxx8a2b0263af0
Nach dem Login kopieren

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage