Hexoオープンソースのブログシステムを使って、あなたの個人的なブログを構築することは容易（2） - コンフィギュレーションの章

前のセクションでは、我々が構築するHexo基盤を導入し、我々は完全な発見を構築する必要があり、英語版で、ページが少し醜いです。この章では、トピックを紹介し、あなたとHexoの構成を設定します。
オリジナルリンク：https://codernice.top/articles/6b580174.html

サイト情報

一時的にテーマ設定ファイルと呼んで、我々が話題について話すとき、そのようなファイルが存在します、フォローアップ、このサイトグローバル・コンフィギュレーション・ファイルを呼び出してみましょう、あなたはこのファイルを_config.ymlと前章であり記載されています。
私たちは、最初の主な内容は何グローバルプロファイルを見て：

# Site 站点主配置
title: Hexo  # 网站标题
subtitle:    # 网站副标题
description:   # 网站描述
keywords:      # 可以不填写保持默认
author: John Doe  # 网站拥有者昵称
language:    # 网站语言设置，一般根据依赖的主题而定
timezone:    # 网站时区设置，一般不填写保持默认

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url:   # 网站url设置
root:  # 网站根目录链接
permalink: :year/:month/:title.html  # 文章链接，默认是按照 /年/月/日/文章标题 设置的链接
permalink_defaults:  # 默认链接形式
......
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme:  #主题

これらは残り、Gitののconfigureサイトマップの設定およびその後の再利用のプレゼンテーションにデフォルトを設定する必要があるかもしれません。
情報が取ることを忘れないでください、設定が完了hexo g && hexo s、効果を確認するには、ブラウザを更新します。

次のテーマをインストール

あなたがダウンロードできる公式サイトでテーマ（https://hexo.io/themes）もGitHubの検索に行くことができる、私はHexoブログのほぼ半分を占めていた次のトピックを使用することをお勧めします。
次のトピックダウンロード：https://github.com/theme-next/hexo-theme-next.git
ここに提示したバージョンは、物事の多くは手動で設定してNext5が停止している維持する必要がNext5 Next6、実際には、そう、Next6バージョンを増やしていますNext6バージョンがお勧め。

次のテーマをダウンロード

二つの方法では：
1. hexoディレクトリで次の次の倉庫のテーマ/クローンを作成するためのgit cloneコマンドを使用して、あなたがルートディレクトリに実行する必要があり、コマンドは次のとおりです。git clone https://github.com/theme-next/hexo-theme-next.git themes/next
Githubのページにある緑色のボタンの2を直接選択Clone or Downloadダウンロード・アーカイブ、そして解凍テーマの下にディレクトリ名を変更することができます。

次のテーマを設定

次のように、テーマを見つけ、グローバルコンフィギュレーションファイル_config.ymlを開きます。

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: hexo-theme-next   #此处填入你在themes目录下的next主题目录名

次のトピックテスト

Gitのバッシュで次のコマンドを実行します。

hexo clean && hexo g && hexo s

ブラウザに入力されたコマンドの実行が完了した後http://localhost:4000にインストール次にトピックを表示します。

次のトピックの設定

以下のテーマディレクトリでは、我々は、テーマ設定ファイルを呼び出すのは、設定を始めましょう、_config.yml設定ファイルがあります。

ウェブサイトのアイコンを設定

次のようにオープン_config.yml、ファビコンの位置を見つけました：

favicon:
  small: /images/favicon-16x16-next.png
  medium: /images/favicon-32x32-next.png
  apple_touch_icon: /images/apple-touch-icon-next.png
  safari_pinned_tab: /images/logo.svg
  #android_manifest: /images/manifest.json
  #ms_browserconfig: /images/browserconfig.xml

ソース/ imagesディレクトリ下のあなたの次のトピック上の画像は、その後、あなたは、テーマ設定ファイルを設定することができます。

hexoによって閉じ搭載下

フッターでは、すべてのパワードテーマの属性をfalseに設定すると、

footer:
  ...
  powered:
    # Hexo link (Powered by Hexo).
    enable: false
    # Version info of Hexo after Hexo link (vX.X.X).
    version: false

  theme:
    # Theme & scheme info link (Theme - NexT.scheme).
    enable: false
    # Version info of NexT after scheme info (vX.X.X).
    version: false

メニューバーの設定

menu:
  home: / || home
  #about: /about/ || user
  tags: /tags/ || tags
  categories: /categories/ || th
  archives: /archives/ || archive
  #schedule: /schedule/ || calendar
  #sitemap: /sitemap.xml || sitemap
  #commonweal: /404/ || heartbeat

