云开发静态托管是云开发提供的静态网站托管的能力,静态资源(HTML、CSS、JavaScript、字体等)的分发由腾讯云对象存储 COS 和拥有多个边缘网点的腾讯云 CDN 提供支持 使用Jekyll搭建静态站点...Jekyll 也可以运行在 GitHub Page 上,也就是说,你可以使用 GitHub 的服务来搭建你的项目页面、博客或者网站,而且是完全免费的。...关于卸载及重装 Ruby 和 Jekyll的详细内容,也可以参考文章iMac搭建Jekyll本地环境。...静态网站服初始化一般需要约 3 分钟 qcloud_jekyll_hosting.png 将静态页面部署到托管服务 你阔以直接选择将构建好的静态页面上传到托管服务,但是考虑到博客的更新频率,还是选择使用官方提供的工具来上传...如果你有自己的域名,你也可以添加自己的域名解析,例如下面我修改为使用我自己的域名,并设置了自定义的索引页和404页面: Zkyx39SOCYgHimv.png 访问静态页面 在浏览器输入讯云提供的默认域名
Jekyll 是一个简单的博客形态的静态站点生产机器。...安装 Ruby 时,一开始因为不想装在C盘我就更改了安装路径,结果不知道出于什么原因,执行gem install jekyll指令时总会出错,最后还是老老实实安装在了默认安装路径。...我的博客选择的是在 Github 上找的博客主题,它对目录中各个文件的内容、功能都有很详细地说明,适合我这样的小白学习使用 Jekyll 。...几个主要文件的参数在上面的 Github 页面上有很清楚的说明,想直接用这个模板的朋友可以根据说明修改。...在本地博客文件的根目录里打开命令行,使用命令rougify style github > css/syntax.css生成一个 github 风格的样式到css/syntax.css文件中。
诞生之初,H2O 主题就在 Github 平台上以 MIT 许可证协议开放了源代码。这吸引了很多小伙伴纷纷转投 Jekyll 和 H2O 主题的阵营,本人也是其中之一。...另外,也可以将一些固定的站点信息放置在系统日志页,比如站点的多点部署信息,读者可以根据此信息访问最快、最合适的节点。...具体文章列表页和归档页置顶效果如下所示: 分页依赖升级 (2022年5月26日更新) 由于原有的 jekyll-paginate 库已停止更新,所以升级到目前更新、维护活跃的 jekyll-paginate-v2...时间格式这里一共提供了 3 种:第一种中英文站点使用皆宜,第二种适用于英文站点,第三种适用于中文站点。默认时间格式为第一种。...发布部署 由于 Github 提供 Jekyll 静态生成器的静态页面托管,只要打开仓库的 Pages 功能,当推送更新到 Github 时即会自动部署。
您可以使用Jekyll主题选择器在网上创建和发布GitHub页面。如果您喜欢在本地工作,您可以使用GitHub桌面或命令行。...这样的存储库乔/ bob.github。io不会构建用户页面站点。 在构建用户页面时,可以在http(s)://.github.io。 构建您的用户和组织页面。...定制的404s只有在使用自定义域时才会起作用。否则,将使用用户页404。 使用命令行创建项目页面。 如果您熟悉命令行Git,那么手动创建项目页面站点是很容易的。...对于使用Jekyll的GitHub Pages网站,您的HTML文件很可能会存储在_layouts文件夹中。一般来说,CSS是在HTML文件的一部分中找到的。...进一步阅读GitHub页面 请参阅“ 自定义GitHub页面 ”了解更多关于使用批准的Jekyll插件和GitHub Pages网站,创建自定义404页面以及查看可用存储库元数据的更多信息。
在 GitHub Pages 发布网站或者软件文档现在只需要更少的步骤——精确来说是三步: 创建一个 GitHub 仓库(或者选择一个已经创建好的仓库); 像你提交其它任何文件一样,通过 GitHub...如果你已经对 GitHub Pages 熟悉了,你或许会对知道一些幕后的东西感兴趣,我们现在正在做一些事情去简化这个发布流程,并且让它更加如你所期待的那样在 GitHub 的其它地方创作 Markdown...如果你没有一个名为 index.md(或者 index.html)的文件,我们会使用你的 README 文件作为站点的首页,就和你在 GitHub 浏览一个仓库时看到的一样。...再者,这些变化不应该影响大多数现有站点的建设(虽然你可以安全的开始使用这些特性),但是如果你有任何问题,请联系我们。 三步发布快乐!...WEB前端性能优化常见方法 一小时内搭建一个全栈Web应用框架 干货:CSS 专业技巧 四步实现React页面过渡动画效果 让你分分钟理解 JavaScript 闭包 ---- ---- 小手一抖,
前言 Jekyll 是一款采用 Ruby 语言编写的、非常方便简单又功能强大的静态站点生成器,适合于搭建个人博客、静态网站等。...我们知道,Github Page 默认支持的也是 Jekyll,而非 Hexo、Hugo等静态站点生成器。...由于本站目前是采用 Jekyll 来搭建的,所以为了提供给读者更加高效的阅读条件,笔者在廖柯杰大佬开发的 H2O 主题的基础上做了一些功能上的增加和优化,接下来就来详细介绍一下。...Prism 工具的安装使用相较其他两种稍微复杂一点,需要下载插件 prism.rb 手动安装到 _plugins 文件夹中,然后在文章模板页添加 prism.css 和 prism.js 的引入。...,这里就使用了 Github 提供的 gist 代码片段服务。
Markdown(或 Textile)、Liquid 和 HTML & CSS 构建可发布的静态网站。 博客支持。支持自定义地址、博客分类、页面、文章以及自定义的布局设计。...//使用gem安装Jekyll gem install jekyll //使用Jekyll创建你的博客站点 jekyll new blog #创建你的站点 //开启Jekyll服务 //进入blog...使用 `--no-watch` 来关闭。 $ jekyll serve --detach # => 功能和`jekyll serve`命令相同,但是会脱离终端在后台运行。...三.使用Github Pages服务 1.创建我们自己的仓库 以下用usename代替自己的用户名 2.配置我们的仓库 在Settings里面找到Github Pages 选择Launch automatic...现在我们打开http://localhost:4000,即可看见我们在Github上创建的主页,理论上和username.com/username.gi… 访问的应该是一模一样的。
按照规范化的文本内容标记编写,使用不同的 Markdown 语法翻译器和 CSS 样式,就可以带来丰富多彩的效果呈现。...当然,还有另外一个原因,Github 的原生支持静态生成器就是 Jekyll,这也意味着在 Github 上部署 Jekyll 更加方便。 ...在实际的使用过程中,笔者根据自己的需求也在 H2O 主题上做出了一定的功能修改,并开源为 jekyll-them-H2O-ac。...;当代码注释内容超过一行时最好将注释放在代码的后一行,此时 # 号前不留空格; 在使用图片进行解释的时候,在对应段落附近加载图片,并使用“下图”、“上图”这样的字眼进行描述; 图片可以使用 PPT 自行制作...bundle exec jekyll serve --livereload # 浏览器访问 http://127.0.0.1:4000/ 即可 发布部署 # 使用以下命令将更新内容添加到 Git 跟踪并提交到
Markdown(或 Textile)、Liquid 和 HTML & CSS 构建可发布的静态网站。 博客支持。支持自定义地址、博客分类、页面、文章以及自定义的布局设计。...//使用gem安装Jekyll gem install jekyll //使用Jekyll创建你的博客站点 jekyll new blog #创建你的站点 //开启Jekyll服务 //进入blog...使用 `--no-watch` 来关闭。 $ jekyll serve --detach # => 功能和`jekyll serve`命令相同,但是会脱离终端在后台运行。...下载下来,改改css,或者借用一下,就会有很漂亮的blog就出炉了。 三.使用Github Pages服务 1.创建我们自己的仓库 以下用usename代替自己的用户名 ? 2.配置我们的仓库 ?...现在我们打开http://localhost:4000,即可看见我们在Github上创建的主页,理论上和username.com/username.gi… 访问的应该是一模一样的。
由于有了GraphQL, Gatsby可以生成能够访问和利用来自不同来源的数据的站点。 您将在使用Gatsby时看到,生成的站点是进步的Web应用程序。...但是,支持YAML、JSON和CSV。 变身怪医(Jekyll) Jekyll由Tom Preston-Werner在2009年发布,是这个列表中最老的静态站点生成器。...Jekyll是用Ruby编写的,全世界都在使用。由于加入了GitHub——Tom Preston-Werner是GitHub的联合创始人——Jekyll获得了开源社区的大量关注和贡献。...Jekyll也使用Sass,这对于喜欢CSS预处理器的开发人员来说非常重要。 由于Jekyll有许多开发人员为其做出贡献,所以您可以找到一个插件来实现几乎任何您想要实现的功能。...结论 静态站点生成器有助于使静态站点易于构建、修改和扩展。在本文中,您已经看到了三种最好的静态站点生成器。您应该能够更好地决定下一个静态站点项目使用哪种工具。 有什么问题吗?
# If you use rbenv, rehash to be able to run the bundle command bundle install rake install 发布到Github...rake deploy #发布网页,这里会提交代码到github rake preview #本地预览,默认端口是4000,可以修改 git add . git commit -m 'your message...├─ public/ #在静态编译完成后的目录,网站只需要这个目录下的文件树 ├─ _deploy/ #deploy时候生成的缓存文件夹,和public目录一样 ├─ sass/ #css文件的源文件...,过程中会compass成css ├─ plugins/ #放置自带以及第三方插件的目录,ruby程序 │ └── xxx.rb └─ source/ #这个是站点的源文件目录,public目录就是根据这个目录下数据生成的...支持的第三方主题下载和预览网站 关于侧边栏和主题的定制,添加新浪微博,多说评论,分类标签云等等 [注意,使用多说的话,shortname不是你的个人资料中的名称,而是新建的站点给定的!
Jekyll 也可以运行在 GitHub Page 上,也就是说,你可以使用 GitHub 的服务来搭建你的项目页面、博客或者网站,而且是完全免费的。...值得注意的是,如果需要托管在 Github 或者其他提供 Pages 服务的站点,服务商不一定提供运行插件的环境。...因此,建议在本地运行插件,然后将生成结果发布到服务器上,这样就不需要依赖服务器的运行环境。...代码高亮 本站点模板默认开启了代码高亮,编写博客时只需要使用 markdown 的代码块方法编写即可。...教程链接 免费构建自己的博客-开发环境安装 免费构建自己的博客-编写第一篇博客 免费构建自己的博客-管理博客代码与发布到Github 免费构建自己的博客-Jekyll进阶 免费构建自己的博客-进一步丰富博客
下面就总结下我使用的方法,希望能帮到有用github搭建个人博客的同学。...站点 先看看阮一峰的《搭建一个免费的,无限流量的Blog—-github Pages和Jekyll入门》,看完对整个站点应该就有了一个大概的认识。...添加RSS 要方便定阅,可以添加RSS输出到我们的站点上,大体分为三步: 1.修改设置文件 name: 站点名称 description: 站点说明 url: 站点URL 2.在github上有一个jekyll-rss-feeds...评论系统 网上有几个可以嵌入到静态站点的评论系统,像多说、友言、畅言等等,还有Jekyll模板里默认使用的DISQUS。...-- 多说评论框 end --> 把上面的代码放到文章页模板的下面即可。
你可以查看它的 GitHub 和官网了解更多。 4.Jekyll star 数 45K+。 Jekyll 是一个基于 Ruby 的静态站点生成器,支持多种主题和插件。...Jekyll 提供了丰富的文档和社区支持,使用起来也比较简单。Jekyll 也是非常流行的静态网站生成器之一。 你可以查看它的 GitHub 和官网了解更多。 5.Nuxt star 数 44K+。...不会发布新的主要版本。 你可以查看它的 GitHub和官网了解更多。 15.Gridsome star 数 8.5K+。...本文列出了最受欢迎的 Top20 博客静态站点生成工具,它们在 GitHub 上的 star 数可以直接反映它们的受欢迎程度。...不同的工具都有各自的优缺点,适用于不同的需求和技能水平,因此在选择时需要根据自己的情况进行考虑。例如,如果您想要一个快速而简单的解决方案,那么 Jekyll 或 Hexo 可能是不错的选择。
source/_posts mkdir -p public www.bihe0832.com git:(master) ✗ 至此我们就完成了 Octopress 环境的搭建,和站点的初始化...在搭建好静态站点以后,就可以在 source/_posts 添加你的文章了,我选择了直接迁移过来两篇自己的文章。...write source/stylesheets/screen.css Configuration file: /github/www.bihe0832.com/_config.yml...将静态页面部署到托管服务 你可以直接选择将构建好的静态页面上传到托管服务,但是考虑到博客的更新频率,还是选择使用官方提供的工具来上传。...如果你有自己的域名,你也可以添加自己的域名解析,例如下面我修改为使用我自己的域名,并设置了自定义的索引页和404页面: 访问静态页面 在浏览器输入讯云提供的默认域名 https://blog-www-173dc4
介绍 Jekyll是一个静态站点生成器,它有内容管理系统(CMS)的一些优点,同时避免了此类数据库驱动的站点引入的性能和安全问题。...在本教程中,我们将在Ubuntu 16.04上安装一个Jekyll 3.7.3开发站点。在后面的教程中,我们将探索此处生成的内容,将静态站点发布到同一服务器,并最终部署到生产位置。...在添加新帖子和页面时,使用现有结构并遵循Jekyll的命名约定非常重要。 提示: tree是查看文件和目录结构的一个非常有用的命令。...如果我们在我们的网站上工作时让开放服务器在前台运行时打开此终端,我们将在添加页面和帖子以及更改内容时立即收到反馈。...在Web浏览器中,我们可以在jekyll serve输出中显示的服务器地址和端口访问它: 结论 在本教程中,我们安装了Jekyll并创建了一个包含一些自动生成内容的开发站点。
当你在 GitHub 查看文件时(任何文本文件,任何仓库中),右上角会有一个小铅笔图标,点击它就可以编辑文件了。...3 格式化代码 如果你想写一段代码,你可以三个反引号开始 —— 就像你在研究 MarkDown时所学到的 —— 之后 GitHub 会试着猜测你写的语言。...与选中分支的对比页将会显示出来: 以上就是和 master 分支的差异,如果想要合并分支的话,只需要输入 /compare/integration-branch...my-branch 即可。...11 GitHub Pages 你可能已经知道使用 GitHubPages 来托管一个静态网站。如果你不知道,现在就来学习,这一节是专门用于讨论使用 Jekyll 来构建一个站点的。...我的建议是:使用 GitHub 厂库中的 Markdown 文件来存储这些文本内容,然后使用前端组件来拉取这些文本块并展示在页面上。
(二)Github Pages是什么 Github Pages 是面向用户、组织和项目开放的公共静态页面搭建托管服务,站点可以被免费托管在 Github 上,你可以选择使用 Github Pages 默认提供的域名...github.io 或者自定义域名来发布站点。...(三)如何搭建使用 前提条件: git环境 github账户 ruby环境 ` jekyll底层是使用ruby编写对,所以安装时候需要先安装ruby环境: 在mac先要安装一些软件,这里假设你对git环境已经有了...jekyll-gist ` 上面对软件安装完毕后,你就可以在github上搜索一个基于jekyll模版对项目,当然你可以从网上搜索任何你喜欢的主题风格,找到之后使用git clone到自己本地: git...至此,一个属于我们自己独立的个人站点就完成了,使用jekyll+github pages优缺点如下,借用阮一峰老师的总结: 优点: * 免费,无限流量。
GitHub Pages Github Pages 是面向用户、组织和项目开放的公共静态页面搭建托管服务,站点可以被免费托管在 Github 上,你可以选择使用 Github Pages 默认提供的域名...github.io 或者自定义域名来发布站点。...Github Pages 支持 自动利用 Jekyll 生成站点,也同样支持纯 HTML 文档,将你的 Jekyll 站点托管在 Github Pages 上是一个不错的选择。...Jekyll 介绍 Jekyll 是一个简单的博客形态的静态站点生产机器。...可以在 Github 上面设置一些钩子,当提交代码的时候自动触发脚本,也可以定时触发脚本来发布文章。
领取专属 10元无门槛券
手把手带您无忧上云