关于jekyll其他一些命令的用法如下: $ jekyll build # => 当前文件夹中的内容将会生成到 ./_site 文件夹中。...$ jekyll build --destination # => 当前文件夹中的内容将会生成到目标文件夹中。...$ jekyll build --watch # => 当前文件夹中的内容将会生成到 ./_site 文件夹中, # 查看改变,并且自动再生成。...接下来我们要做的就是把我们的Jekyll生成的blog部署到Github Pages上去即可 3.部署blog 我们先把刚刚新建的仓库git clone到本地,然后cd 到仓库的目录下,执行jekyll...接着我们把我们自己做好的blog目录整个都拷贝到这个仓库文件夹中,当然,这个仓库之前的文件可以删除了,只留下README即可。
所以,github Pages可以被认为是用户编写的、托管在github上的静态网页。 ? github提供模板,允许站内生成网页,但也允许用户自己编写网页,然后上传。...整个思路到这里就很明显了。你先在本地编写符合Jekyll规范的网站源码,然后上传到github,由github生成并托管整个网站。 这种做法的好处是: * 免费,无限流量。 ...$ cd jekyll_demo $ git init 然后,创建一个没有父节点的分支gh-pages。因为github规定,只有该分支中的页面,才会生成网页文件。 ...在项目根目录下,创建一个_layouts目录,用于存放模板文件。 $ mkdir _layouts 进入该目录,创建一个default.html文件,作为Blog的默认模板。...此外,别忘了将_config.yml文件中的baseurl改成根目录”/”。 至此,最简单的Blog就算搭建完成了。
所以,github Pages可以被认为是用户编写的、托管在github上的静态网页。 ? github提供模板,允许站内生成网页,但也允许用户自己编写网页,然后上传。...整个思路到这里就很明显了。你先在本地编写符合Jekyll规范的网站源码,然后上传到github,由github生成并托管整个网站。 这种做法的好处是: * 免费,无限流量。 ...$ cd jekyll_demo $ git init 然后,创建一个没有父节点的分支gh-pages。因为github规定,只有该分支中的页面,才会生成网页文件。 ...在项目根目录下,创建一个_layouts目录,用于存放模板文件。 $ mkdir _layouts 进入该目录,创建一个default.html文件,作为Blog的默认模板。...此外,别忘了将_config.yml文件中的baseurl改成根目录"/"。 至此,最简单的Blog就算搭建完成了。
Jekyll 会自动将此目录中的 Markdown 或 HTML 文件处理为文章内容,并根据配置生成静态页面。 _layouts:存放布局文件。...这些数据文件可以在模板中被引用,提供灵活的数据展示和使用。 普通文件夹: 任何不以下划线(_)开头的文件夹都被视为普通文件夹,其内容会直接被复制到生成的站点中,保持文件和目录结构。...Jekyll 对 _posts 文件夹的特殊处理 _posts 文件夹是 Jekyll 中的一个特殊目录,用于存放博客文章。...这些文件夹的内容不会直接生成到静态站点的输出目录中。除非使用自定义配置,否则它们不会出现在最终的 URL 路径中。 如何让其他目录内容可访问?...如果你希望其他目录的内容也能像 _posts 中的文章一样生成并通过 URL 访问,可以使用以下方法: 使用普通文件夹:将文件夹命名为不带下划线的名称(如 pages),这样 Jekyll 会将该目录及其内容直接复制到生成的站点中
jekyll 模板 jekyll 是基于ruby来编写的一个博客模板生成工具,也就是说我们可以根据相关的规则来生成对应的html文件,当然这份工作github也能帮你去做。...在_layout下创建一个default.html,作为一个网站的模板,添加如下内容(此处代码中的所有的{ {中间都有一个空格,为了不让jekyll去解析,拷贝的时候请注意): 生成我们的网站: jekyll build # 生成_site目录 jekyll server # 生成并启动一个server...在浏览器中打开127.0.0.1:4000可以看到刚刚生成的网站: ? ?...到这里,我们使用jekyll根据我们写的模板生成了对应的静态页面,下面我们把数据传入到github的gh-pages下面。 git add .
我的博客选择的是在 Github 上找的博客主题,它对目录中各个文件的内容、功能都有很详细地说明,适合我这样的小白学习使用 Jekyll 。...我在对这个模板进行改造的过程中也慢慢熟悉了 jekyll 的目录结构和操作方式。...\assets\css文件夹中,将.js文件覆盖到\assets\js文件夹中就完成了配置。...在本地博客文件的根目录里打开命令行,使用命令rougify style github > css/syntax.css生成一个 github 风格的样式到css/syntax.css文件中。...同时,由于感觉代码字号太小,我还试着修改博客的字号大小,首先,根据head.html的信息,博客参数引用自hux-blog.min.css文件中: <!
Jekyll 中 Sass 的使用 什么是 Sass 关于 Sass 的优势 Usage Install Sass 目录结构 使用 include stylesheet to html...项目实例 参考文献 Jekyll 中 Sass 的使用 什么是 Sass Sass 是一群超级懒的人创造的 Css 快速编程工具 Sass(Syntactically Awesome Style...关于 Sass 的优势 Sass 的嵌套可以将多层级的 Css badcode 显得跟简练 Sass 的变量可以统一控制设计风格 Sass 的@import等导入方法可以实现设计模块化分离 Sass...比 Css 好玩 Usage Install Sass Jekyll 3 已经自带 Sass 编译器了, 不需要额外安装 目录结构 . | - _sass | - _typography.scss...css 文件夹里面是 main 文件, 这里面的文件最终会生成到 _site/css 这个文件夹的名称可以自由更改, 反正最终只要保证你的 html 访问到对文件夹即可。
❞ 目录 一、前言 二、你要准备的东西 三、4种博客的搭建 1. hexo 2. docsify 3. jekyll 4. vuepress 四、部署到自己的服务器 1....另外,GitPage配置参考:https://docsify.js.org/#/zh-cn/deploy 在Github的配置中,可以选择根目录和docs两个文件夹,作为静态博客的仓库。...- 克隆到自己的仓库 命令: npm install hexo-cli -g hexo init blog cd blog npm install hexo generate # 生成 hexo server...不同于 GitBook、Hexo 的地方是它不会生成静态的 .html 文件,所有转换工作都是在运行时。...- 克隆到自己的仓库 命令: npm install -g vuepress # 安装 vuepress build docs # 构建,生成html,可以用于部署 vuepress dev
由于系统默认Ruby安装过程中容易出现各种问题,因此建议自定义安装新的Ruby。关于卸载及重装 Ruby 和 Jekyll的详细内容,也可以参考文章iMac搭建Jekyll本地环境。...「目录结构http://jekyllcn.com/docs/structure/」,下面为个人博客目录结构的简单介绍: . ├── 404.html :404页面 ├── CNAME :Github...├── _posts :文章内容 ├── _site :Jekyll 生成静态页面目录 ├── index.html : 博客首页页面格式 ├── pages :一些特殊的静态页面 ├── public...静态网站服初始化一般需要约 3 分钟 qcloud_jekyll_hosting.png 将静态页面部署到托管服务 你阔以直接选择将构建好的静态页面上传到托管服务,但是考虑到博客的更新频率,还是选择使用官方提供的工具来上传...(例如部署我的博客的 _site ),命令行中-e 后面的环境ID就是首页生成的环境ID,一般腾讯云会在我们的自定义名称后面加一个后缀。
在本教程中,我们将配置一个生产环境以使用Nginx来托管Jekyll站点,以及Git在您将更改推送到站点存储库时跟踪更改并重新生成站点。...首先,从/var/www/html目录中删除默认网页: $ sudo rm /var/www/html/index.nginx-debian.html 现在,将目录的所有权设置为git用户,以便此用户可以在收到更改时更新站点的内容...在hooks目录中创建指定的文件post-receive,并在您选择的文本编辑器中打开它: $ nano ~/sammy-blog.git/hooks/post-receive 我们将配置hook以克隆对临时目录的最新更改...,然后重新生成它并将生成的站点保存到/var/www/html以便您可以访问它。...在您的开发计算机上,导航到包含该站点的目录: $ cd ~/www 我们需要在站点的根目录中初始化Git存储库,以便我们可以将内容推送到远程存储库: $ git init 输出包含有关存储库初始化成功的消息
它的方便之处在于支持多种文本标记语言:Markdown,Textile,HTML,然后 Jekyll 就会帮你加入你选择主题的样式的布局中。最终生成你自己的静态博客网站。...例如:我的账号名是helloRestlessMan,仓库名就是 helloRestlessMan.github.io 3.部署代码到Github 在我们创建的博客的目录找到 _site 目录,将 _site...目录下的所有文件都提交到Github上。...手把手博客搭建 参考资料 1.使用 github + jekyll 搭建个人博客 https://www.cnblogs.com/wangfupeng1988/p/5702324.html 2.Github...+ Jekyll 搭建个人博客 https://blog.csdn.net/White_Idiot/article/details/69397224 3.Jekyll主题收藏 https://blog.csdn.net
感谢Huxpro提供的博客模板 我的的博客 前言 从 Jekyll 到 GitHub Pages 中间踩了许多坑,终于把我的个人博客BY Blog搭建出来了。。。...修改个人介绍 修改个人介绍需要修改根目录下的 about.html 文件 看不懂 HTML 标签?...聪明的你应该发现怎么做了吧~ 安装 jekyll和 jekyll bundler $ gem install jekyll $ gem install jekyll bundler 进入你的 Blog...所在目录,然后创建本地服务器 $ jekyll s 然后会显示 Auto-regeneration: enabled for '/Users/baiying/Blog' Configuration...修改主页的座右铭 最近有不少小伙伴私信我:如何修改主页的座右铭? 就是这个: image.png 很简单,找到博客目录下的 index.html 文件,修改这句话就可以了。
当然,还有另外一个原因,Github 的原生支持静态生成器就是 Jekyll,这也意味着在 Github 上部署 Jekyll 更加方便。 ...Jekyll 的开始与 Hexo 有所不同,Hexo 是采用子目录的方式加载应用新的主题,而 Jekyll 则是采用主题化的方式应用主题。...在实际的使用过程中,笔者根据自己的需求也在 H2O 主题上做出了一定的功能修改,并开源为 jekyll-them-H2O-ac。...为了可以支持 username.github.io 域名直接展示该项目,建议在 Settings 里面将 Respository name 修改为 username.github.io,然后克隆项目到本地目录...,需要修改为子目录名称 baseurl: '' # Navigation links # 导航栏,一般是顶级的页面链接 nav: home: '/' blog: '/blog/' archives
时间设置 因为我们是直接参考复制别人的主题,所以这个步骤在Windows会稍微不一样。 我们需要先安装tzinfo-data到Windows中才可以。...serve 因为我们是复制主题到该目录,会出现bundle未安装错误。...修改侧边栏 把主页中侧边栏的Repo修改成分类栏。...Push到GitHub中 手残党直接通过GitHub Windows Commit即可。...原因是GitHub只会阅读Jekyll中xxx.github.io/_includes,而不会进入blog/_includes 导致。该问题是可以解决的。
,51cto,开源中国,博客园,简书,等等 (4)使用个人站点+微信公众号 (一)Jekyll是什么 jekyll是一个静态博客的生成器,它可以用来把我们使用markdown来写好的文章给转换成静态网页...html来发布。...Github Pages 支持 自动利用 Jekyll 生成站点,也同样支持纯 HTML文档。...,那么你就可以fork到你自己到github中,然后clone下来,修改一些地方,然后就push到自己到仓库中,就可以了,一些git操作命令: git add . git commit -m "first...,然后在自己到静态站点到根目录下,新建以名字为CNAME到文件,里面的内容就是我们的自己的域名,比如我的: 8090nixi.com ` 注意这里只需要域名后面的部分即可,不需要把http和www都写进来
前言 Jekyll 是一款采用 Ruby 语言编写的、非常方便简单又功能强大的静态站点生成器,适合于搭建个人博客、静态网站等。...我们知道,Github Page 默认支持的也是 Jekyll,而非 Hexo、Hugo等静态站点生成器。...移动默认首页 这里想要移动的子目录可以使用任何与已有文件夹不重名的文件夹名,建议使用 blog,这样语义理解上比较方便。...如下所示,添加一个页面模板到 _layouts 目录。 html --> blog 下,相应的博客分页展示页中的卡片链接、分页链接、标签链接等等都需要做出修改。
具体的ruby可以到官网上去下载,不过毕竟是国外网站,如果没有好的访问外国网站工具还是比较慢的。这里我已经准备好了,点ruby和DevKit下载。点击exe文件进行自定义目录安装。...安装完成之后,确保ruby的环境已经配置到了系统的变量中。比如我的DevKit安装目录是:D:\develop\DevKit。..._site : 这个是Jekyll生成的最终的文档,不用去关心。最好把他放在你的.gitignore文件中忽略它。...检查是否生成了ssh key 如果生成了ssh key,那么会在windows的C盘用户目录下生成一个.ssh的文件夹(比如我的地址就是C:\Users\huyh.ssh),如果没有,则进行下一步。.../jekyll-github.html http://blog.csdn.net/u014015972/article/details/50497254
blog_admin netlifycms 与 jekyll-admin 的对比 刚开始我找到的是 jekyll-admin 这款 jekyll 的 CMS,因为本人用的是 jekyll。...为你的博客添加 netlifycms 由于本人用的是 jeklly 博客,文章中的演示部分均为 jeklly。当然 netlifycms 不只支持 jeklly,还支持很多其他类型的 Blog。...增加 admin/index.html 文件 创建一个 admin/index.html 在你的仓库根目录下,这个文件内容看起来像这样。...注意官方文档中并没有添加 netlify-identity-widget.js 这个 js ,这个是用来校验你的身份的,需要加上。 html --> <!...domain_management 配置 Oauth App 上面几个步骤完成后,将修改 push 到仓库,你已经可以在你的 admin 页面看到一些东西了。 ?
前言 从 Jekyll 到 GitHub Pages 中间踩了许多坑,终于把我的个人博客BY Blog搭建出来了。。。 本教程针对的是不懂技术又想搭建个人博客的小白,操作简单暴力且快速。...(image-fe068-1513847314442)] 修改个人介绍需要修改根目录下的 about.html 文件 [图片上传失败......聪明的你应该发现怎么做了吧~ 安装 jekyll和 jekyll bundler $ gem install jekyll $ gem install jekyll bundler 进入你的 Blog...所在目录,然后创建本地服务器 $ jekyll s 然后会显示 Auto-regeneration: enabled for '/Users/baiying/Blog' Configuration file...很简单,找到博客目录下的 index.html 文件,修改这句话就可以了。 ?
领取专属 10元无门槛券
手把手带您无忧上云