首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何快速给自己构建一个温馨的"家"——用Jekyll搭建静态博客

关于jekyll其他一些命令的用法如下: $ jekyll build # => 当前文件夹中的内容将会生成到 ./_site 文件夹中。...$ jekyll build --destination # => 当前文件夹中的内容将会生成到目标文件夹中。...$ jekyll build --watch # => 当前文件夹中的内容将会生成到 ./_site 文件夹中, # 查看改变,并且自动再生成。...接下来我们要做的就是把我们的Jekyll生成的blog部署到Github Pages上去即可 3.部署blog 我们先把刚刚新建的仓库git clone到本地,然后cd 到仓库的目录下,执行jekyll...接着我们把我们自己做好的blog目录整个都拷贝到这个仓库文件夹中,当然,这个仓库之前的文件可以删除了,只留下README即可。

30410

如何拥有一个免费空间来写博客(github)

所以,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就算搭建完成了。

5.9K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    如何快速给自己构建一个温馨的家——用Jekyll搭建静态博客

    关于jekyll其他一些命令的用法如下: $ jekyll build # => 当前文件夹中的内容将会生成到 ./_site 文件夹中。...$ jekyll build --destination # => 当前文件夹中的内容将会生成到目标文件夹中。...$ jekyll build --watch # => 当前文件夹中的内容将会生成到 ./_site 文件夹中, # 查看改变,并且自动再生成。...接下来我们要做的就是把我们的Jekyll生成的blog部署到Github Pages上去即可 3.部署blog 我们先把刚刚新建的仓库git clone到本地,然后cd 到仓库的目录下,执行jekyll...接着我们把我们自己做好的blog目录整个都拷贝到这个仓库文件夹中,当然,这个仓库之前的文件可以删除了,只留下README即可。

    1.3K20

    搭建一个免费的,无限流量的Blog----github Pages和Jekyll入门

    所以,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就算搭建完成了。

    1.7K70

    Understand folder and path configuration in Jekyll

    Jekyll 会自动将此目录中的 Markdown 或 HTML 文件处理为文章内容,并根据配置生成静态页面。 _layouts:存放布局文件。...这些数据文件可以在模板中被引用,提供灵活的数据展示和使用。 普通文件夹: 任何不以下划线(_)开头的文件夹都被视为普通文件夹,其内容会直接被复制到生成的站点中,保持文件和目录结构。...Jekyll 对 _posts 文件夹的特殊处理 _posts 文件夹是 Jekyll 中的一个特殊目录,用于存放博客文章。...这些文件夹的内容不会直接生成到静态站点的输出目录中。除非使用自定义配置,否则它们不会出现在最终的 URL 路径中。 如何让其他目录内容可访问?...如果你希望其他目录的内容也能像 _posts 中的文章一样生成并通过 URL 访问,可以使用以下方法: 使用普通文件夹:将文件夹命名为不带下划线的名称(如 pages),这样 Jekyll 会将该目录及其内容直接复制到生成的站点中

    6100

    Jekyll 中 Sass 的使用

    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 访问到对文件夹即可。

    78020

    如何将 Jekyll 部署到云开发静态网站托管

    由于系统默认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,一般腾讯云会在我们的自定义名称后面加一个后缀。

    3.6K105

    如何在Ubuntu 16.04上使用Git Hooks部署Jekyll站点

    在本教程中,我们将配置一个生产环境以使用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 输出包含有关存储库初始化成功的消息

    1.3K30

    个人免费博客花式搭建指南

    当然,还有另外一个原因,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

    1.9K40

    如何使用Jekyll+GitHub Pages搭建个人博客站点

    ,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都写进来

    1.1K70

    使用github+jekyll搭建个人博客

    具体的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

    91460

    如何为你的 Github 博客添砖加瓦

    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 页面看到一些东西了。 ?

    82640

    利用 GitHub Pages 快速搭建个人博客前言快速开始写文章自定义域名进阶利用GithHub Desktop管理GitHub仓库修改个人介绍常见问题其他Star补充最后要说个事情

    前言 从 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 文件,修改这句话就可以了。 ?

    4.1K110
    领券