# Enable / Disable menu icons / item badges.
menu_settings:
  enable: true  #表示是否显示菜单图标icons
  badges: false  # 显示每个菜单下面有多少个内容

||あなたは、アイコンを変更したい場合は、あなたが好きFontAwesomeアイコンのスタイルを見つけるために、公式サイトに行くことができ、アイコン名のfontawesomeの背後にあります。

テーマスタイル設定

# Schemes
#scheme: Muse
#scheme: Mist
#scheme: Pisces
scheme: Gemini

デフォルトはミューズである、私は見るのが好きジェミニを、あなたはそれぞれの裁判で見ることができ、使用していました。

社会的なリンクが設定され

social:
  GitHub: https://github.com/codernice || github
  #E-Mail: mailto:xx || envelope
  #Weibo: xx || weibo
  #Google:xx || google
  #Twitter: xx || twitter
  #FB Page: xx || facebook
  #VK Group: xx || vk
  #StackOverflow: xx || stack-overflow
  #YouTube: xx || youtube
  #Skype: xx || skype

あなた自身の注釈へのyournameのは、対応するサイトID、＃で削除することができます。

リンクを設定します

# Blog rolls
links_icon: link
links_title: Links
links_layout: block
#links_layout: inline
links:
  #Title: http://example.com

#Title: http://example.comサイト名とリンクのための取り替え

開くためにもっとボタンを読みます

auto_excerpt:
  enable: true
  length: 150

デフォルトはfalseで、記事全体がtrueに多くのボタンを読んで開くように設定、ホームページに表示されます。

記事のメタデータの設定

post_meta:
  item_text: true
  created_at: true
  updated_at:
    enable: false
    another_day: true
  categories: true

記事のホーム・ページの表示を作成し、更新されたデータは次のように読み込みます

記事のワードカウントの設定

# Post wordcount display settings
# Dependencies: https://github.com/theme-next/hexo-symbols-count-time
symbols_count_time:
  separated_meta: true
  item_text_post: true
  item_text_total: false
  awl: 4
  wpm: 275

この設定を追加する必要がありますhexo-symbols-count-timeモジュールの依存関係、ルートディレクトリhexoのに使用されるサイトnpm install hexo-symbols-count-time --saveモジュールをインストールするコマンドを。

サイドバーの画像の設定

# Sidebar Avatar
avatar:
  # In theme directory (source/images): /images/avatar.gif
  # In site directory (source/uploads): /uploads/avatar.gif
  # You can also use other linking images.
  url: 你的头像地址
  # If true, the avatar would be dispalyed in circle.
  rounded: true # 设置头像是否为圆形
  # The value of opacity should be choose from 0 to 1 to set the opacity of the avatar.
  opacity: 1 # 设置不透明度，1为完全不透明，0为完全透明
  # If true, the avatar would be rotated with the cursor.
  rotated: true # 设置鼠标放到头像上是否旋转

コードブロックが提供されています

codeblock:
  # Manual define the border radius in codeblock, leave it blank for the default value: 1
  border_radius: 7   # 按钮圆滑度
  # Add copy button on codeblock
  copy_button:
    enable: true # 设置是否开启代码块复制按钮
    # Show text copy result
    show_result: true # 是否显示复制成功信息

報酬ボタンの記事を開きます

# Reward (Donate)
reward_settings:
  # If true, reward would be displayed in every article by default.
  # You can show or hide reward in a specific article throuth `reward: true | false` in Front Matter.
  enable: true #开启打赏功能
  animation: false
  #comment: Donate comment here

reward:
  wechatpay: # 微信收款图片地址
  alipay: # 支付宝收款图片地址
  #bitcoin: /images/bitcoin.png

オープン関連記事推奨機能

related_posts:
  enable: true #开启
  title: # custom header, leave empty to use the default one
  display_in_home: false #显示在首页
  params:
    maxCount: 5
    #PPMixingRate: 0.0
    #isDate: false
    #isImage: false
    #isExcerpt: false

あなたはインストールする必要がありhexo-related-popular-postshexoサイトルートで実行モジュール、npm install hexo-related-popular-posts --saveインストールモジュールを。

コードブロックのスタイル設定

# Code Highlight theme
# Available values: normal | night | night eighties | night blue | night bright
# https://github.com/chriskempson/tomorrow-theme
highlight_theme: normal

通常、夜、夜の八十年代、青い夜、スタイル、これらのタイプの明るい夜がありますが、我々はすべて試して見ることができます。

