从零开始搭建一个酷炫的个人博客

效果图

20240623194456_rec_

一、搭建网站

git和hexo准备

  1. 注册GitHub
  2. 本地安装Git
  3. 绑定GitHub并提交文件
  4. 安装npm和hexo,并绑定github上的仓库
  5. 注意:上述教程都是Windows系统,Mac系统会更简单!

域名准备

  1. 购买域名,买的是腾讯云域名,购买完成之后的域名管理
  2. 解析域名
  3. 域名备案

二、优化网站

  1. 使用的Fluid主题,Hexo Fluid 用户手册

  2. 增加图床,图片可以放在git中一起上传,但是图片多了会拖慢网站打开速度,推荐使用外链图床

    • 采用的是腾讯云的对象存储,直接购买资源包,然后上传图片即可,价格:10元/1年
    • 购买界面
    • 使用界面
  3. 增加评论

  4. 增加页面统计

  5. 变更图标和界面图片

    • 把想要显示的图片放到:themes/fluid/source/img文件夹下

    • themes/fluid/_config.yml配置文件中通过img/xx.png来定位图片

    • # 用于浏览器标签的图标
      # Icon for browser tab
      favicon: /img/icon
      
  6. GitHub的网站增加README.md

    • 在根目录 source 文件夹下新建README.md

    • 在根目录的 _config.yml 配置文件里,找到 skip_render 关键字,添加 README.md

    • # 解释器跳过md渲染为html的过程
      skip_render: README.md
      

三、发布第一篇文章

官方文档

新建一篇文章

  1. hexo new post "第一篇文章"
  2. 在博客目录下的/source/_posts/ 文件夹下,可以看到已经生成了标题为第一篇文章.md的博客文件,可以在_posts/文件夹下创建子目录,用以更好的管理文章
    目录结构
  3. Hexo 发布的文章是 Markdown 格式的文件

新建一篇草稿

  1. hexo new draft "第一篇草稿"
  2. 在博客目录下的/source/_drafts/ 文件夹下,可以看到已经生成了标题为第一篇文草稿.md的草稿文件,
  3. 草稿文章不会被其他人看到,直到通过hexo publish draft "第一篇草稿"才会把草稿推送为正式文章,从而被观测到

给文章添加分类和标签

---
title: 个人博客搭建完整攻略
date: 2022-12-27 14:47:08
tags:
- 博客
- hexo             // 多个标签
  categories:
- [其他技能, 博客搭建]   // 多层级分类,中间用英文逗号分隔
---

添加的分类结构

设置文章摘要

  1. 关闭自动摘要,在主题配置文件/themes/fluid/_config.yml中找到auto_excerpt,设置enable=false

    index:
      auto_excerpt:
        enable: true
    
  2. 在文章中指定摘要

    ---
    title: 这是标题
    excerpt: 这是摘要
    ---
    

设置文章模板

  1. scaffolds/post.md 设置正式文章模板
  2. scaffolds/draft.md 设置草稿模板
---
title: {{ title }}
date: {{ date }}
tags:
-
categories:
- []
  excerpt: {{ title }}
---

启动博客服务器

  1. 启动并本地测试:hexo server
  2. 发布到Github上hexo clean && hexo g && hexo d

20240623194456_rec_


更多惊喜

我们的公众号还将定期分享:

  • 最新互联网资讯:让你时刻掌握行业动态。

  • AI前沿新闻:紧跟技术潮流,不断提升自我。

  • 技术分享与职业发展:助你在职业生涯中走得更远、更稳。

  • 程序员生活趣事:让你在忙碌的工作之余找到共鸣与乐趣。

关注回复【1024】惊喜等你来拿!

敬请关注【程序员世杰】

coder_world_618

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/736247.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【web1】标签,css,js

文章目录 1.标签:input1.1 html:HTML(用于创建网页结构),CSS(对页面进行美化),JavaScript(用于与用户交互)1.2 文本标签:字体属性1.3 a标签&#…

win32API(CONSOLE 相关接口详解)

前言: Windows这个多作业系统除了协调应⽤程序的执⾏、分配内存、管理资源之外,它同时也是⼀个很⼤的服务中⼼,调⽤这个服务中⼼的各种服务(每⼀种服务就是⼀个函数),可以帮应⽤程式达到开启视窗、描绘图形…

解析JSON字符串

QJsonDocument类用于解析JSON字符串,

android studio 模拟器文件查找

android studio 模拟器文件查找 使用安卓模拟器下载文件后通常无法在系统硬盘上找到下载的文件,安卓 studio studio 其实提供了文件浏览工具,找到后可以直接使用 Android studio 打开 打开 Android studioview 菜单view > Tool Windows > Device…

智慧校园的作用是什么?

在近几年,智慧校园以其独有的姿态,悄然改变着教育的面貌。想象一下,当物联网、大数据、人工智能这些前沿技术与传统校园深度融合,教育空间不再局限于实体教室,知识获取也不再受制于时间与地点,一个更加开放…

