使用Github Pages结合MkDocs制作个人网站

news2024/9/29 2:25:03

目录

环境配置

创建网页仓库

创建Github仓库

创建本地仓库

本地运行网页

配置主题

网站部署到Github

docs文件夹介绍

修改主页显示内容

添加新文件

mkdocs.yml文件介绍

其他效果


环境配置

为了正确的安装Mkdocs,需要先下载Python环境

下载地址:Welcome to Python.org

下载完毕后输入下面的指令安装MkDocs

 pip install mkdocs

为了使网页更加精美,可以安装Materia For MkDocs,使用下面的指令进行安装

 pip install mkdocs-material

创建网页仓库

首先进入Github,对于Github Pages来说,一共有两种网站:

  1. 个人网站:仓库名为<username>.github.io,<username>为当前账户的名字,不可以为其他名字,后面内容github.io是固定的不可以修改,一个账户只可以创建一个

  2. 仓库网站:仓库名随意,一个账户可以创建多个

本次教程以仓库网站为例

创建Github仓库

作为网页的仓库必须为公开,不可以私有

创建本地仓库

使用git将Github的仓库克隆到本地

 git clone 远程仓库地址

克隆完成后进入该目录,在该目录下使用命令行工具打开,输入下面的指令

 mkdocs new 网站项目名称

创建成功后可以看到两个默认文件

docs文件夹中有一个index.md,这个文件

 mkdocs build 

是主页文件,当直接进入页面时会优先加载这个markdown文件,以后要展示在网页的文档也写在docs文件夹中,第二个文件mkdocs.yml是mkdocs的配置文件,用于一些功能的配置

本地运行网页

创建完成网页文件后,进入网页项目目录,输入下面的指令在本地构建网页

 mkdocs build 

构建完成后输入下面的指令运行本地服务器

 mkdocs serve

下面的http://127.0.0.1:8000/就是本地服务器运行的网址,在浏览器地址栏中粘贴该网址即可访问网站

在命令行使用Ctrl+C结束服务器的运行

配置主题

前面已经安装了主题文件,接下来需要在mkdocs.yml文件中配置主题

 theme:
     name: 'material'

配置成功后重新构建运行后如下图所示:

网站部署到Github

将刚才创建的文件push到Github,再执行下面的命令进行部署

 mkdocs gh-deploy

结果如下:

https://H0308.github.io/Personal_Website/即为云端服务器网址,只要复制到地址栏即可访问

docs文件夹介绍

修改主页显示内容

docs文件夹主要放置用于显示在网页中的md文件,如果想要修改主页文件,可以对index.md进行修改,例如将网页内容修改为:Welcome to my wiki

保存index.md文件,将index.md文件上传到云端后重新进行一次部署,部署后将修改过的文件再一次进行部署,最后上传到云端,刷新网页就可以看到修改后的网页

添加新文件

直接在docs文件夹下新建一个新的md文件,通过与更新index.md文件同样的步骤即可完成网页新增文件,例如直接创建一个blogs.md文件

部署完成后在网页中即可看到新建的md文件,文档的文件名会被默认当做标题,如果文件中有1级标题,则该标题作为文件名

mkdocs.yml文件介绍

mkdocs.yml文件是mkdocs的配置文件,默认情况下会有一个site_name,该属性的值是网站的标题,

修改site_name前效果如下:

修改site_name:

修改mkdocs.yml文件后需要重新构建网站,构建后才能进行部署

部署成功后效果如下:

其他效果

可以参考下面的网站进行相关修改:

MkDocs文档:

MkDocs 中文文档 (markdown-docs-zh.readthedocs.io)

MkDocs开发文档(设置多级目录时需要使用):

简介 - MkDocs 文档开发教程 (mkdocs-like-code.readthedocs.io)

Material主题文档:

Material for MkDocs - Material for MkDocs 中文文档 (llango.com)

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

7日 ROI 提升150%,NetMarvel 助力越南厂商 Mirai 旗下解谜休闲手游实现高质增长!

