Create a site or blog from your GitHub repositories with GitHub Pages.
With GitHub Pages, you can host project blogs, documentation, resumes, portfolios, or any other static content you'd like. Your GitHub repository can easily become its own website. In this course, we'll show you how to set up your own site or blog using GitHub Pages.
Welcome to GitHub Pages and Jekyll :tada:!
The first step is to enable GitHub Pages on this repository. When you enable GitHub Pages on a repository, GitHub takes the content that's on the main branch and publishes a website based on its contents.
main
from the Branch drop-down menu.Turning on GitHub Pages creates a deployment of your repository. GitHub Actions may take up to a minute to respond while waiting for the deployment. Future steps will be about 20 seconds; this step is slower. Note: In the Pages of Settings, the Visit site button will appear at the top. Click the button to see your GitHub Pages site.
You turned on GitHub Pages! :tada:
We'll work in a branch, my-pages
, that I created for you to get this site looking great. :sparkle:
Jekyll uses a file titled _config.yml
to store settings for your site, your theme, and reusable content like your site title and GitHub handle. You can check out the _config.yml
file on the Code tab of your repository.
We need to use a blog-ready theme. For this activity, we will use a theme named "minima".
_config.yml
file in the my-pages
branch.theme:
set to minima so it shows in the _config.yml
file as below:theme: minima
title:
, author:
, and description:
to further customize your site.base: main
and compare:my-pages
.Nice work setting the theme! :sparkles:
You can customize your homepage by adding content to either an index.md
file or the README.md
file. GitHub Pages first looks for an index.md
file. Your repository has an index.md
file so we can update it to include your personalized content.
index.md
file in the my-pages
branch.title:
or just ignore it for now. We'll discuss it in the next step.my-pages
branch.Your home page is looking great! :cowboy_hat_face:
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.
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:
---
title: "Welcome to my blog"
date: 2019-01-20
---
For more information about configuring front matter, see the Jekyll frontmatter documentation.
my-pages
branch.Add file
dropdown menu and then on Create new file
._posts/YYYY-MM-DD-title.md
.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".
---
title: "YOUR-TITLE"
date: YYYY-MM-DD
---
YOUR-TITLE
with the title for your blog post.YYYY-MM-DD
with today's date.Nice work, friend :heart:! People will be reading your blog in no time!
You can now merge your pull request!
my-pages
into main
. If you created the pull request in step 2, just open that PR and click on Merge pull request. If you did not create the pull request earlier, you can do it now by following the instructions in step 2.my-pages
.Congratulations friend, you've completed this course!
Your blog is now live and has been deployed!
Here's a recap of all the tasks you've accomplished in your repository:
Get help: Post in our discussion board • Review the GitHub status page
© 2022 GitHub • Code of Conduct • MIT License