物联网系统运维——数据库部署,Linux环境下MySQL安装,使用phpMyAdmin管理MySQL,实验CentOS 7安装MySQL

一.MySQL 1.概要 MySQL是一种关联数据库管理系统,关联数据:而不是将所有数据放在一个大仓库内,这样就增加了速度并提高了灵活性库将数据保存在不同的表中。性能高、成本低、可靠性好,已经成为最流行的开源数据库。 二.MySQL安装与配置 1. …

P1223 排队接水

题目描述 有 𝑛 个人在一个水龙头前排队接水,假如每个人接水的时间为 𝑇𝑖,请编程找出这 𝑛 个人排队的一种顺序,使得 𝑛个人的平均等待时间最小。 输入格式 第一行为一个整数 &a…

python 字符串驻留机制

偶然发现一个python字符串的现象: >>> a 123_abc >>> b 123_abc >>> a is b True >>> c abc#123 >>> d abc#123 >>> c is d False 这是为什么呢,原来它们的id不一样。 >>> id(a)…

OOM日志分析

目录 1. 日志分析2. MAT 工具2.1 日志打印方式2.1.1 HeapDumpOnOutOfMemoryError(推荐)2.1.2 jmp 命令 2.2 MAT分析方式2.2.1 饼图分析2.2.2 树形图分析2.2.2 泄漏疑点 3. 优化 首先说一下结论:通过MAT工具分析才是最精准的,直接通…

Java程序之简单“记事本”

要求:如下图所示,记事本具有新建、打开文本、保存、关闭等功能。 算法思路: 这是一个使用Java Swing库创建的简单文本编辑器。它包含一个菜单栏,其中包含“文件”菜单以及四个子菜单项:“新建”、“打开”、“保存”和…

【Web APIs】DOM 文档对象模型 ⑤ ( 获取特殊元素 | 获取 html 元素 | 获取 body 元素 )

文章目录 一、获取特殊元素1、获取 html 元素2、获取 body 元素3、完整代码示例 本博客相关参考文档 : WebAPIs 参考文档 : https://developer.mozilla.org/zh-CN/docs/Web/APIgetElementById 函数参考文档 : https://developer.mozilla.org/zh-CN/docs/Web/API/Document/getE…

torchinfo这个包中的summary真的很好用

1.安装直接使用 pip 进行安装即可: pip install torchinfo 2.导入该模块 from torchinfo import summary 3.使用模块 summary(model)#这里的model是你自己的model,可以添加参数进去 4.效果图: 第一个图片是直接打印model吗,…

华为某员工爆料:三年前985本科起薪30万,现在硕士起薪还是30w,感慨互联网行情变化

“曾经的30万年薪,是985本科学历的‘标配’,如今硕士也只值这个价?” 一位华为员工的爆料,揭开了互联网行业薪资变化的冰山一角,也引发了不少人的焦虑:互联网人才“通货膨胀”的时代,真的结束了…

【docker1】指令,docker-compose,Dockerfile

文章目录 1.pull/image,run/ps(进程),exec/commit2.save/load:docker save 镜像id,不是容器id3.docker-compose:多容器:宿主机(eth0网卡)安装docker会生成一…

【Git】win本地 git bash:Connect reset by 20.205.243.166 port22报错问题解决

win10 git bash 控制台 reset 22端口拒绝连接问题: Connection reset by 20.205.243.166 port 221、22端口 无法连接 ssh -T gitgithub.com2、尝试用443端口 仍然无法连接 ssh -T -P 443 gitgithub.com3、重写 git clone 地址 url,全局添加 https 前缀…

国产大模型技术创新分析

国产模型百舸争流,技术创新百花齐放 2023年下半年起,国内大模型领域迎来“百模大战”,各大厂商纷纷加速生成式AI的研发与突破,模型持续迭代升级,展现了人工智能技术的蓬勃发展与无限潜力。 中国大模型市场迅猛发展&am…

MapReduce程序设计2

要求 1、数据集stock-daily,包含A股近4000只股票的今年以来的日数据;数据集stock-daily-30d仅包含最近30个交易日数据,根据自己计算机性能选择。 数据来源:https://www.joinquant.com/help/api/help?nameJQData 2、数据集stoc…

每日签到页面模板组件,简单好用,用了会上瘾的那种

uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、Web(响应式)、以及各种小程序(微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝)、快应用等多个平台。 今日给…

基于S7-200PLC的全自动洗衣机控制系统设计

wx供重浩:创享日记 那边对话框发送:plc洗衣 获取完整无水印设计说明报告(含程序梯形图) 1.自动洗衣机PLC控制的控制要求 1.1全自动洗衣机的基本结构、工作流程和工作原理 1.自动洗衣机的基本结构 2.自动洗衣机的工作流程 自动洗…