解谜游戏是目前全球最受欢迎的休闲细分品类之一。对于厂商来说&#xff0c;解谜游戏开发成本低、制作周期短&#xff0c;打造成为爆款的几率更大。据 Sensor Tower 发布的数据&#xff0c;解谜游戏在全球市场累计的下载量已经超过500亿次&#xff0c;累计收入也已突破420亿美元…

MongoDB基础学习(1)Mongodb和MySQL的区别

在当今的软件开发领域&#xff0c;数据库的选择是一个至关重要的决策。MongoDB和MySQL作为两种广泛使用的数据库系统&#xff0c;各自拥有其独特的特性和优势。本文将从多个维度深入探讨MongoDB和MySQL之间的区别&#xff0c;帮助读者更好地理解和选择适合自身项目需求的数据库…

SQL面试题练习 —— 计算用户首单是即时单的比例

目录 1 题目2 建表语句3 题解 题目来源&#xff1a;美团。 1 题目 在外卖订单中&#xff0c;有时用户会指定订单的配送时间。现定义&#xff1a;如果用户下单日期与期望配送日期相同则认为是即时单&#xff0c;如果用户下单日期与期望配送时间不同则是预约单。每个用户下单时间…

Web-server日志分析命令

https://gist.github.com/hvelarde/ceac345c662429447959625e6feb2b47 通过状态码获取请求总数 awk {print $9} /var/log/apache2/access.log | sort | uniq -c | sort –rn按照IP的请求数量排序 awk {print $1} /var/log/apache2/access.log | sort | uniq -c | sort -rn |…

第 9 课:隐语联邦学习

隐语水平联邦框架介绍 隐语垂直联邦框架介绍 大模型微调技术 联邦大模型现状 可信执行环境(Trusted Execution Environment) 联邦大模型训练阶段存在的安全问题

“AI妖股”超微电脑业绩发布,股价暴跌

KlipC报道&#xff1a;周二&#xff0c;“AI妖股”服务器制造商超微电脑公布了第四财季财报&#xff0c;财报显示&#xff0c;超微电脑二季度营收53.08亿美元&#xff0c;同比增长142.95%&#xff1b;每股摊薄后盈利&#xff0c;6.25美元&#xff0c;市场预期8.07美元&#xff…

数据可视化Axure大屏原型制作分享

数据可视化大屏通过清晰、直观且易于理解的方式呈现大量复杂数据&#xff0c;已成为各行各业中不可或缺的工具。Axure作为一款功能强大的原型设计工具&#xff0c;为数据可视化大屏的制作提供了强大的支持和丰富的资源。 Axure RP 是一款强大的原型设计工具&#xff0c;非常适…

契约锁大型集团电子签及印控方案分享,无需重复部署、场景可拓展

契约锁在中大型客户市场以客户总量第一、本地化部署量第一领先行业&#xff0c;是汽车、保险、物流、食品、医药、工程、检测、家居等行业的40000多家中大型组织的电子签及印控服务商。 大型集团组织印章数量多则上千、甚至上万&#xff0c;用户规模高达十几万、数十万&#xf…

Ascon加密算法:轻量级加密的新选择

随着物联网、移动通信等领域的迅猛发展&#xff0c;信息安全问题日益凸显。加密算法作为保障信息安全的核心技术&#xff0c;一直备受关注。近年来&#xff0c;一款名为Ascon的加密算法逐渐崭露头角&#xff0c;成为轻量级加密领域的新宠。本文将为您介绍Ascon加密算法的原理、…

爬虫 Web Js 逆向基础:js 基础语法

网络爬虫对 Web Js 逆向主要是为了对各种研究加密参数&#xff0c;调试分析 JavaScript 代码来弄清加密参数的生成逻辑。 对于加密参数的逆向方式&#xff0c;个人认为 “对 js 源码进行补环境来模拟加密参数生成” 这种方法更加方便。 综上&#xff0c;想要做好 Js 逆向&…

如何利用 ChatGPT 提高工作效率?

