无需编程,零成本!只需挑选一个主题,经过配置,加入内容即可。
作者 | Stephen Vinouze
译者 | 弯月,责编 | 郭芮
头图 | CSDN 下载自东方IC
出品 | CSDN(ID:CSDNnews)
以下为译文:
创建一个网站的工作量不容小觑。即便你拥有编程背景,也有可能在网络上迷失方向,究竟从何处下手呢?
我可以在此承诺,读完本文,你的收获包括:
一个免费的优雅网站,甚至无需托管。
一个评论框,让读者与你互动。
一个邮件订阅列表,用于通知用户你新发布的内容。
使用分析工具来跟踪读者的行为。
以及其他高级的主题。
首先给你看一下我最近构建的网站(
https://www.stephenvinouze.com/),很酷吧?
我花了大量时间整理和研究有关静态网站生成器的文章。本文汇总了我获取的所有信息,希望能为你呈现一份完整的指南。
下面,我们开始吧!
前提条件
刚才我曾说构建新网站不需要花费1分钱,这要感谢GitHub Pages(https://pages.github.com/)。
你只需创建一个GitHub账号,即可免费托管你的网站。版本管理与部署的工作可以全权委托给Github。非常方便!
你甚至不需要懂得HTML或CSS,尽管了解这些更好。GitHub Pages使用Jekyll将Markdown文件转换成HTML,所以你只需要关注内容即可。
所以前提条件是:
拥有GitHub账号。
了解Git的基本知识。不需要是专家,甚至可以直接在GitHub的Web界面上操作。
了解怎样书写Markdown,通过官方的速查表(
https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet)分分钟就能学会。
如果这些都没问题,那么我们就来看看最激动人心的部分吧!
选择主题
这是本文最重要的部分!你可以慢慢选择最适合需要的模板。
你可以找到一大堆免费的主题。这些主题都有详尽的文档,适用于各种情况,不论你想建立个人博客,还是建立个人主页。当然你也可以花钱选择付费主题。
例如,我的博客选择了Mediumish主题。感谢WowThemes免费提供了这个优秀的主题。
浏览这些主题,点击“Live Demo”按钮可以看到实时的预览。找到你想要的那个!
部署网站
假设你已经建好了GitHub账号。仔细看看GitHub Pages的文档就会知道(https://pages.github.com/),你应该建立一个Git仓库,取名为your_username.github.io。
我们跳过这些设置的步骤。毕竟,我们选择主题的目的就是为了跳过这些设置步骤。你可不想在设置上花费一整天。
根据你选择的模板的Git仓库建立分叉。模板页面上应该有一个链接,点击后就能创建一个复制的Git仓库,你可以在这个仓库中写入内容。
分叉之后,你需要将这个仓库的名字改成your_username.github.io。点击“Settings”,然后重命名仓库:
试试看!你的网站应该已经可以使用了!在浏览器中打开一个新的页面,输入URL:
http://your_username.github.io/ (将your_username替换为你的用户名)。
如果还有疑问,可以比较一下你和我的代码库。
https://github.com/StephenVinouze/stephenvinouze.github.io
准备自己的版本
GitHub会从master分支部署网站。记住,推送到master上的任何修改都会导致网站重新部署。
所以在开始之前,我建议你先创建一个develop分支。在将develop合并到master之前,所有的改变都不会影响网站的内容。
使用develop分支,你可以尝试任何东西而不用担心把网站搞坏。
测试改动
你肯定想看看develop分支的改动会对网站产生什么影响。我们可以在本地部署。打开控制台,在你克隆git仓库的地方输入下列命令:
$ bundle exec jekyll serve -- watch
然后用浏览器打开这个地址:http://localhost:4000/
你可以一直保留这个终端窗口,网站就会在你自己的机器上一直运行,直到你关闭为止。
配置网站
现在你的网站还只是一个空壳,我们来添加一些内容。
注意:我建议把这篇文章当作一个指南。并非所有主题的配置都一样。如果你选的主题和我选的不一样,那么我在文章里写的并不一定适合你。请仔细阅读主题本身的文档。
首先,我们来看看_config.yml文件,这里有许多神奇的配置。有几个参数需要按照自己的需要更新。
你可以自行配置一些东西,例如:
联系信息
头像
社交网络链接
重启Jekyll进程,然后刷新页面,就能看到修改的效果。
需要提醒你,在改变_config.yml文件后,必须重新启动Jekyll才能看到效果。对于其他文件的改动则只需要刷新页面即可。
发布文章
现在可以将模板上的文章替换为你自己的文章了。
在开始之前,要理解Jekyll的命名规范。所有文章必须:
保存在_posts文件夹下
命名为
yyyy-mm-dd-name-of-your-post.md格式用Markdown语言编写(即扩展名.md的含义)
试试看!在_posts目录下用适当的名字创建一个文件。然后,刷新浏览器就能看到你的文章显示在网站上。
“如果我的有些文章已经发表在Medium上,想转换成Markdown怎么办?”
有几个解决方案。我推荐使用这个十分好用的转换器(
https://medium-to-markdown.now.sh/)。
需要提醒的是,它无法处理Gist,所以你需要手工提取Gist。但并不复杂,只需右键点击Medium中的Gist然后将其中包含的