网站和自媒体都可以做,开网店怎么和快递合作便宜,wordpress分类目录导航,做网站公司未来的发展方向什么是Cloud Studio
Cloud Studio 是基于浏览器的集成式开发环境#xff08;IDE#xff09;#xff0c;为开发者提供了一个永不间断的云端工作站。用户在使用 Cloud Studio 时无需安装#xff0c;随时随地打开浏览器就能在线编程。
Hexo 博客成品展示
本人博客如下IDE为开发者提供了一个永不间断的云端工作站。用户在使用 Cloud Studio 时无需安装随时随地打开浏览器就能在线编程。
Hexo 博客成品展示
本人博客如下haiyong.site 准备工作
首先打开Cloud Studio平台https://cloudstudio.net/需要注册登录实名认证然后我们进入模板页面 往下拉点击Hexo后进入系统会自动部署所需要的所有环境 部署主题
选择主题可以选择自己喜欢的主题。
主题链接Themes | Hexo
我比较喜欢 Butterfly 主题功能很全样式也很好看
修改 Hexo 根目录下的_config.yml把主题改为 butterfly
theme: butterfly 安装插件
如果你没有 pug 以及 stylus 的渲染器需要下载安装
BASH
npm install hexo-renderer-pug hexo-renderer-stylus --savecd ./ set port4000 export PORT4000 yarn install yarn run server --port4000
yarn install v1.22.19Hexo 基础修改
修改网站关键信息
Hexo 初始化后博客网站有一些关键信息是默认的需要修改为我们自己的信息。
网站资料
修改网站各种资料例如标题、副标题和邮箱等个人资料请修改博客根目录的站点配置文件 _config.yml
# Site
title: 海拥
subtitle: 一枚乐于分享技术与快乐的博主
description:
keywords:
author: haiyong
language: zh-CN
timezone:
保存后运行下段代码重新编译并部署即可看到站点标题
cd ./ set port4003 export PORT4003 yarn install yarn run server --port4003 导航菜单
修改主题配置文件 themes/butterfly/_config.yml
menu:首页: https://haiyong.site/ || fas fas fa-home导航||fas fa-list:时间线: /archives/ || fas fa-archive标签: /tags/ || fas fa-tags摸鱼||fas fa-fish:游戏: /moyu/ || fas fa-gamepad工具: /tools/ || fas fa-tools动画: /demo/ || fas fa-anchor摸鱼大军: /chat/ || fas fa-place-of-worship友人帐: /link/ || fas fa-link关于我: /about/ || fas fa-heart 保存后运行下段代码重新编译并部署即可看到导航栏
cd ./ set port4004 export PORT4004 yarn install yarn run server --port4004 背景图咱们也修改一下
修改主题配置文件 themes/butterfly/_config.yml
background: url(https://haiyong.site/img/bizhi/bg.jpg)
保存后运行下段代码重新编译并部署即可看到背景
cd ./ set port4006 export PORT4006 yarn install yarn run server --port4006 Butterfly 主题优化
生成文章唯一链接
Hexo的默认文章链接格式是年月日标题这种格式来生成的。如果你的标题是中文的话那你的URL链接就会包含中文
复制后的URL路径就是把中文变成了一大堆字符串编码如果你在其他地方用这边文章的url链接偶然你又修改了改文章的标题那这个URL链接就会失效。为了给每一篇文章来上一个属于自己的链接写下此教程利用 hexo-abbrlink 插件A Hexo plugin to generate static post link based on post titles ,来解决这个问题。 参考github官方 hexo-abbrlink 按照此教程配置完之后如下
1、安装插件在博客根目录 [Blogroot] 下打开终端运行以下指令
npm install hexo-abbrlink --save2、插件安装成功后在根目录 [Blogroot] 的配置文件 _config.yml 找到 permalink
- permalink: :year/:month/:day/:title/
#修改为permalink: post/:abbrlink.html # post为自定义前缀abbrlink:alg: crc32 #算法 crc16(default) and crc32rep: hex #进制 dec(default) and hex 鼠标点击效果
zIndex建议只在-1和9999上选 -1 代表烟火效果在底部 9999 代表烟火效果在前面
修改主题配置文件 themes/butterfly/_config.yml
fireworks:enable: truezIndex: 9999 # -1 or 9999mobile: false 完成后重新编译并部署
网站副标题
可设置主页中展示的网站副标题或者自己喜欢的座右铭
修改主题配置文件 themes/butterfly/_config.yml
# Site
title: Hexo
subtitle:enable: true# Typewriter Effect (打字效果)effect: true# loop (循环打字)loop: true# 如果关闭打字效果subtitle 只会显示 sub 的第一行文字sub:- 但承青莲有侠志莫道红尘无剑仙。- 一生疏狂尽余欢半剖肝胆入剑寒。- 昨日前事皆可弃明月松风抱剑来。- 扶摇直上九万里万里写入胸怀间。- 剑至高危入蜀道生逢穷途行路难。- 江湖风雨染白衫黑云万里不见天。- 席卷英豪天下来千古化境一念同。- 欲买桂花同载酒终不似少年游。- 温水煮了将军梦现实压垮少年肩- 时人不识凌云木直待凌云始道高 - 骏马自知前程远不必扬鞭自奋蹄。完成后重新编译并部署
cd ./set port4006exportPORT4006 yarn install yarn run server --port4006 说了这么多那么怎么发布文章呢让我们先在/hexo-demo/source/_posts/下新建一个 .md 文件支持 Markdown 格式。
写完后重新编译并部署现在可以看到我们的文章了。
到这里我们的博客也算基本完成了当然还有更多的美化需要花更多时间的另外有什么问题都可以在评论区告诉我看到了我都会第一时间为大家解答。