バリンのコメントシステムを追加

# Valine
# You can get your appid and appkey from https://leancloud.cn
# More info available at https://valine.js.org
valine:
  enable: true # 开启valine评论
  appid: # your leancloud application appid
  appkey: # your leancloud application appkey
  notify: false # mail notifier, See: https://github.com/xCss/Valine/wiki
  verify: false # Verification code
  placeholder:  # comment box placeholder
  avatar: monsterid # gravatar style
  guest_info: nick,mail,link # custom comment header
  pageSize: 10 # pagination size
  language: # language, available values: en, zh-cn
  visitor: false # leancloud-counter-security is not supported for now. When visitor is set to be true, appid and appkey are recommended to be the same as leancloud_visitors' for counter compatibility. Article reading statistic https://valine.js.org/visitor.html
  comment_count: true # if false, comment count will only be displayed in post page, not in home page

バリン、サードパーティ製のプラグインは、あなたがする必要がありますhttps://leancloud.cnはあなたがAPPIDとAPPKEY後にここに置くために得ることができ、アカウントを登録しました。設定されたデフォルトのアバターがアバターに行くことができていますhttps://valine.js.org/avatarその後、ここに名前を設定することができ、デフォルトのアバターを選択します。

Baiduの共有を開きます

# Baidu Share
# Available values: button | slide
# Warning: Baidu Share does not support https.
baidushare:
  type: button  # 设置分享按钮的风格，有button何slide形式

オープンneedmoreshareシェア

needmoreshare2:
  enable: false
  postbottom:
    enable: false
    options:
      iconStyle: box
      boxForm: horizontal
      position: bottomCenter
      networks: Weibo,Wechat,Douban,QQZone,Twitter,Facebook
  float:
    enable: false
    options:
      iconStyle: box
      boxForm: horizontal
      position: middleRight
      networks: Weibo,Wechat,Douban,QQZone,Twitter,Facebook

テーマ-次needmoreshare2モジュールを頼るneedmoreshare2、友人に回すことができますhttps://github.com/theme-next/theme-next-needmoreshare2方法を見つけます。

の量を設定するための記事を読みます

leancloud_visitors:
  enable: true
  app_id: 
  app_key: 
  # Dependencies: https://github.com/theme-next/hexo-leancloud-counter-security
  # If you don't care about security in leancloud counter and just want to use it directly
  # (without hexo-leancloud-counter-security plugin), set `security` to `false`.
  security: false
  betterPerformance: true

APPIDとはleanCloudバリンの使用が同じである上記のコメントで開かAPPKEY。あなたは記事が読みの量を示していないことが判明した場合、あなたは、バックエンド・ストレージleanCloudメニューに移動カウンターという名前のクラスを作成することができます。

ニンニク統計のないオープン

busuanzi_count:
  enable: true
  total_visitors: true #开启总访客（uv）
  total_visitors_icon: user
  total_views: true #开启总访问数（pv）
  total_views_icon: eye
  post_views: false
  post_views_icon: eye

ここでpost_viewsと上記leanCloud_visitors競合は、両方のちょうど缶を開いて、記事を読んでの量を表示します。

ローカルのブログ検索機能を有効にします

local_search:
  enable: false
  # If auto, trigger search by changing input.
  # If manual, trigger search by pressing enter key or search button.
  trigger: auto
  # Show top n results per article, show all results by setting to -1
  top_n_per_article: 1
  # Unescape html strings to the readable one.
  unescape: false

この機能は、依存しているhexo-generator-searchdb、プラグをコマンドを使用してnpm install hexo-generator-searchdb --saveインストールするには、グローバルコンフィギュレーション・ファイルの末尾に、次のコードを追加します。

search:
  path: search.xml
  field: post
  format: html
  limit: 10000

概要

これらは、使用ごとに探索することができます次のトピックより多くの機能が為替を議論するために歓迎されている一般的なhexoブログだけでなく、いくつかの基本的な構成設定に基づくです。

モジュールの依存関係をインストールする必要があります

1.数：npm install hexo-symbols-count-time --save
2.推奨関連記事：npm install hexo-related-popular-posts --save
3.ローカルブログ検索：npm install hexo-generator-searchdb --save、その後、グローバルコンフィギュレーションファイルの末尾にコードを追加します。

サードパーティ製のプラグイン

1.valineのコメントシステム：必要にhttps://leancloud.cn登録アカウント、のappidとAPPKEYするアクセス
読み取り2.記事を：leancloud同じAPPIDを使用する必要性とAPPKEY