从零搭建HEXO博客 修改默认主题/参数/favicon 替换个人主页

准备:搭建环境

大致分为以下两步:

  1. 安装Node.js
  2. 安装git

配置Node.js环境

下载Node.js安装

  1. Windows Installer 32-bit
    https://nodejs.org/dist/v4.2.3/node-v4.2.3-x86.msi
    2.Windows Installer 64-bit
    https://nodejs.org/dist/v4.2....

保持默认设置,安装结束后,按win+R,在运行窗口中输入cmd,回车,打开命令行界面。
输入:

node -v
npm -v

如果结果如下图所示,那么说明你已经安装成功,如果不正确,那么就需要你回头检查自己的安装过程。

配置Git环境

下载Git安装文件:
git官网下载
一路默认选项,安装完后打开命令提示符,输入:

git --version

如图,则表示已经安装成功。


安装Hexo

在你想要搭建博客的目录下创建一个文件夹,比如我这里在E盘创建一个文件夹,叫test,进入test文件夹,右键,选择Git Bash Here

输入:

npm install -g hexo-cli


可能你会看到一个WARN,但是不用担心,这不会影响你的正常使用

接着输入:

npm install hexo --save

安装好后我们来检查一下Hexo是否安装完毕,在命令行输入:

hexo -v


如果你看到了如图文字,那么说明已经安装成功了。

接着初始化Hexo
输入:

hexo init

npm install

然后输入:

hexo s //也可以输入hexo server

启动服务

在浏览器输入:http://localhost:4000/


你就会看到默认主题博客界面



那如果我们不喜欢这个主题怎么办呢?
没关系,Hexo给我们提供了各式各样的主题,我们可以在https://hexo.io/themes/中寻找...,更改方法都是一样的。

下面我以archer主题举例,覆盖默认主题。

先按 ctrl+c 停止服务
在命令行输入

npm install hexo-generator-json-content --save
git clone https://github.com/fi3ework/hexo-theme-archer.git themes/archer

注意:如果你的命令窗口无法使用ctrl+V粘贴,可能是因为命令窗口的快捷键被改变了,你可以尝试shift+insert来进行粘贴。

100%即安装成功。
接着打开根目录下的_confit.yml文件(如果没有打开yml文件的软件,你可以使用记事本打开)
查找theme字段(如果找不到你可以按住ctrl+f进行查找),修改属性为archer

注意:theme:后的空格是必须的,否则运行服务时会报错


修改网页内容

如果你想修改网页的内容,那么就直接找到源文件进行修改,我在这里举个例子,如果你想修改主页的内容,找到目录。
主页是放在public文件夹下的index.html文件
打开

比方说,我想改主标题fi3ework’s Studio.
直接在文件中找到对应的文字

我们可以看到这个div中有标明文章标题与副标题,直接修改,刷新页面即可。
其他元素使用相同的方法都可以修改。
][11]
像这种超链接跳转的修改,在文件中找到<a> 直接把href属性的值改变即可。


修改网站标志

同样,我们在index.html找到这行代码

我们可以发现,网页的图标被命名为favicon.png
如果我们想要替换掉这个图标,我们可以创建一个文件夹,把自己的.ico文件放到这个文件夹里,比如我这里创建一个icon文件夹

