skills-github-pages/README.md

75 lines
3.0 KiB
Markdown
Raw Normal View History

2024-10-23 15:33:27 +08:00
<header>
<!--
<<< Author notes: Course header >>>
Include a 1280×640 image, course title in sentence case, and a concise description in emphasis.
In your repository settings: enable template repository, add your 1280×640 social image, auto delete head branches.
Add your open source license, GitHub uses MIT license.
-->
# GitHub Pages
_Create a site or blog from your GitHub repositories with GitHub Pages._
</header>
<!--
2024-10-23 15:49:54 +08:00
<<< Author notes: Step 4 >>>
2024-10-23 15:46:21 +08:00
Start this step by acknowledging the previous step.
Define terms and link to docs.github.com.
2024-10-23 15:49:54 +08:00
Historic note: previous version checked the file path. Previous version checked the front matter formatting.
2024-10-23 15:33:27 +08:00
-->
2024-10-23 15:49:54 +08:00
## Step 4: Create a blog post
2024-10-23 15:33:27 +08:00
2024-10-23 15:49:54 +08:00
_Your home page is looking great! :cowboy_hat_face:_
2024-10-23 15:33:27 +08:00
2024-10-23 15:49:54 +08:00
GitHub Pages uses Jekyll. In Jekyll, we can create a blog by using specially named files and frontmatter. The files must be named `_posts/YYYY-MM-DD-title.md`. You must also include `title` and `date` in your frontmatter.
2024-10-23 15:33:27 +08:00
2024-10-23 15:49:54 +08:00
**What is _frontmatter_?**: The syntax Jekyll files use is called YAML frontmatter. It goes at the top of your file and looks something like this:
2024-10-23 15:33:27 +08:00
2024-10-23 15:49:54 +08:00
```yml
---
title: "Welcome to my blog"
date: 2019-01-20
---
```
For more information about configuring front matter, see the [Jekyll frontmatter documentation](https://jekyllrb.com/docs/frontmatter/).
### :keyboard: Activity: Create a blog post
1. Browse to the `my-pages` branch.
1. Click the `Add file` dropdown menu and then on `Create new file`.
1. Name the file `_posts/YYYY-MM-DD-title.md`.
1. Replace the `YYYY-MM-DD` with today's date, and change the `title` of your first blog post if you'd like.
> If you do edit the title, make sure there are hyphens between your words.
> If your blog post date doesn't follow the correct date convention, you'll receive an error and your site won't build. For more information, see "[Page build failed: Invalid post date](https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/troubleshooting-jekyll-build-errors-for-github-pages-sites)".
1. Type the following content at the top of your blog post:
```yaml
---
title: "YOUR-TITLE"
date: YYYY-MM-DD
---
```
1. Replace `YOUR-TITLE` with the title for your blog post.
1. Replace `YYYY-MM-DD` with today's date.
1. Type a quick draft of your blog post. Remember, you can always edit it later.
1. Commit your changes to your branch.
2024-10-23 15:46:21 +08:00
1. Wait about 20 seconds then refresh this page (the one you're following instructions from). [GitHub Actions](https://docs.github.com/en/actions) will automatically update to the next step.
2024-10-23 15:33:27 +08:00
<footer>
<!--
<<< Author notes: Footer >>>
Add a link to get support, GitHub status page, code of conduct, license link.
-->
---
Get help: [Post in our discussion board](https://github.com/orgs/skills/discussions/categories/github-pages) &bull; [Review the GitHub status page](https://www.githubstatus.com/)
&copy; 2023 GitHub &bull; [Code of Conduct](https://www.contributor-covenant.org/version/2/1/code_of_conduct/code_of_conduct.md) &bull; [MIT License](https://gh.io/mit)
</footer>