http://blog.csdn.net/pipisorry/article/details/51707366
Build your site with GitHub
GitHub has designed the pages feature to allow users to customize the project home page to replace the default source list. So, github pages can be thought of as user-authored static Web pages hosted on GitHub. GitHub provides templates that allow Web pages to be generated within the site, but also allows users to write their own web pages and upload them. Interestingly, this upload is not a simple upload, but will go through the Jekyll process.
Jekyll (pronunciation/' dʒiːkəl/, ' Jackel ') is a static site generator that generates static files based on the source of the Web page. It provides templates, variables, plug-ins, and so on, so you can actually write an entire Web site.
and the traditional personal blog system, the traditional personal blog can only provide posts, comments and so on, and on GitHub built a station, like a painting of white paper, very pure, very free, people can customize the above content, enjoy the creativity of their own.
use GitHub to build your station ideas
Write a local source code that complies with the Jekyll specification, then upload it to GitHub and build and host the entire site from GitHub.
The benefits of this approach are:
* Free, unlimited traffic.
* Enjoy Git's versioning features without worrying about missing articles.
* You just have to use your favorite editor to write articles, other things do not worry about, are processed by GitHub.
Its disadvantages are:
* There is a certain technical threshold, you have to understand a little git and web development.
* It generates a static web page, adding dynamic features must use external services, such as commenting function can only be used disqus.
* It is not suitable for large web sites, because the database is not used, each run must traverse the entire text file, the larger the site, the longer the build time.
Phi Blog
easily use Github.io to build personal sites {Absolutely the simplest way to build a site, a user can only create one}
Git is installed and has a GitHub account.
To create a new library, the name must be: Username.github.io. #username是你的github用户名.
After you've created it, clone it locally.
Create a index.html, save, upload in clone's local directory.
Open your browser and enter your Username.github.io in the address bar. You can see the HTML page you just uploaded.
Sometimes it takes a long time to see the effect after modifying the indel.html file.
In Note:index.html, JavaScript and CSS files can be called.
Phi Blog
Build your site with GitHub
{GitHub Station Mode 2}
Git is installed and has a GitHub account.
The first step is to create the project
On your computer, create a directory as the main directory for the project. We assume that its name is pipi_ghpages.
$ mkdir Pipi_ghpages
Git initializes the directory.
$ CD Pipi_ghpages
$ git init
Then, create a branch gh-pages that does not have a parent node. Because GitHub specifies that only the pages in that branch will generate a Web page file.
$ git checkout--orphan gh-pages
All of the following actions are done under this branch. second step, create the settings file
Under the project root directory, create a text file named _config.yml. It is the Jekyll settings file, we fill in the following content, other settings can be used by default options, specific explanation see the official page.
$ VI _config.yml
BaseURL:/pipi_ghpages
The directory structure becomes:
/pipi_ghpages
|--_config.yml Step Three, create a template file
Under the project root, create a _layouts directory to hold the template files.
$ mkdir _layouts
CD!$
Enter the directory and create a default.html file as the default template for the blog. and fill in the file with the following content.
$ VI default.html
<! DOCTYPE html>
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title>{{Page.title}}</title>
<body>
{Content}}
</body>
Jekyll uses the liquid template language, {{page.title}} to represent the article title, {{content}} for the article content, and more template variables refer to the official documentation.
The directory structure becomes:
/pipi_ghpages
|--_config.yml
|--_layouts
| |--default.html Fourth Step, create an article
Go back to the project root and create a _posts directory to hold blog posts.
$ CD.
$ mkdir _posts
$ CD!$
Enter the directory to create the first article. The article is an ordinary text file, the file name is assumed to be 2016-06-18-hello-world.html. (Note that the file name must be in the format "year-month-day-article title. Suffix name". If the page code is in HTML format, the suffix is HTML, and if the markdown format is used, the suffix is md. ）
In the file, fill in the following: (note that there must be no spaces at the beginning of the line)
$ VI 2016-06-18-hello-world.html
---
Layout:default
Title: Hello, World
---
<p> my first post </p>
<p>{{page.date | date_to_string}}</p>
Yaml file Header: The head of each article must have a Yaml file header that is used to set some meta data. It uses three dashes "---", marks the start and end, and each row sets a meta-data. Three dashes in front of the dash, there is no space. If you use Windows, you must confirm that the file is saved without a BOM.
"Layout:default", which indicates that the template for the article uses the default.html file under the _layouts directory;
"Title: Hello, World", said the title of the article is "Hello, world", if you do not set this value, the default is to use the title of the embedded file name, that is "Hello worlds."
After the Yaml file header, it is the official content of the article, which can use template variables. {{Page.title}} is the "Hello, World" set in the file header, {{page.date}} is the date of the embedded file name (you can also redefine the day variable in the header), "| Date_to_string "means converting the page.date variable into a human-readable format.
The directory structure becomes:
/pipi_ghpages
|--_config.yml
|--_layouts
| |--default.html
|--_posts
| |--2012-08-25-hello-world.html Fifth Step, create homepage
With the article, you also need to have a home page.
Go back to the root directory, create a index.html file, and fill in the following content.
$ CD.
$ VI index.html
---
Layout:default
Title: My Blog
---
<p> Latest Articles </p>
<ul>
{% for post in site.posts%}
<li>{{post.date | date_to_string}} <a href= "{{Site.baseurl}}{{Post.url}}" >{{Post.title}}</a>< /li>
{% ENDFOR%}
</ul>
Its Yaml file header indicates that the home page uses the default template, titled "My Blog". The first page then uses {% for post in site.posts%}, which means a traversal of all posts. Note here that the Liquid template language stipulates that the output uses two curly braces, and the simple command uses a single layer of curly braces. As for {{Site.baseurl}} is the BaseURL variable set in _CONFIG.YML.
The directory structure becomes:
/pipi_ghpages
|--_config.yml
|--_layouts
| |--default.html
|--_posts
| |--2012-08-25-hello-world.html
|--index.html Sixth step, release content
Now, this simple blog can be published. Add all the content to your local git repository first.
$ git Add.
$ git commit-m "first post"
Then, go to the GitHub site to create a library named Pipi_ghpages. Next, push the local content to the library you just created on GitHub. Note that the username in the command below will be replaced by your username.
$ git Remote add Origin https://github.com/username/pipi_ghpages.git
$ GIT push origin gh-pages
Note: For git push to succeed, at least first configure GitHub. [Git version control tutorial-git remote repository: Git remote repository ssh settings]
After uploading the success, wait 10 minutes or so, visit http://pipilove.github.com/pipi_ghpages/can see the blog has been generated (username replaced by your username).
seventh step, bind domain name (optional)
If you do not want to use http://username.github.com/pipi_ghpages/this domain name, can be replaced by your own domain name.
The specific method is to create a new text file named CNAME under the root directory of repo, which writes the domain name you want to bind to, such as example.com or xxx.example.com.
If you are binding a top-level domain, DNS creates a new a record, pointing to 204.232.175.78. If you are binding a level two domain name, then DNS will create a new CNAME record, pointing to username.github.com (please replace username with your user name). Also, don't forget to change the BaseURL in the _config.yml file to the root directory "/".
At this point, the simplest blog even if the building is complete. For further improvement, please refer to the Jekyll Founder's sample library, as well as other blogs built with Jekyll.
[Build a free, unlimited-Flow blog----github pages and Jekyll]
from:http://blog.csdn.net/pipisorry/article/details/51707366
ref:https://help.github.com/categories/github-pages-basics/
[Build a forum from scratch (1): Web server and web framework]
[Http://www.0101520.com/post/2017/03/jekyll-introduction.html]
Built a new website with GitHub + Hexo + Next Theme [I will change a platform to write technical articles]
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