修改路径(通常图标的格式为ico,如果你的图片为png格式或jpg格式,我们可以到这个在线转换格式的网站把图片转换为ico格式 http://tool.lu/favicon/


替换个人主页

如果你想用自己写的页面作为主页,那么把文件命名为index.html,覆盖掉public目录下的index文件即可。
把原本的index.html放到其他目录上,在新主页中设置一个超链接跳转就可以嵌套了。

原文地址:https://www.cnblogs.com/qianduanwriter/p/11829158.html

时间: 2024-11-09 04:35:53

从零搭建HEXO博客 修改默认主题/参数/favicon 替换个人主页的相关文章

腾讯云搭建hexo博客

腾讯云搭建hexo博客 hexo腾讯云 1. 腾讯云 学生认证购买 重置密码和网络备案 2. hexo博客搭建 2.1 Node.js环境准备 2.2安装git 2.3安装hexo 切换淘宝源 安装hexo 新建一个博客文件夹并初始化 启动 2.4 nginx部署 2.4域名DNS配置 3. 本地搭建hexo,git推送到腾讯云自动部署 4. 小结 1. 腾讯云 学生认证购买 在阿里云和华为云购买失败的前提下,最终找到了腾讯云的购买,学生认证后价格只要10块一月,域名16一年,价格真香,我选择

linux 搭建hexo博客

搭建环境: CentOS 6.5 1.安装git的编译包 yum -y install gcc zlib-devel openssl-devel perl cpio expat-devel gettext-devel curl autoconf 2.下载和安装Git 这里我们需要单独下载官方版本的较为新的Git安装包,即便很多人说直接在线yum install git也可以安装Git,但是默认的版本即便安装上了,以后我们需要提交版本是无法提交的.这里我下载到当前最新的2.4.6版本Git安装.

搭建hexo博客

安装Git 下载 msysgit 并执行即可完成安装. 安装Node.js 在 Windows 环境下安装 Node.js 非常简单,仅须下载安装文件并执行即可完成安装. 安装hexo 利用 npm 命令即可安装.(在任意位置点击鼠标右键,选择Git bash) npm install -g hexo 安装完成后,在你喜爱的文件夹下(如E:\hexo),执行以下指令(在H:\hexo内点击鼠标右键,选择Git bash),Hexo 即会自动在目标文件夹建立网站所需要的所有文件.创建hexo文件夹

Linux下搭建hexo博客网站

node.js安装 服务器环境: centos 5.7 git 已安装 hexo 搭建 官网地址:http://nodejs.cn/download/ ## 下载node mkdir /soft/hexo -p wget https://npm.taobao.org/mirrors/node/v12.16.1/node-v12.16.1-linux-x64.tar.xz ## 解压 tar xf node-v12.16.1-linux-x64.tar.xz -C /soft/hexo/ mv /

MAC下搭建Hexo博客

一.前言 Hexo是一款快速.简洁,基于node.js的强力框架. (1)超快速度:Node.js 所带来的超快生成速度,让上百个页面在几秒内瞬间完成渲染. (2)支持markdown:Hexo 支持 GitHub Flavored Markdown 的所有功能,甚至可以整合 Octopress 的大多数插件. (3)一键部署:只需一条指令即可部署到 GitHub Pages, Heroku 或其他网站. (4)丰富的插件:Hexo 拥有强大的插件系统,安装插件可以让 Hexo 支持 Jade,

搭建Hexo博客(三)—换电脑继续写Hexo博客

Hexo和GitHub搭建博客的原理是:Hexo将source下的md文件生成静态的html页面,存放到public目录中,这一步是由命令:hexo -g完成.接下来执行hexo -d命令,就将public目录下的文件推送到了github上.github上显示的就是这些静态页面. 本地hexo目录中除了source目录,其他主要是博客相关的配置.因此这些配置.源文件在更换电脑后是需要拷贝过去的. 1.拷贝文件 _config.yml package.json scaffolds/ source/

Django从零搭建个人博客 | 使用allauth插件管理用户登录与注册

原文博客地址:http://www.eosones.com/ django-allauth是最受欢迎的管理用户登录与注册的第三方Django安装包,可以大大简化我们用户注册,登录及账户管理,其核心功能包括用户注册.忘记密码.登录(微信,微博等第三方登录:邮箱验证).登录后密码重置.邮箱发送密码重置链接.退出等. 安装与设置 运行CMD,打开虚拟环境 pip install django-allauth 安装好后设置Myblog / settings.py,将allauth相关APP加入到INST

搭建Hexo博客并部署到Github

参考: http://www.jianshu.com/p/a67792d93682 http://jingyan.baidu.com/article/d8072ac47aca0fec95cefd2d.html https://help.github.com/articles/cloning-a-repository/ http://lijialalala.github.io/2016/04/05/hexoxo-usage/ 一.GitHub端 首先注册个GitHub的帐号 好注册完成后新建一个项

搭建Hexo博客(四)-设置

1.主题 比较流行的是yilia,下载主题到theme目录即可.再根据说明文档进行设置. 2.图片发布 source下创建的目录,并且目录下有文件,则文件会被生成到post目录中.图片可以放在这里.既保留了原始文件,也保留了发布的文件. 3.留言 留言使用gitment 原文地址:https://www.cnblogs.com/yangtze-yufei/p/9126259.html