内容创作与总结&#xff1a; 写作辅助&#xff1a;可以帮助撰写文章、报告、邮件等各种文本&#xff0c;如为招商银行写宣传文案、写论文、写故事等。学习材料生成&#xff1a;能够生成学习材料&#xff0c;如摘要、抽认卡和测验&#xff0c;帮助学生复习和学习课程。评估和考核…

JS爬虫逆向

JS反爬虫根本原因 / 基本原理&#xff1a; &#xff08;1&#xff09; 反爬虫&#xff1a; 限制爬虫程序访问服务器资源和获取数据的行为称为反爬虫。 &#xff08;2&#xff09;限制手段&#xff1a; 包括但不限于请求限制、拒绝响应、客户端身份验证、文本混淆和使用动态…

网站/APP短信接口调用与第三方短信API接入流程详解

在构建网站、APP或系统时&#xff0c;集成短信服务功能已成为提升用户体验、增强用户互动的重要手段。而这一过程往往依赖于调用第三方短信平台的API接口。今天&#xff0c;我们就来详细探讨一下如何高效地完成这一流程&#xff0c;特别是如何通过短信群发平台实现短信API接口的…

干货|字符串大小写转换用法

Python 中&#xff0c;为了方便对字符串中的字母进行大小写转换&#xff0c;字符串变量提供了 3 种方法&#xff0c;分别是 title()、lower() 和 upper()。 01 Python title()方法 title() 方法用于将字符串中每个单词的首字母转为大写&#xff0c;其他字母全部转为小写&…

Python配置国内镜像源

当我们在使用Python的pip包管理器下载一些第三方库的时候&#xff0c;经常会遇到一些下载速度很慢&#xff0c;或者下载失败的情况。导致这种情况发生是因为我们在使用pip的时候默认的下载源是在国外&#xff0c;所以在我们下载的时候就会由于网络问题而导致下载缓慢或者下载失…

灌溉数据同化方法、装置、电子设备及存储介质

智慧农业是新时代农业发展的必由之路。在万物互联的时代,海量农业数据的智能分析利用,已成为智慧农业的关键。然而,在灌溉领域,多源异构数据的高效融合一直是一个难题。传统方法面对新时期的挑战,已难以为继。在关键核心技术受制于人的大背景下,实现灌溉数据的自主可控,对保障国…

Python爬虫实战:实时微信推送奥运奖牌榜信息

最近奥运会正在巴黎如火如荼地进行。为了能第一时间获得我国运动健儿的获奖情况&#xff0c;我给大家分享一个python爬虫项目——实时微信推送奥运奖牌榜信息。 爬虫每隔 5 分钟抓取一次奥林匹克官网奖牌榜数据&#xff0c;对比上次抓取的数据&#xff0c;如果 奖牌数量 或者 排…

【Linux学习】深入理解软硬链接

&#x1f351;个人主页&#xff1a;Jupiter. &#x1f680; 所属专栏&#xff1a;Linux从入门到进阶 欢迎大家点赞收藏评论&#x1f60a; 目录 &#x1f388;软硬链接&#x1f427;软链接&#x1f42c;硬链接 &#x1f438;总结软硬链接的原理&#x1f40d;软硬链接的应用场景&…

stm32入门学习11-硬件I2C和MPU

&#xff08;一&#xff09;I2C硬件电路 stm32内部有I2C的硬件电路&#xff0c;我们可以使用stm32的标准库函数来实现I2C&#xff0c;这可以为我们减少对软件资源的占用 I2C硬件电路常用的标准库函数 void I2C_Init(I2C_TypeDef* I2Cx, I2C_InitTypeDef* I2C_InitStruct); /…

萤石开放平台 P套餐和E套餐的切换方法

本文将详述P套餐和E套餐的切换方法 注&#xff1a;套餐切换成功后立即生效&#xff0c;次日开始扣费&#xff0c;企业版套餐按日计消耗扣费&#xff0c;第二天计算前一天的费用并在余额扣除对应金额 一&#xff0e; E套餐切换成P套餐 请提工单联系我们&#xff1a; 萤石开放…