-
Notifications
You must be signed in to change notification settings - Fork 0
/
tong-guo-github-pageda-jian-ge-ren-blog.html
133 lines (125 loc) · 12.3 KB
/
tong-guo-github-pageda-jian-ge-ren-blog.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<!DOCTYPE html>
<html>
<head>
<title>通过Github Page搭建个人Blog - Call me Andy</title>
<meta charset="utf-8" />
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" />
<link href="/theme/static/css/style.css" rel="stylesheet" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
</head>
<body id="index" class="archive">
<div class="container">
<div class="header">
<ul class="nav nav-pills pull-right">
<li class=""><a href="">Home</a></li>
<li><a href="/archives.html">Archives</a></li>
</ul>
<h3 class="text-muted"><a href="">Call me Andy</a></h3>
<h2 class="text-muted"></h2>
</div>
<section id="content" class="article content">
<header>
<h2 class="entry-title">
<a href="/tong-guo-github-pageda-jian-ge-ren-blog.html" rel="bookmark"
title="Permalink to 通过Github Page搭建个人Blog">通过Github Page搭建个人Blog</a></h2>
</header>
<div class="entry-content">
<hr />
<p><strong><em>WARMING:本文将介绍介绍如何使用Mac在Github Page上搭建个人Blog</em></strong></p>
<hr />
<p>通过一个晚上的的努力和折腾，终于把Gihub Page的个人Blog搭建好了。所以有了这第一篇Blog。
至于为什么在Github Page上搭建Blog的原因：</p>
<h2>准备阶段</h2>
<ul>
<li>
<h3>Github账号</h3>
<p>因为要在Github Page上搭建Blog，所以你需要一个<a href="https://github.com">Github</a>账号。</p>
</li>
<li>
<h3>Github Page</h3>
<p>在<a href="http://pages.github.com/">Github Page</a>上创建自己的主页，这时候会生成一个<code>your_git_hub_account/your_git_hub_account.github.io</code>的代码库和<code>username.github.io</code>的主页（可能需要等几分钟）。</p>
</li>
<li>
<h3>Ruby</h3>
<p>因为以下所需要的一些工具是由<a href="https://www.ruby-lang.org/">Ruby</a>写的，所以需要安装Ruby。由于本人使用自带Ruby的Mac系统，所以就没有经历这步。</p>
</li>
<li>
<h3>pelican</h3>
<p><a href="http://blog.getpelican.com/">pelican</a>是一个静态网站生成工具，无需数据库以及服务器逻辑，所以拿来做Blog挺合适的。
通过<code>sudo easy-install pelican</code>进行安装。</p>
</li>
<li>
<h3>Markdown</h3>
<p>Markdown是一种轻量级标记语言，我们就是用它来写Blog。你可能需要一个Markdown编辑器，Mac系统推荐使用<a href="http://mouapp.com/">Mou</a>。通过<code>sudo easy-install markdown</code>进行安装。
用了两天，觉得还可以，能够马上看到效果。就是不知道有没有插件什么的。
<img alt="UI" src="https://photos-4.dropbox.com/t/0/AABNIVo8TjnJG42Lo9meBC_up4hDaJnIlCPxkfaIi9Zx2Q/12/228786831/png/1024x768/3/1393606800/0/2/mou.png/_R75xGqRvuGEPyn-zF1y20B892LPf0sqvO6D650cJk4" /></p>
</li>
</ul>
<hr />
<h2>搭建Blog</h2>
<h3>pelican-quickstart</h3>
<p>首先创建一个pelican的工作目录文件夹<code>mkdir ~/Documents/MyBlog; cd ~/Documents/MyBlog</code>（这里一定不能用中文）。再通过<code>pelican-quickstart</code>创建pelican工作目录，这里会有一系列初始配置项需要设置，我的配置是这样的。</p>
<div class="highlight"><pre><span class="n">Where</span> <span class="k">do</span> <span class="n">you</span> <span class="n">want</span> <span class="n">to</span> <span class="n">create</span> <span class="n">your</span> <span class="n">new</span> <span class="n">web</span> <span class="n">site</span><span class="o">?</span> <span class="p">[.]</span>
<span class="n">What</span> <span class="n">will</span> <span class="n">be</span> <span class="n">the</span> <span class="n">title</span> <span class="n">of</span> <span class="n">this</span> <span class="n">web</span> <span class="n">site</span><span class="o">?</span> <span class="n">Your</span> <span class="n">site</span> <span class="n">title</span>
<span class="n">Who</span> <span class="n">will</span> <span class="n">be</span> <span class="n">the</span> <span class="n">author</span> <span class="n">of</span> <span class="n">this</span> <span class="n">web</span> <span class="n">site</span><span class="o">?</span> <span class="n">Your</span> <span class="n">name</span>
<span class="n">What</span> <span class="n">will</span> <span class="n">be</span> <span class="n">the</span> <span class="k">default</span> <span class="n">language</span> <span class="n">of</span> <span class="n">this</span> <span class="n">web</span> <span class="n">site</span><span class="o">?</span> <span class="p">[</span><span class="n">en</span><span class="p">]</span>
<span class="n">Do</span> <span class="n">you</span> <span class="n">want</span> <span class="n">to</span> <span class="n">specify</span> <span class="n">a</span> <span class="n">URL</span> <span class="n">prefix</span><span class="o">?</span> <span class="n">e</span><span class="p">.</span><span class="n">g</span><span class="p">.,</span> <span class="n">http</span><span class="o">:</span><span class="c1">//example.com (Y/n) n</span>
<span class="n">Do</span> <span class="n">you</span> <span class="n">want</span> <span class="n">to</span> <span class="n">enable</span> <span class="n">article</span> <span class="n">pagination</span><span class="o">?</span> <span class="p">(</span><span class="n">Y</span><span class="o">/</span><span class="n">n</span><span class="p">)</span>
<span class="n">How</span> <span class="n">many</span> <span class="n">articles</span> <span class="n">per</span> <span class="n">page</span> <span class="k">do</span> <span class="n">you</span> <span class="n">want</span><span class="o">?</span> <span class="p">[</span><span class="mi">10</span><span class="p">]</span>
<span class="n">Do</span> <span class="n">you</span> <span class="n">want</span> <span class="n">to</span> <span class="n">generate</span> <span class="n">a</span> <span class="n">Fabfile</span><span class="o">/</span><span class="n">Makefile</span> <span class="n">to</span> <span class="n">automate</span> <span class="n">generation</span> <span class="n">and</span> <span class="n">publishing</span><span class="o">?</span> <span class="p">(</span><span class="n">Y</span><span class="o">/</span><span class="n">n</span><span class="p">)</span>
<span class="n">Do</span> <span class="n">you</span> <span class="n">want</span> <span class="n">an</span> <span class="k">auto</span><span class="o">-</span><span class="n">reload</span> <span class="o">&</span> <span class="n">simpleHTTP</span> <span class="n">script</span> <span class="n">to</span> <span class="n">assist</span> <span class="n">with</span> <span class="n">theme</span> <span class="n">and</span> <span class="n">site</span> <span class="n">development</span><span class="o">?</span> <span class="p">(</span><span class="n">Y</span><span class="o">/</span><span class="n">n</span><span class="p">)</span>
<span class="n">Do</span> <span class="n">you</span> <span class="n">want</span> <span class="n">to</span> <span class="n">upload</span> <span class="n">your</span> <span class="n">website</span> <span class="n">using</span> <span class="n">FTP</span><span class="o">?</span> <span class="p">(</span><span class="n">y</span><span class="o">/</span><span class="n">N</span><span class="p">)</span>
<span class="n">Do</span> <span class="n">you</span> <span class="n">want</span> <span class="n">to</span> <span class="n">upload</span> <span class="n">your</span> <span class="n">website</span> <span class="n">using</span> <span class="n">SSH</span><span class="o">?</span> <span class="p">(</span><span class="n">y</span><span class="o">/</span><span class="n">N</span><span class="p">)</span>
<span class="n">Do</span> <span class="n">you</span> <span class="n">want</span> <span class="n">to</span> <span class="n">upload</span> <span class="n">your</span> <span class="n">website</span> <span class="n">using</span> <span class="n">Dropbox</span><span class="o">?</span> <span class="p">(</span><span class="n">y</span><span class="o">/</span><span class="n">N</span><span class="p">)</span>
<span class="n">Do</span> <span class="n">you</span> <span class="n">want</span> <span class="n">to</span> <span class="n">upload</span> <span class="n">your</span> <span class="n">website</span> <span class="n">using</span> <span class="n">S3</span><span class="o">?</span> <span class="p">(</span><span class="n">y</span><span class="o">/</span><span class="n">N</span><span class="p">)</span>
<span class="n">Do</span> <span class="n">you</span> <span class="n">want</span> <span class="n">to</span> <span class="n">upload</span> <span class="n">your</span> <span class="n">website</span> <span class="n">using</span> <span class="n">Rackspace</span> <span class="n">Cloud</span> <span class="n">Files</span><span class="o">?</span> <span class="p">(</span><span class="n">y</span><span class="o">/</span><span class="n">N</span><span class="p">)</span>
</pre></div>
<p>这时改目录下按照你的配置创建出pelican的工作目录，介绍几个基本的文件</p>
<div class="highlight"><pre><span class="n">pelicanconf</span><span class="p">.</span><span class="n">py</span><span class="err">——用于生成</span><span class="n">html</span><span class="err">的配置文件，包含输出文件夹、主题等</span>
<span class="n">publishconf</span><span class="p">.</span><span class="n">py</span><span class="err">——用于发布的配置文件</span>
<span class="n">Makefile</span><span class="err">——</span><span class="n">make</span><span class="err">工具的执行脚本</span>
<span class="n">content</span><span class="err">——存放你写的</span><span class="n">Blog</span><span class="err">用的</span>
<span class="n">output</span><span class="err">——默认生成静态</span><span class="n">html</span><span class="err">的输出文件夹</span>
</pre></div>
<h3>码字</h3>
<p>使用Markdown编辑器写你第一篇Blog，并保存在content中。</p>
<h3>生成静态html</h3>
<p>在终端<code>cd ~/Documents/MyBlog; make html</code>，这样pelican就会生成你Blog的静态html。</p>
<h3>本地测试效果</h3>
<p>在终端<code>make serve</code>，然后通过浏览器访问<code>http://localhost:8000/</code>就可以看到效果了。</p>
<h3>clone你Blog的默认源码</h3>
<p>在终端<code>cd ~/Documents/MyBlog; git clone [email protected]:your_git_hub_account/your_git_hub_account.github.io</code>， clone下你的Github Page默认源码。</p>
<h3>发布你的主页</h3>
<p>将output文件夹的内容替换掉你clone下的默认源码<code>git commit -a -m 'upload blog html'; git push origin master</code>，这样你的Blog就已经上传到Github Page上了。通过<code>http://your_git_hub_account.github.io/</code>就可以访问了。</p>
<p>至此大功告成，打完收工。</p>
<hr />
<h2>更多</h2>
<p>当然上面发布的页面是十分丑陋的。你还可以添加主题、评论、社交账号什么的。这些设置也十分简单，可以自行搜索设置。</p>
<hr />
<h2>引用</h2>
<p>本人搭建过程中参考了许多其他人的教程，在此引用致谢。
http://www.lizherui.com/pages/2013/08/17/build_blog.html
https://gist.github.com/josefjezek/6053301
http://zonca.github.io/2013/09/automatically-build-pelican-and-publish-to-github-pages.html
http://martinbrochhaus.com/pelican2.html<br />
http://ntanjerome.org/blog/how-to-setup-github-user-page-with-pelican </p>
</div><!-- /.entry-content -->
<footer class="post-info text-muted">
Posted on <abbr class="published" title="2014-02-08T00:00:00">
六 08 二月 2014
</abbr>
<address class="vcard author">
by <a class="url fn" href="/author/andy.html">Andy</a>
</address> in <a href="/category/misc.html">misc</a> Tagged </footer><!-- /.post-info -->
</section>
<footer id="contentinfo" class="footer">
<nav class="pull-right bottom-nav">
<a href="/None">RSS</a>
</nav>
<address id="about" class="vcard body">
© <a href="">Call me Andy</a> Proudly powered by <a href="http://getpelican.com/">Pelican</a>
</address><!-- /#about -->
</footer><!-- /#contentinfo -->
</div><!-- container -->
</body>
</html>