👇 连享会 · 推文导航 | www.lianxh.cn
🍓 课程推荐：连享会：2025暑期班·网络直播
嘉宾：连玉君 (初级+高级) || 张宏亮 (论文班)
时间：2025 年 8 月 4-14 日
咨询：王老师 18903405450（微信）
温馨提示: 文中链接在微信中无法生效。请点击底部「阅读原文」。或直接长按/扫描如下二维码，直达原文：
作者： 连小白 (连享会)
邮箱：lianxhcn@163.com
说明：本文撰写过程中使用了 AI 辅助工具，详情参见 ChatGPT 对话。
按照本文的操作方法，你大概需要 50 分钟就可以完成个人主页的搭建，风格如下。
- 主页地址：https://lianyujun.github.io
- github 仓库：https://github.com/lianyujun/lianyujun.github.io
1. 为什么你需要一个个人主页？
可能是中国传统文化的影响，多数国内的孩子都比较内敛。通常是到了找工作的时候才会做一份简历来展示知己，至于个人主页，基本是没有的。相比之下，不少在境外读书的学生，好早就建立了自己的个人主页，甚至是个人网站，展示自己的摄影作品、程序，甚至是一些日常博客。这有助于培养写作和深度思考习惯，也是一种分享行为，不经意间就逐渐建立起了自己的网络声誉。
经过这段时间的对比，我发现使用 Quarto + Github pages 这个工具组合，可以轻松实现个人主页的制作和发布。全程无需任何费用，也不需要学习复杂的 HTML 知识。只需要花几分钟掌握 Markdown 基本语法，Fork (克隆) 一个你中意的个人主页模版，然后修改成自己的信息即可。后期维护和更新和非常方便。
我测试了一下，按此流程，制作一个个人主页，大概需要 50 分钟，非常便捷。
在当前的学术与职业环境中，无论你是一位博士生、青年教师、硕士求职者，甚至是本科高年级学生，我都强烈建议你尽早建立一个属于自己的个人主页。个人主页就像你的 “在线名片”，它能够集中展示你的身份、研究兴趣、项目成果、发表论文和教学经验，并且可以长期保留、方便分享，是你“数字身份”的核心部分。
与 PDF 简历、微信文章以及 Google/百度 学术主页不同，个人主页具有以下优势：
- 它是可搜索的，别人只要搜你的名字、机构或研究领域，很容易找到；
- 它是结构清晰、可维护的，你可以随着科研和职业经历的变化随时更新内容；
- 它是可以链接各种平台的，比如你的 Google Scholar、ORCID、GitHub、微信公众号、知乎专栏、B 站主页等。
从招聘者的角度来看，一个结构清晰、信息完整的主页会显著提升你的可信度和专业形象；从合作者或评审者的角度来看，个人主页也是快速了解你背景与研究成果的最佳入口。
尤其对于刚起步的研究者而言，与其等期刊发表、论文被检索，不如先做好自己能控制的第一步——建立一个简单而清爽的个人主页。这不需要你掌握 HTML、CSS 或 JavaScript，只需要掌握基本的 Markdown 和一个免费工具链：Quarto + GitHub Pages。
2. 为什么选择 GitHub Pages + Quarto？
你可能会问，创建个人主页的方式有很多，为什么我们推荐用 GitHub Pages 和 Quarto？
原因很简单：免费、稳定、学术友好、扩展性强、维护成本低。 它是一个非常适合初学者、尤其是研究人员使用的方案。
A. GitHub Pages 的优势
- 免费托管，无需服务器和域名：GitHub Pages 是 GitHub 提供的静态网站托管服务，个人项目可免费无限使用。
- 无需维护，自动部署：只要把你的网站代码 push 到 GitHub 仓库，GitHub Pages 会自动部署最新版本，不需要你配置服务器、FTP 或 CI 工具。
- 默认域名格式清晰：当你的仓库命名为
yourusername.github.io 时，GitHub 会自动将其发布到 https://yourusername.github.io，适合作为你的永久主页地址。 - 与学术生态兼容良好：现在很多导师、实验室、开源项目也都托管在 GitHub 上，一个 GitHub Pages 主页更容易被学术搜索引擎收录和识别。
B. Quarto 的优势
- 面向科研用户设计：Quarto 是 RStudio（Posit）开发的文档编译系统，是 R Markdown 的进化版本。它专门为学术用户服务，支持论文、博客、演示、网站等多种格式。
- 支持 Markdown + 代码块 + 数学公式 + 文献引用：你可以在主页中自然地插入 LaTeX 数学公式、R 或 Python 分析代码，甚至支持交互式图表（如 plotly、leaflet）。
- 不需要掌握前端技术：不需要写 HTML/CSS/JS，只需用 Markdown 写内容，用 YAML 写配置。
- 可视化写作体验好：配合 VS Code 和 Quarto 插件，可以一键预览、调试和发布网站，初学者也能快速上手。
C. GitHub + Quarto 的组合：完美适配
GitHub 提供平台与发布，Quarto 负责内容与样式渲染。两者的结合，让你可以像写论文一样写网站，像 push 代码一样更新主页。最重要的是，几乎所有内容都可以复用已有模板，从 fork 开始构建你自己的主页，最大程度地降低学习成本。
ps，在写这篇推文的过程中发现，just-the-docs 也是一个不错的制作个人主页的工具。虽然功能没有本文介绍的方案齐全，但如果你只是展示静态信息（如个人简介、研究方向、联系方式等），它是一个非常简洁的选择。
3. 环境配置与前期准备
在动手制作主页之前，我们需要配置一套简单但功能齐全的工具环境。以下是推荐的工具组合：
- GitHub 账号：主页将托管在 GitHub Pages 上，需要注册一个 github 账号。
- GitHub Desktop（推荐）：用于管理仓库、同步网页内容，免除命令行操作。
- VS Code 编辑器：下载并安装 VScode 编辑器，用于 Markdown 写作。VScode 支持多种插件。参见 VScode 插件：安装、配置和使用。
- Quarto CLI 工具（quarto.org）：负责将
.qmd 文件编译为网页。 - Markdown 插件：建议安装 Markdown All in One 和 Markdown Preview Enhanced，提供语法高亮、预览等功能。详情参见 VScode：实用 Markdown 插件推荐。
- Quarto 插件：安装 Quarto VS Code Extension，用于编写和渲染 Quarto 文档。
安装完成后，可以按快捷键 Ctrl + ~ 打开控制台，运行 quarto check 命令，以检查环境是否配置成功。
4. 操作流程概览
要快速构建你的个人主页，最简单的方法是基于一个已有的模板进行修改。你不需要从头开始，只需要 Fork 一个模板，然后定制你自己的内容。这样，你可以快速搭建主页框架，节省大量的时间。接下来，我将概述你需要做的基本步骤，并在 Section 5 中为你提供更详细的操作演示。
4.1 Fork 并克隆模板
-
选择模板：在 GitHub 上找到一个适合你需求的模板。例如，参考 lianyujun.github.io 或其他模板库。模板可以根据个人需求进行选择，简洁型或内容丰富型都有。
Fork 仓库：登录你的 GitHub 账号，打开你选中的模板页面，点击页面右上方的 Fork 按钮，将模板复制到你自己的 GitHub 仓库中。
克隆到本地：使用 GitHub Desktop 或 Git 命令行工具将刚才 Fork 的仓库克隆到你的本地计算机中。
4.2 修改主页内容
在克隆并打开仓库之后，你可以开始修改主页的内容：
修改 index.qmd 文件：主页的核心文件，你可以在其中添加个人信息、头像、联系方式等内容。使用 Markdown 格式，简单易懂。
修改 _quarto.yml 文件：这是 Quarto 的配置文件，你可以在其中修改网站的标题、菜单项、导航栏样式等。你也可以在此文件中设置网站的输出路径，指定自定义样式或主题。
更新其他 .qmd 文件：你可以根据需要修改其他页面内容，如 publications.qmd（学术成果）、blog.qmd（博客文章）等，来展示你的研究、项目和文章。
替换图片：在 images/ 文件夹中，上传并替换默认的头像、网站 logo 或其他图片。
4.3 渲染和本地预览
一旦你完成了内容修改，下一步是编译渲染页面并预览：
运行 quarto render 命令：在 VS Code 中打开终端（Ctrl + ~），然后运行命令：
quarto render
该命令会将你的 .qmd 文件转换为 HTML 页面，输出到 docs/ 文件夹。
本地预览：在 docs/ 文件夹中，找到 index.html 文件，双击打开，即可在浏览器中查看渲染后的效果。
4.4 推送到 GitHub 并部署
提交更改：使用 GitHub Desktop 或命令行工具将本地更改提交到 GitHub 仓库。
- 打开 GitHub 仓库页面，点击
Settings →
Pages； - 选择
main 分支，设置 /docs 文件夹作为发布目录。
完成设置后，几分钟后，你的个人主页将正式上线，网址为 https://yourusername.github.io。
5. 完整实例：我的主页制作流程
以上步骤概述了如何 Fork 模板并进行基本的定制，本节将以我的个人主页创建过程为例，l帮助你更好地理解如何进行内容修改和网站部署。
我的 Github 个人主页 是基于 Chi Zhang 的主页 修改而成的。我做了很多简化，以确保我的主页简洁明了。最终的主页只包含 7 个静态页面 (每个页面由一个普通的 .qmd 文件构成)。
你可以按照如下流程，通过 Fork lianyujun.github.io 仓库，稍作修改后形成你的个人主页。
Step 1: Fork 主页模板
- 登录你的 Github 账号 (
yourusername)，访问我的个人主页仓库 lianyujun/lianyujun.github.io - 点击右上方的
Fork 按钮 (或直接点击 Use this template 按钮)，将该仓库复制到自己的账号下。注意： - 仓库名称 (
Repository name*) 必须为 yourusername.github.io，这样才能自动部署为你的主页； - 仓库描述可以写上你的个人介绍，如
xxx's personal page 或 xxx 的个人主页
- 使用 GitHub Desktop 将该仓库克隆到本地。参见 GitHub Desktop 的使用说明。更详细的介绍参见：官方使用指南。
-
Notes：如果你有多个 Github 账号，请确保在 GitHub Desktop 中切换到正确的账号 (依次点击 Github Desktop 界面的 File → Options → Accounts → Sign Out/In，按根据提示切换账号即可)。
Step 2: 修改内容文件
首先，你需要使用 GitHub Desktop 将该仓库克隆到本地。参见 GitHub Desktop 的使用说明。更详细的介绍参见：官方使用指南。
- 我将该仓库克隆到
D:\github_lianyujun 目录下，最终的仓库路径为 D:\github_lianyujun\lianyujun.github.io - 注意，如果你有多个 Github 账号，请确保在 GitHub Desktop 中切换到正确的账号 (依次点击 Github Desktop 界面的 File → Options → Accounts → Sign Out/In，按根据提示切换账号即可)。
接下来，你需要更新主页的内容文件。打开 VS Code，载入该仓库 (File → Add Folder)，修改以下文件：
- 修改
index.qmd 文件，添加个人介绍、教育背景、研究方向； - 替换
images/ 文件夹中的头像为自己的照片； - 修改
_quarto.yml 文件，设定站点标题、导航栏菜单； - 修改
publications.qmd、blog.qmd 等页面，填入个人论文与博客文章；
你也可以使用中文文件名，或新增一些页面，但需要将它们添加到 _quarto.yml 的导航栏中。
修改过程中的具体信息说明如下：
_quarto.yml 是配置文件，定义了网站结构和样式。这两个文件都需要根据你的个人信息酌情修改。- 其它
.qmd 文件是各个子页面的内容文件，如 publications.qmd、blog.qmd 等，可以直接在 VScode 中按照 Markdown 语法格式编辑即可。
lianyujun/lianyujun.github.io 仓库的文件结构如下：
lianyujun.github.io
基本文件：
├── readme.md # 仓库说明
├── index.qmd # 主页内容
├── _quarto.yml # Quarto 配置文件（导航栏、主题、输出路径等）
├── styles.scss # 自定义样式（可选，可以自行修改）
├── images/ # 文件夹：存放头像和网页 logo 等图片
个人信息页面：
├── blog.qmd # 博客文章列表页面
├── books.qmd # 阅读/推荐书籍页面
├── chinese.qmd # 中文内容页面
├── codes.qmd # 代码资源页面
├── publications.qmd # 学术成果页面
├── teaching.md # 教学资源页面
生成的网站：
├── docs/ # 文件夹：渲染生成后的网页目录，用于部署到 GitHub Pages
其他配置信息
├── site_libs/ # Quarto 构建生成的支持库（可忽略）
├── _extensions/ # Quarto 扩展插件目录（如 webr，可以忽略）
├── license # 版权声明
└── _freeze/ # Quarto 自动管理的中间结果缓存（可忽略）
index.qmd 是主页的主要内容文件，包含个人介绍、研究方向等信息。你可以在其中添加 Markdown 格式的文本、图片、链接等。头部信息
_quarto.yml 是 Quarto 的配置文件，定义了网站的结构、导航栏、主题等。你可以在其中修改网站标题、副标题、菜单项等。
project:
type:website # 项目类型设定为网站（website）
output-dir:docs # 编译后输出到 docs 文件夹（GitHub Pages 默认部署目录）
website:
page-navigation:true # 启用页面内的导航功能（如下一页、上一页）
title:"Yujun Lian" # 网站标题，将显示在浏览器标题栏和导航栏左侧
site-url:https://lianyujun.github.io # 网站的完整网址（用于生成 sitemap 和 SEO）
favicon:images/site-logo.png # 网页图标（浏览器标签页显示的小图标）
repo-url:https://github.com/lianyujun/lianyujun.github.io# 关联的 GitHub 仓库地址
repo-actions:[edit,issue] # 页面右上角显示 "Edit this page" 和 "Report issue" 链接
page-footer: # 网页底部信息
left:| # 左侧内容，可使用 Markdown 格式
[lianxh.cn](https://www.lianxh.cn)
right:| # 右侧内容
Madewith[Quarto](https://quarto.org/)
navbar: # 顶部导航栏设置
background:"#A9CCE3"# 设置导航栏背景色（十六进制颜色码）
search:true # 启用全站搜索功能（右上角搜索框）
right: # 导航栏右侧菜单项
-text:"Home" # 首页链接
href:index.qmd
-text:"Publications" # 学术成果页
href:publications.qmd
-text:"Books" # 推荐书单页
href:books.qmd
-text:"Blogs" # 博客文章页
href:blog.qmd
-text:"Codes" # 代码资源页
href:codes.qmd
-text:"中文" # 中文内容页面
href:Chinese.qmd
-text:"CV" # 简历 PDF
href:CV.pdf
format:
html:
theme:styles.scss # 自定义主题样式，引用本地 SCSS 文件
toc:true # 启用侧边目录（Table of Contents）
toc-position:right # 目录位置设为右侧
toc-depth:3 # 设置目录的最大层级（H3 级标题）
Step 3: 渲染网页并预览
在 VSCode 中按快捷键 Ctrl + ~ 打开终端，依次执行如下命令：
切换到项目根目录。命令为 (路径为你的仓库所在文件夹)：
cd D:\github_lianyujun\lianyujun.github.io
渲染网页。执行如下命令：
quarto render
该命令会将 .qmd 文件编译为 HTML 网页，输出到
docs/ 文件夹中。
20250718173551预览网页。生成的网页位于 docs/ 文件夹下，双击 index.html 即可本地浏览。
Step 4: 部署上线
上一步完成后，docs/ 文件夹下已经生成了你的个人主页的的完整 HTML 文档 (本地文档)，你可以将其部署到 GitHub Pages 上，以便其他人访问。
将本地文件推送到远程仓库。
- 在 GitHub Desktop 中，填写备注信息，然后点击
Commit to main 提交更改； - 然后点击
Push origin 将更改推送到 GitHub。
在 GitHub 远程仓库中设置 GitHub Pages：
- 在
Source 部分，选择 main 分支，并设置 /docs 目录作为发布目录；
等待几分钟后，你就可以通过 https://yourusername.github.io/ 访问自己的个人主页了。我的主页地址是 https://lianyujun.github.io/，页面内容就是大家在推文开头部分看到的效果。
Step 5：在你的 github 仓库中显示个人主页地址
为了让其他人更容易找到你的个人主页，你可以在 GitHub 个人主页仓库的介绍信息中添加主页链接：
- 打开 GitHub 个人主页仓库 lianyujun/lianyujun.github.io，点击右上方 设置 按钮 (齿轮形状)。
- 在弹出的对话框中，找到 Website 一栏，勾选 Use your GitHub Pages website，你的个人主页地址将自动填入。Note：如果你使用的是自定义域名，可以在这里填写你的域名。
Step 6：更新与维护
若需更新，可以先在本地修改 index.qmd、_quarto.yml 等文件，然后按照 Step 3 的方法重新执行 quarto render 命令编译网页，最后在 GitHub Desktop 中提交并推送更改即可。
6. 进一步扩展与美化
在成功部署基础主页之后，你可以根据自己的需求，对页面结构、内容模块、功能样式进行进一步扩展。Quarto 提供了极强的灵活性和模块化设计，便于维护和美化。
A. 使用分类与标签管理博客内容
Quarto 支持为每篇博客文章添加 categories: 和 tags: 字段。
可以自动生成分类页或标签云页面，便于导航。
详情参见 chizapoth.github.io (github)。
B. 使用交互式图表或嵌入代码输出
Quarto 支持 R、Python、Julia 等语言嵌入代码块，输出图表。
比如在 projects.qmd 中嵌入 matplotlib、plotly 的代码与图表展示。
参见 Kazuyuki Nagimoto 主页中 Research Workflow with Quarto + {targets} 页面 (点击此处 查看对应的 .qmd 文档)。
C. 绑定自定义域名（可选）
- 如果你购买了自己的域名（如
.com），可在 GitHub Pages 的设置中绑定该域名，并将 DNS 指向 GitHub 的 IP 地址。如 Kazuyuki Nagimoto 主页。 - 然后在仓库根目录添加一个
CNAME 文件，内容为你的域名（如 www.mydomain.com），GitHub 会自动配置 HTTPS 证书。
7. 优秀模板示例
如果你希望学习得更深入，这里是一些推荐资料和 Quarto 主页的优秀示例，可供模仿或参考。
官方教程与文档
- Quarto 官方网站：https://quarto.org/docs/
- 创建 Quarto 网站教程（Sam Csik）：网页，GitHub
风格各异的模板推荐
| |
|---|
| |
| valegiunchiglia.github.io | |
| |
| |
| |
| |
更多模板可以在 GitHub 上搜索 .github.io + quarto + personal 得到，参见 GitHub 搜索结果。
8. 相关推文
Note：产生如下推文列表的 Stata 命令为：
lianxh quarto github 个主页 VScode , md nocat ex(搜索 资源 金融 命令 交互)
安装最新版 lianxh 命令：
ssc install lianxh, replace
- 初虹, 2022, Markdown-LaTeX：经管人的VSCode配置大全, 连享会 No.1004.
- 初虹, 2024, 让「记录」变得简单：Markdown使用详解, 连享会 No.1456.
- 左祥太, 2022, 如何搭建个人主页-GitHub / Gitee, 连享会 No.1005.
- 李原, 2024, 使用 Quarto 打造你的个人主页, 连享会 No.1338.
- 杨涵慧, 2024, 如何使用Github创建你的个人主页？, 连享会 No.1337.
- 王胜文, 2023, VScode编辑器：常用快捷键-Markdown专题, 连享会 No.1174.
- 范思妤, 2022, GitHub中最受欢迎的Stata仓库, 连享会 No.1022.
- 连享会, 2024, AI编程助手大盘点：不止ChatGPT和Copilot, 连享会 No.1394.
- 连享会, 2020, 在 Visual Studio (vsCode) 中使用正则表达式, 连享会 No.10.
- 连小白, 2025, vscode.dev：在线版 VScode 使用指南, 连享会 No.1620.
- 连玉君, 2023, Stata编程：快速查找Stata代码片段, 连享会 No.1319.
- 连玉君, 2024, VScode插件：安装、配置和使用, 连享会 No.1490.
- 连玉君, 2024, VScode：实用 Markdown 插件推荐, 连享会 No.1390.
- 连玉君, 2024, 从基础到 AI 助手：Python 用户最爱的 VScode 插件清单, 连享会 No.1489.
- 连玉君, 2025, 无法下载github仓库中的数据？网页跳转的原理与 Stata、R、Python 解决方案, 连享会 No.1628.
- 连玉君, 2021, 用VScode正则表达式转换Markdown和LaTeX链接, 连享会 No.839.
- 郝亮, 2025, Quarto 助力论文和讲义撰写, 连享会 No.1592.
- 黄晨晨, 2023, Stata：利用Stata生成动态文档-Quarto, 连享会 No.1304.
🍓 课程推荐：连享会：2025社会网络分析·线上
嘉宾：杨张博，西安交通大学
时间：2025 年 7 月 30-31 日
咨询：王老师 18903405450（微信）
连享会微信小店上线啦！
Note：扫一扫进入“连享会微信小店”，你想学的课程在这里······
New！ Stata 搜索神器：lianxh 和 songblGIF 动图介绍
搜： 推文、数据分享、期刊论文、重现代码 ……
👉 安装：
. ssc install lianxh
. ssc install songbl
👉 使用：
. lianxh DID 倍分法
. songbl all
🍏 关于我们
- 直通车： 👉【百度一下：连享会】即可直达连享会主页。亦可进一步添加 「知乎」,「b 站」,「面板数据」,「公开课」 等关键词细化搜索。
