From 4c18e3c136bea49e3335ab594ae22d999892cf27 Mon Sep 17 00:00:00 2001 From: Jade Dominguez Date: Fri, 30 Dec 2011 14:17:44 -0800 Subject: [PATCH] version 0.0.1 --- .gitignore | 6 + 404.html | 1 + README.md | 41 ++ Rakefile | 29 + _config.yml | 18 + _includes/helpers/categories_list.html | 34 ++ _includes/helpers/liquid_raw.html | 29 + _includes/helpers/pages_list.html | 37 ++ _includes/helpers/posts_collate.html | 52 ++ _includes/helpers/tags_list.html | 30 + _includes/production/analytics.html | 5 + _includes/themes/mark-reid/default.html | 75 +++ _includes/themes/mark-reid/page.html | 6 + _includes/themes/mark-reid/post.html | 31 + _includes/themes/tom/default.html | 60 ++ _includes/themes/tom/page.html | 3 + _includes/themes/tom/post.html | 17 + _layouts/default.html | 4 + _layouts/page.html | 4 + _layouts/post.html | 4 + _plugins/debug.rb | 38 ++ .../2011-12-29-jekyll-introduction.md | 410 +++++++++++++ .../core-samples/api/2011-11-27-theme-api.md | 10 + .../api/2011-11-28-bootstrap-api.md | 65 +++ .../api/2011-11-29-jekyll-liquid-api.md | 38 ++ .../api/2011-11-30-template-data-api.md | 172 ++++++ .../helpers/2011-9-27-posts-collate.md | 34 ++ .../helpers/2011-9-28-categories-list.md | 49 ++ .../helpers/2011-9-29-pages-list.md | 43 ++ .../helpers/2011-9-30-tags-list.md | 50 ++ .../2011-10-28-deployment-and-hosting.md | 36 ++ .../usage/2011-10-29-configuring-urls.md | 26 + .../usage/2011-10-30-jekyll-theming.md | 31 + .../usage/2011-10-31-jekyll-quick-start.md | 81 +++ archive.html | 9 + assets/themes/mark-reid/css/screen.css | 549 ++++++++++++++++++ assets/themes/mark-reid/css/syntax.css | 60 ++ assets/themes/tom/css/screen.css | 197 +++++++ assets/themes/tom/css/syntax.css | 60 ++ categories.html | 21 + index.md | 45 ++ pages.html | 21 + sitemap.txt | 7 + tags.html | 20 + 44 files changed, 2558 insertions(+) create mode 100644 .gitignore create mode 100644 404.html create mode 100644 README.md create mode 100644 Rakefile create mode 100644 _config.yml create mode 100644 _includes/helpers/categories_list.html create mode 100644 _includes/helpers/liquid_raw.html create mode 100644 _includes/helpers/pages_list.html create mode 100644 _includes/helpers/posts_collate.html create mode 100644 _includes/helpers/tags_list.html create mode 100644 _includes/production/analytics.html create mode 100644 _includes/themes/mark-reid/default.html create mode 100644 _includes/themes/mark-reid/page.html create mode 100644 _includes/themes/mark-reid/post.html create mode 100644 _includes/themes/tom/default.html create mode 100644 _includes/themes/tom/page.html create mode 100644 _includes/themes/tom/post.html create mode 100644 _layouts/default.html create mode 100644 _layouts/page.html create mode 100644 _layouts/post.html create mode 100644 _plugins/debug.rb create mode 100644 _posts/core-samples/2011-12-29-jekyll-introduction.md create mode 100644 _posts/core-samples/api/2011-11-27-theme-api.md create mode 100644 _posts/core-samples/api/2011-11-28-bootstrap-api.md create mode 100644 _posts/core-samples/api/2011-11-29-jekyll-liquid-api.md create mode 100644 _posts/core-samples/api/2011-11-30-template-data-api.md create mode 100644 _posts/core-samples/helpers/2011-9-27-posts-collate.md create mode 100644 _posts/core-samples/helpers/2011-9-28-categories-list.md create mode 100644 _posts/core-samples/helpers/2011-9-29-pages-list.md create mode 100644 _posts/core-samples/helpers/2011-9-30-tags-list.md create mode 100644 _posts/core-samples/usage/2011-10-28-deployment-and-hosting.md create mode 100644 _posts/core-samples/usage/2011-10-29-configuring-urls.md create mode 100644 _posts/core-samples/usage/2011-10-30-jekyll-theming.md create mode 100644 _posts/core-samples/usage/2011-10-31-jekyll-quick-start.md create mode 100644 archive.html create mode 100644 assets/themes/mark-reid/css/screen.css create mode 100644 assets/themes/mark-reid/css/syntax.css create mode 100644 assets/themes/tom/css/screen.css create mode 100644 assets/themes/tom/css/syntax.css create mode 100644 categories.html create mode 100644 index.md create mode 100644 pages.html create mode 100644 sitemap.txt create mode 100644 tags.html diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000000..d81823ae1b --- /dev/null +++ b/.gitignore @@ -0,0 +1,6 @@ +_site/* + +Thumbs.db +.DS_Store + +!.gitkeep diff --git a/404.html b/404.html new file mode 100644 index 0000000000..6904bcdd60 --- /dev/null +++ b/404.html @@ -0,0 +1 @@ +Sorry this page does not exist =( diff --git a/README.md b/README.md new file mode 100644 index 0000000000..67305ee6a2 --- /dev/null +++ b/README.md @@ -0,0 +1,41 @@ +# Jekyll-Bootstrap + +This is a clean install of the core Jekyll Bootstrap framework you can clone and run your Jekyll blog with. + +Jekyll-bootstrap is the quickest and most hassle-free way to get your new Jekyll powered website up and running. +100% compatible with GitHub pages. + +## Usage + +For all usage and documentation please see: + +## Version + +0.0.1 - stable but not versioned. + +This version is stable and readily deployable to GitHub Pages and production Jekyll installs. +However, please expect fast updates that are not backwards compatible with older installs. +When development reaches 0.1.0, version compatibility between releases will be respected. + +## Development + +Development is active! + +## Contributing + +This repository tracks 2 projects: + +- **Jekyll-Bootstrap Framework.** + The framework for which users should clone and build their blog on top of is available in the master branch. + Please fork and contribute additions to the framework itself here. + +- **Jekyll-Bootstrap Documentation Website.** + The documentation website at is maintained in the gh-pages branch. + Please fork and contribute documentation additions to this branch only. + +The master and gh-pages branch do not share the same ancestry. Please treat them as completely separate git repositories! + + +## License + +[Creative Commons](http://creativecommons.org/licenses/by-nc-sa/3.0/) diff --git a/Rakefile b/Rakefile new file mode 100644 index 0000000000..bea3fd9a03 --- /dev/null +++ b/Rakefile @@ -0,0 +1,29 @@ +require "rubygems" +require 'rake' + +desc "Switch between Jekyll-bootstrap themes." +task :switch_theme, :theme do |t, args| + theme_path = File.join(File.dirname(__FILE__), "_includes", "themes", args.theme) + layouts_path = File.join(File.dirname(__FILE__), "_layouts") + + abort("rake aborted: './_includes/themes/#{args.theme}' directory not found.") unless Dir.exists?(theme_path) + abort("rake aborted: './_layouts' directory not found.") unless Dir.exists?(layouts_path) + + Dir.glob("#{theme_path}/*") do |filename| + puts "Generating '#{args.theme}' layout: #{File.basename(filename)}" + + open("#{layouts_path}/#{File.basename(filename)}", 'w') do |page| + if File.basename(filename, ".html").downcase == "default" + page.puts "---" + page.puts "---" + page.puts "{% assign theme_asset_path = \"/assets/themes/#{args.theme}\" %}" + else + page.puts "---" + page.puts "layout: default" + page.puts "---" + end + page.puts "{% include themes/#{args.theme}/#{File.basename(filename)} %}" + end + end +end # task :switch_theme + diff --git a/_config.yml b/_config.yml new file mode 100644 index 0000000000..47de579af1 --- /dev/null +++ b/_config.yml @@ -0,0 +1,18 @@ +# This is the default format. +# For more see: https://github.com/mojombo/jekyll/wiki/Permalinks +permalink: /:categories/:year/:month/:day/:title +auto: true +pygments: true +var: + archive_path: /archive.html + categories_path : /categories.html + tags_path : /tags.html + +production_url : http://username.github.com # or your custom domain name +title : My Blog =) + +author : + name : Name Lastname + email : blah@email.test + github : username + twitter : username diff --git a/_includes/helpers/categories_list.html b/_includes/helpers/categories_list.html new file mode 100644 index 0000000000..2ced2d2685 --- /dev/null +++ b/_includes/helpers/categories_list.html @@ -0,0 +1,34 @@ +{% comment %}{% endcomment %} + +{% if categories_list.first[0] == null %} + {% for category in categories_list %} +
  • + {{ category | join: "/" }} {{ site.categories[category].size }} +
  • + {% endfor %} +{% else %} + {% for category in categories_list %} +
  • + {{ category[0] | join: "/" }} {{ category[1].size }} +
  • + {% endfor %} +{% endif %} + +{% assign categories_list = null %} diff --git a/_includes/helpers/liquid_raw.html b/_includes/helpers/liquid_raw.html new file mode 100644 index 0000000000..54a15e48d5 --- /dev/null +++ b/_includes/helpers/liquid_raw.html @@ -0,0 +1,29 @@ +{% comment%}{% endcomment%} + +
    {{text | replace:"|.", "{" | replace:".|", "}" | replace:">", ">" | replace:"<", "<" }}
    + +{% assign text = null %} \ No newline at end of file diff --git a/_includes/helpers/pages_list.html b/_includes/helpers/pages_list.html new file mode 100644 index 0000000000..44c527976e --- /dev/null +++ b/_includes/helpers/pages_list.html @@ -0,0 +1,37 @@ +{% comment %}{% endcomment %} + + +{% for node in pages_list %} + {% if group == null or group == node.group %} + + {% if page.url == node.url %} +
  • {{node.title}}
  • + {% else %} +
  • {{node.title}}
  • + {% endif %} + + {% endif %} +{% endfor %} + +{% assign pages_list = null %} +{% assign group = null %} diff --git a/_includes/helpers/posts_collate.html b/_includes/helpers/posts_collate.html new file mode 100644 index 0000000000..7e55554055 --- /dev/null +++ b/_includes/helpers/posts_collate.html @@ -0,0 +1,52 @@ +{% comment %}{% endcomment %} + +{% for post in posts_collate %} + {% capture this_year %}{{ post.date | date: "%Y" }}{% endcapture %} + {% capture this_month %}{{ post.date | date: "%B" }}{% endcapture %} + {% capture next_year %}{{ post.previous.date | date: "%Y" }}{% endcapture %} + {% capture next_month %}{{ post.previous.date | date: "%B" }}{% endcapture %} + + {% if forloop.first %} +

    {{this_year}}

    +

    {{this_month}}

    +
      + {% endif %} + +
    • {{ post.date | date: "%B %e, %Y" }} {{ post.title }}
    • + + {% if forloop.last %} +
    + {% else %} + {% if this_year != next_year %} + +

    {{next_year}}

    +

    {{next_month}}

    +
      + {% else %} + {% if this_month != next_month %} +
    +

    {{next_month}}

    +
      + {% endif %} + {% endif %} + {% endif %} +{% endfor %} + +{% assign posts_collate = null %} diff --git a/_includes/helpers/tags_list.html b/_includes/helpers/tags_list.html new file mode 100644 index 0000000000..d2518e0a4e --- /dev/null +++ b/_includes/helpers/tags_list.html @@ -0,0 +1,30 @@ +{% comment %}{% endcomment %} + +{% if tags_list.first[0] == null %} + {% for tag in tags_list %} +
    • {{ tag }} {{ site.tags[tag].size }}
    • + {% endfor %} +{% else %} + {% for tag in tags_list %} +
    • {{ tag[0] }} {{ tag[1].size }}
    • + {% endfor %} +{% endif %} + +{% assign tags_list = null %} diff --git a/_includes/production/analytics.html b/_includes/production/analytics.html new file mode 100644 index 0000000000..3f12c6a394 --- /dev/null +++ b/_includes/production/analytics.html @@ -0,0 +1,5 @@ + \ No newline at end of file diff --git a/_includes/themes/mark-reid/default.html b/_includes/themes/mark-reid/default.html new file mode 100644 index 0000000000..835a4bc509 --- /dev/null +++ b/_includes/themes/mark-reid/default.html @@ -0,0 +1,75 @@ + + + + + + {{ page.title }} ← {{ page.top }} + + + + + {% if page.keywords %} + + {% endif %} + + {% if page.feed %} + + {% endif %} + + + + + + + + + +
      + + + + {{ content }} + + + +
      + + +{% if site.safe %} + {% include production/analytics.html %} +{% endif %} + + diff --git a/_includes/themes/mark-reid/page.html b/_includes/themes/mark-reid/page.html new file mode 100644 index 0000000000..05af78e596 --- /dev/null +++ b/_includes/themes/mark-reid/page.html @@ -0,0 +1,6 @@ +
      + +

      {{ page.title }}

      +{{ content }} + +
      diff --git a/_includes/themes/mark-reid/post.html b/_includes/themes/mark-reid/post.html new file mode 100644 index 0000000000..76dd994c6e --- /dev/null +++ b/_includes/themes/mark-reid/post.html @@ -0,0 +1,31 @@ +
      + +

      {{ page.title }}

      +
        + {% assign tags_list = page.tags %} + {% include helpers/tags_list.html %} +
      + + {{ content }} + +
      + {{ site.author.name }} + {{ page.date | date_to_long_string }} + {{ page.location }} +
      + +
      + {% if page.next %} + + {% endif %} + {% if page.previous %} + + {% endif %} +
      + +
      + + +
      +

      Comment Section

      +
      diff --git a/_includes/themes/tom/default.html b/_includes/themes/tom/default.html new file mode 100644 index 0000000000..2c43e6bf53 --- /dev/null +++ b/_includes/themes/tom/default.html @@ -0,0 +1,60 @@ + + + + + {{ page.title }} + + + + + + + + + + + + + + + +
      + + + {{ content }} + + +
      + Fork me on GitHub + +{% if site.safe %} + {% include production/analytics.html %} +{% endif %} + + diff --git a/_includes/themes/tom/page.html b/_includes/themes/tom/page.html new file mode 100644 index 0000000000..8c753b9285 --- /dev/null +++ b/_includes/themes/tom/page.html @@ -0,0 +1,3 @@ +
      +{{ content }} +
      diff --git a/_includes/themes/tom/post.html b/_includes/themes/tom/post.html new file mode 100644 index 0000000000..fc94e5e119 --- /dev/null +++ b/_includes/themes/tom/post.html @@ -0,0 +1,17 @@ +
      +

      {{ page.title }}

      +

      + {{ page.date | date_to_long_string }} + {% if page.location %}{{ page.location }}{% endif %} +

      + {{ content }} +
      + + \ No newline at end of file diff --git a/_layouts/default.html b/_layouts/default.html new file mode 100644 index 0000000000..2391b67849 --- /dev/null +++ b/_layouts/default.html @@ -0,0 +1,4 @@ +--- +--- +{% assign theme_asset_path = "/assets/themes/tom" %} +{% include themes/tom/default.html %} diff --git a/_layouts/page.html b/_layouts/page.html new file mode 100644 index 0000000000..7985e03e36 --- /dev/null +++ b/_layouts/page.html @@ -0,0 +1,4 @@ +--- +layout: default +--- +{% include themes/tom/page.html %} diff --git a/_layouts/post.html b/_layouts/post.html new file mode 100644 index 0000000000..66490a9d72 --- /dev/null +++ b/_layouts/post.html @@ -0,0 +1,4 @@ +--- +layout: default +--- +{% include themes/tom/post.html %} diff --git a/_plugins/debug.rb b/_plugins/debug.rb new file mode 100644 index 0000000000..e1dde3979a --- /dev/null +++ b/_plugins/debug.rb @@ -0,0 +1,38 @@ +# A simple way to inspect liquid template variables. +# Usage: +# Can be used anywhere liquid syntax is parsed (templates, includes, posts/pages) +# {{ site | debug }} +# {{ site.posts | debug }} +# +require 'pp' +module Jekyll + # Need to overwrite the inspect method here because the original + # uses < > to encapsulate the psuedo post/page objects in which case + # the output is taken for HTML tags and hidden from view. + # + class Post + def inspect + "#Jekyll:Post @id=#{self.id.inspect}" + end + end + + class Page + def inspect + "#Jekyll:Page @name=#{self.name.inspect}" + end + end + +end # Jekyll + +module Jekyll + module DebugFilter + + def debug(obj, stdout=false) + puts obj.pretty_inspect if stdout + "
      #{obj.class}\n#{obj.pretty_inspect}
      " + end + + end # DebugFilter +end # Jekyll + +Liquid::Template.register_filter(Jekyll::DebugFilter) \ No newline at end of file diff --git a/_posts/core-samples/2011-12-29-jekyll-introduction.md b/_posts/core-samples/2011-12-29-jekyll-introduction.md new file mode 100644 index 0000000000..7f9215045d --- /dev/null +++ b/_posts/core-samples/2011-12-29-jekyll-introduction.md @@ -0,0 +1,410 @@ +--- +layout: post +category : lessons +tags : [intro, beginner, jekyll, tutorial] +--- + +This Jekyll introduction will outline specifically what Jekyll is and why you would want to use it. +Directly following the intro we'll learn exactly _how_ Jekyll does what it does. + +## Overview + +### What is Jekyll? + +Jekyll is a parsing engine bundled as a ruby gem used to build static websites from +dynamic components such as templates, partials, liquid code, markdown, etc. Jekyll is known as "a simple, blog aware, static site generator". + +### Examples + +This website is created with Jekyll. [Other Jekyll websites](https://github.com/mojombo/jekyll/wiki/Sites). + + + +### What does Jekyll Do? + +Jekyll is a ruby gem you install on your local system. +Once there you can call `jekyll --server` on a directory and provided that directory +is setup in a way jekyll expects, it will do magic stuff like parse markdown/textile files, +compute categories, tags, permalinks, and construct your pages from layout templates and partials. + +Once parsed, Jekyll stores the result in a self-contained static `_site` folder. +The intention here is that you can serve all contents in this folder statically from a plain static web-server. + +You can think of Jekyll as a normalish dynamic blog but rather than parsing content, templates, and tags +on each request, Jekyll does this once _beforehand_ and caches the _entire website_ in a folder for serving statically. + +### Jekyll is Not Blogging Software + +**Jekyll is a parsing engine.** + +Jekyll does not come with any content nor does it have any templates or design elements. +This is a common source of confusion when getting started. +Jekyll does not come with anything you actually use or see on your website - you have to make it. + +### Why Should I Care? + +Jekyll is very minimalistic and very efficient. +The most important thing to realize about Jekyll is that it creates a static representation of your website requiring only a static web-server. +Traditional dynamic blogs like Wordpress require a database and server-side code. +Heavily trafficked dynamic blogs must employ a caching layer that ultimately performs the same job Jekyll sets out to do; serve static content. + +Therefore if you like to keep things simple and you prefer the command-line over an admin panel UI then give Jekyll a try. + +**Developers like Jekyll because we can write content like we write code:** + +- Ability to write content in markdown or textile in your favorite text-editor. +- Ability to write and preview your content via localhost. +- No internet connection required. +- Ability to publish via git. +- Ability to host your blog on a static web-server. +- Ability to host freely on GitHub Pages. +- No database required. + +# How Jekyll Works + +The following is a complete but concise outline of exactly how Jekyll works. + +Be aware that core concepts are introduced in rapid succession without code examples. +This information is not intended to specifically teach you how to do anything, rather it +is intended to give you the _full picture_ relative to what is going on in Jekyll-world. + +Learning these core concepts should help you avoid common frustrations and ultimately +help you better understand the code examples contained throughout Jekyll-Bootstrap. + + +## Initial Setup + +After [installing jekyll](/index.html#start-now) you'll need to format your website directory in a way jekyll expects. +Jekyll-bootstrap conveniently provides the base directory format. + +### The Jekyll Application Base Format + +Jekyll expects your website directory to be laid out like so: + + . + |-- _config.yml + |-- _includes + |-- _layouts + | |-- default.html + | |-- post.html + |-- _posts + | |-- 20011-10-25-open-source-is-good.markdown + | |-- 20011-04-26-hello-world.markdown + |-- _site + |-- index.html + |-- assets + |-- css + |-- style.css + |-- javascripts + + +- **\_config.yml** + Stores configuration data. + +- **\_includes** + This folder is for partial views. + +- **\_layouts** + This folder is for the main templates your content will be inserted into. + You can have different layouts for different pages or page sections. + +- **\_posts** + This folder contains your dynamic content/posts. + the naming format is required to be `@YEAR-MONTH-DATE-title.MARKUP@`. + +- **\_site** + This is where the generated site will be placed once Jekyll is done transforming it. + +- **assets** + This folder is not part of the standard jekyll structure. + The assets folder represents _any generic_ folder you happen to create in your root directory. + Directories and files not properly formatted for jekyll will be left untouched for you to serve normally. + +(read more: ) + + +### Jekyll Configuration + +Jekyll supports various configuration options that are fully outlined here: + + + + + +## Content in Jekyll + +Content in Jekyll is either a post or a page. +These content "objects" get inserted into one or more templates to build the final output for its respective static-page. + +### Posts and Pages + +Both posts and pages should be written in markdown, textile, or HTML and may also contain Liquid templating syntax. +Both posts and pages can have meta-data assigned on a per-page basis such as title, url path, as well as arbitrary custom meta-data. + +### Working With Posts + +**Creating a Post** +Posts are created by properly formatting a file and placing it the `_posts` folder. + +**Formatting** +A post must have a valid filename in the form `YEAR-MONTH-DATE-title.MARKUP` and be placed in the `_posts` directory. +If the data format is invalid Jekyll will not recognize the file as a post. The date and title are automatically parsed from the filename of the post file. +Additionally, each file must have [YAML Front-Matter](https://github.com/mojombo/jekyll/wiki/YAML-Front-Matter) prepended to its content. +YAML Front-Matter is a valid YAML syntax specifying meta-data for the given file. + +**Order** +Ordering is an important part of Jekyll but it is hard to specify a custom ordering strategy. +Only reverse chronological and chronological ordering is supported in Jekyll. + +Since the date is hard-coded into the filename format, to change the order, you must change the dates in the filenames. + +**Tags** +Posts can have tags associated with them as part of their meta-data. +Tags may be placed on posts by providing them in the post's YAML front matter. +You have access to the post-specific tags in the templates. These tags also get added to the sitewide collection. + +**Categories** +Posts may be categorized by providing one or more categories in the YAML front matter. +Categories offer more significance over tags in that they can be reflected in the URL path to the given post. +Note categories in Jekyll work in a specific way. +If you define more than one category you are defining a category hierarchy "set". +Example: + + --- + title : Hello World + categories : [lessons, beginner] + --- + +This defines the category hierarchy "lessons/beginner". Note this is _one category_ node in Jekyll. +You won't find "lessons" and "beginner" as two separate categories unless you define them elsewhere as singular categories. + +### Working With Pages + +**Creating a Page** +Pages are created by properly formatting a file and placing it anywhere in the root directory or subdirectories that do _not_ start with an underscore. + +**Formatting** +In order to register as a Jekyll page the file must contain [YAML Front-Matter](https://github.com/mojombo/jekyll/wiki/YAML-Front-Matter). +Registering a page means 1) that Jekyll will process the page and 2) that the page object will be available in the `site.pages` array for inclusion into your templates. + +**Categories and Tags** +Pages do not compute categories nor tags so defining them will have no effect. + +**Sub-Directories** +If pages are defined in sub-directories, the path to the page will be reflected in the url. +Example: + + . + |-- people + |-- bob + |-- essay.html + +This page will be available at `http://yourdomain.com/people/bob/essay.html` + + +**Recommended Pages** + +- **index.html** + You will always want to define the root index.html page as this will display on your root URL. +- **404.html** + Create a root 404.html page and GitHub Pages will serve it as your 404 response. +- **sitemap.html** + Generating a sitemap is good practice for SEO. +- **about.html** + A nice about page is easy to do and gives the human perspective to your website. + + +## Templates in Jekyll + +Templates are used to contain a page's or post's content. +All templates have access to a global site object variable: `site` as well as a page object variable: `page`. +The site variable holds all accessible content and metadata relative to the site. +The page variable holds accessible data for the given page or post being rendered at that point. + +**Create a Template** +Templates are created by properly formatting a file and placing it in the `_layouts` directory. + +**Formatting** +Templates should be coded in HTML and contain YAML Front Matter. +All templates can contain Liquid code to work with your site's data. + +**Rending Page/Post Content in a Template** +There is a special variable in all templates named : `content`. +The `content` variable holds the page/post content including any sub-template content previously defined. +Render the content variable wherever you want your main content to be injected into your template: + +{% capture text %}... + + +
      + |.{content}.| +
      + +...{% endcapture %} +{% include helpers/liquid_raw.html %} + +### Sub-Templates + +Sub-templates are exactly templates with the only difference being they +define another "root" layout/template within their YAML Front Matter. +This essentially means a template will render inside of another template. + +### Includes +In Jekyll you can define include files by placing them in the `_includes` folder. +Includes are NOT templates, rather they are just code snippets that get included into templates. +In this way, you can treat the code inside includes as if it was native to the parent template. + +Any valid template code may be used in includes. + + +## Using Liquid for Templating + +Templating is perhaps the most confusing and frustrating part of Jekyll. +This is mainly due to the fact that Jekyll templates must use the Liquid Templating Language. + +### What is Liquid? + +[Liquid](https://github.com/Shopify/liquid) is a secure templating language developed by [Shopify](http://shopify.com). +Liquid is designed for end-users to be able to execute logic within template files +without imposing any security risk on the hosting server. + +Jekyll uses Liquid to generate the post content within the final page layout structure and as the primary interface for working with +your site and post/page data. + +### Why Do We Have to Use Liquid? + +GitHub uses Jekyll to power [GitHub Pages](http://pages.github.com/). +GitHub cannot afford to run arbitrary code on their servers so they lock developers down via Liquid. + +### Liquid is Not Programmer-Friendly. + +The short story is liquid is not real code and its not intended to execute real code. +The point being you can't do jackshit in liquid that hasn't been allowed explicitly by the implementation. +What's more you can only access data-structures that have been explicitly passed to the template. + +In Jekyll's case it is not possible to alter what is passed to Liquid without hacking the gem or running custom plugins. +Both of which cannot be supported by GitHub Pages. + +As a programmer - this is very frustrating. + +But rather than look a gift horse in the mouth we are going to +suck it up and view it as an opportunity to work around limitations and adopt client-side solutions when possible. + +**Aside** +My personal stance is to not invest time trying to hack liquid. It's really unnecessary +_from a programmer's_ perspective. That is to say if you have the ability to run custom plugins (i.e. run arbitrary ruby code) +you are better off sticking with ruby. Toward that end I've built [Mustache-with-Jekyll](http://github.com/plusjade/mustache-with-jekyll) + + +## Static Assets + +Static assets are any file in the root or non-underscored subfolders that are not pages. +That is they have no valid YAML Front Matter and are thus not treated as Jekyll Pages. + +Static assets should be used for images, css, and javascript files. + + + + +## How Jekyll Parses Files + +Remember Jekyll is a processing engine. There are two main types of parsing in Jekyll. + +- **Content parsing.** + This is done with textile or markdown. +- **Template parsing.** + This is done with the liquid templating language. + +And thus there are two main types of file formats needed for this parsing. + +- **Post and Page files.** + All content in Jekyll is either a post or a page so valid posts and pages are parsed with markdown or textile. +- **Template files.** + These files go in `_layouts` folder and contain your blogs **templates**. They should be made in HTML with the help of Liquid syntax. + Since include files are simply injected into templates they are essentially parsed as if they were native to the template. + +**Arbitrary files and folders.** +Files that _are not_ valid pages are treated as static content and pass through +Jekyll untouched and reside on your blog in the exact structure and format they originally existed in. + +### Formatting Files for Parsing. + +We've outlined the need for valid formatting using **YAML Front Matter**. +Templates, posts, and pages all need to provide valid YAML Front Matter even if the Matter is empty. +This is the only way Jekyll knows you want the file processed. + +YAML Front Matter must be prepended to the top of template/post/page files: + + --- + layout: post + category : pages + tags : [how-to, jekyll] + --- + + ... contents ... + +Three hyphens on a new line start the Front-Matter block and three hyphens on a new line end the block. +The data inside the block must be valid YAML. + +Configuration parameters for YAML Front-Matter is outlined here: +[A comprehensive explanation of YAML Front Matter](https://github.com/mojombo/jekyll/wiki/YAML-Front-Matter) + +#### Defining Layouts for Posts and Templates Parsing. + +The `layout` parameter in the YAML Front Matter defines the template file for which the given post or template should be injected into. +If a template file specifies its own layout, it is effectively being used as a `sub-template.` +That is to say loading a post file into a template file that refers to another template file with work in the way you'd expect; as a nested sub-template. + + + + + +## How Jekyll Generates the Final Static Files. + +Ultimately, Jekyll's job is to generate a static representation of your website. +The following is an outline of how that's done: + +1. **Jekyll collects data.** + Jekyll scans the posts directory and collects all posts files as post objects. It then scans the layout assets and collects those and finally scans other directories in search of pages. + +2. **Jekyll computes data.** + Jekyll takes these objects, computes metadata (permalinks, tags, categories, titles, dates) from them and constructs one + big `site` object that holds all the posts, pages, layouts, and respective metadata. + At this stage your site is one big computed ruby object. + +3. **Jekyll liquifies posts and templates.** + Next jekyll loops through each post file and converts (through markdown or textile) and **liquifies** the post inside of its respective layout(s). + Once the post is parsed and liquified inside the the proper layout structure, the layout itself is "liquified". + **Liquification** is defined as follows: Jekyll initiates a Liquid template, and passes a simpler hash representation of the ruby site object as well as a simpler + hash representation of the ruby post object. These simplified data structures are what you have access to in the templates. + +3. **Jekyll generates output.** + Finally the liquid templates are "rendered", thereby processing any liquid syntax provided in the templates + and saving the final, static representation of the file. + +**Notes.** +Because Jekyll computes the entire site in one fell swoop, each template is given access to +a global `site` hash that contains useful data. It is this data that you'll iterate through and format +using the Liquid tags and filters in order to render it onto a given page. + +Remember, in Jekyll you are an end-user. Your API has only two components: + +1. The manner in which you setup your directory. +2. The liquid syntax and variables passed into the liquid templates. + +All the data objects available to you in the templates via Liquid are outlined in the **API Section** of Jekyll-Bootstrap. +You can also read the original documentation here: + +## Conclusion + +I hope this paints a clearer picture of what Jekyll is doing and why it works the way it does. +As noted, our main programming constraint is the fact that our API is limited to what is accessible via Liquid and Liquid only. + +Jekyll-bootstrap is intended to provide helper methods and strategies aimed at making it more intuitive and easier to work with Jekyll =) + +**Thank you** for reading this far. + +## Next Steps + +Please take a look at [{{ site.categories.api.first.title }}]({{ site.categories.api.first.url }}) +or jump right into [Usage]({{ site.categories.usage.first.url }}) if you'd like. \ No newline at end of file diff --git a/_posts/core-samples/api/2011-11-27-theme-api.md b/_posts/core-samples/api/2011-11-27-theme-api.md new file mode 100644 index 0000000000..c754907c04 --- /dev/null +++ b/_posts/core-samples/api/2011-11-27-theme-api.md @@ -0,0 +1,10 @@ +--- +layout : post +categories : api +tags : api +--- + +The Jekyll Bootstrap Theme API documents how themes should be formatted +in order to be plugged into jekyll-bootstrap. + +## Philosophy diff --git a/_posts/core-samples/api/2011-11-28-bootstrap-api.md b/_posts/core-samples/api/2011-11-28-bootstrap-api.md new file mode 100644 index 0000000000..bfdb5c0100 --- /dev/null +++ b/_posts/core-samples/api/2011-11-28-bootstrap-api.md @@ -0,0 +1,65 @@ +--- +layout : post +categories : api +tags : api +--- + +The Jekyll Bootstrap API consists of custom includes and development +strategies meant to provide a more modular and sensible coding experience +when working with Liquid and Jekyll. + +## Philosophy + +Jekyll-bootstrap uses an 'include' helper strategy to encapsulate frequently used +code logic. This makes for more modular and DRY code. + +The 'include' helper is the same concept as rails' view helper modules, +just obviously much more constrained due to Liquid. + +## Include-helper Strategy + +### Define a new "method" + +The include helper strategy is meant to emulate a ruby method. +First encapsulate your liquid code logic in a Jekyll include file. +example: `helpers/tags_list.html` which is a helper to list tags and their total counts. + +{% capture text %}|.% for tag in tags_list %.| +
    • |.{ tag[0] }.| |.{tag[1].size}.|
    • +|.% endfor %.| + +|.% assign tags_list = null %.|{% endcapture %} +{% include helpers/liquid_raw.html %} + +In order to emulate passing arguments to the method, your include should reference localized variables whenever possible. +Now we can pass in arguments by defining the local variables immediately before calling the include file: + +### Invoking the Method. + +{% capture text %}
        + |.% assign tags_list = site.tags %.| + |.% include helpers/tags_list.html %.| +
      {% endcapture %} +{% include helpers/liquid_raw.html %} + +You can define as many "arguments" as you want, just remember to nullify them all at the end of your include to preserve modularity. + +### Gotchas + +In Liquid, it is impossible to inline assign a variable to anything other than a string. +This means you can't pass in arrays, hashes, etc. +However, as shown above, you can pass-by-reference, and assign local variables to variables that already exist. + +So to pass in data-structures, you need to define them in your YAML Front Matter, or \_config.html file first, then pass them in by reference. + +## Contibuting + +If you have a good idea for another helper, please follow the outlines above, +then submit a pull request to [Jekyll-Bootstrap](http://github.com/plusjade/jekyll-bootstrap) and I'll include it. + +## Current Jekyll-Bootstrap Helpers + +
        + {% assign pages_list = site.categories.helpers %} + {% include helpers/pages_list.html %} +
      diff --git a/_posts/core-samples/api/2011-11-29-jekyll-liquid-api.md b/_posts/core-samples/api/2011-11-29-jekyll-liquid-api.md new file mode 100644 index 0000000000..ac1bafd1f8 --- /dev/null +++ b/_posts/core-samples/api/2011-11-29-jekyll-liquid-api.md @@ -0,0 +1,38 @@ +--- +layout : post +categories : api +tags : api +--- + +Here we'll get familiar with the Liquid syntax and learn about all the methods and logic available to us. + +## Introduction + +Jekyll uses the standard Liquid templating language package and includes a few other helpful extensions of its own. + +Jekyll-bootstrap does not support plugin development so only the standard filters and logic will be available to us. + +Remember we are the end-users! + +## Liquid Crash Course + +The following link contains a comprehensive course in everything available in Liquid. +The standard library is also available in Jekyll. + + + +## Liquid Extensions Provided With Jekyll + +Jekyll introduces a few other filters and tags as outlined here: + + + +## Examples + +Finally we take a look out the included helper examples and their source to see +how we can display our post and site information in a more strategic manner. + +
        +{% assign pages_list = site.categories.helpers %} +{% include helpers/pages_list.html %} +
      diff --git a/_posts/core-samples/api/2011-11-30-template-data-api.md b/_posts/core-samples/api/2011-11-30-template-data-api.md new file mode 100644 index 0000000000..a12b5972af --- /dev/null +++ b/_posts/core-samples/api/2011-11-30-template-data-api.md @@ -0,0 +1,172 @@ +--- +layout : post +categories : api +tags : [templating, liquid] +--- + +The Template data API is a comprehensive list of all data accessible in templates through using the Liquid templating language. +The next lesson will focus on [accessing Jekyll data via Liquid]({{page.previous.url}}) + +## Global Page/Post Data + +Every content file that Jekyll processes is either a page or a post. +In both cases the data relative to the specific page or post being rendered +within the template is accessible through the `page` variable. +The page variable is a globally accessible variable available to all templates, posts, pages, and includes being rendered +for the given post/page instance. + + + /* The following format represents a Jekyll::Post or Jekyll::Page object. Jekyll::Post and Jekyll::Page objects may be nested in other variables in which case you can expect this same format: */ + page = { + "layout"=>"post", + "categories"=>["lessons"], + "title"=>"Jekyll Liquid Api", + "url"=>"/lessons/jekyll-liquid-api.html", + "date"=>2011-01-27 00:00:00 -0800, + "id"=>"/lessons/jekyll-liquid-api", + "next"=> #Jekyll:Post @id="/lessons/template-data-api", + "previous"=> #Jekyll:Post @id="/lessons/configuring-urls", + "tags"=>["tagname1", "tagname2"], + "custom_variable"=> ["a", "custom", "defined", "data-structure"], + "content"=>"... this is the unparsed raw html page/post content ..." + } + + +### Setting Custom Data + +You can set custom variables through the post or page Yaml Front matter and they will be included +in the page hash. + +One important thing to note is that each Jekyll "rendering" instance is treating as a page/post object. +ALL YAML Front matter is merged into the current page/post instance. +So if you define custom data in the post file, then define custom data in the sub-template, +and also in the root template, all data will merge into the same page hash. + + +## Content Data + +Jekyll uses a special variable named `content` to refer to the current page/post content. + +The difference between `content` and `page.content` is the former is parsed with markdown or textile while the latter is raw. + +The `content` variable is only accessible in template files and include files provided the include is included into a template. + +### Content in Primary Templates. + +When calling `content` in a primary template the content includes any sub-templates +previously rendered by the page/post. + +### Content in Sub-Templates. + +When calling `content` in a sub-template `content` includes any sub-sub-templates +previously rendered by the page/post. If there are none, `content` just reflects +the page/post as processed by markdown or textile. + + +## Global Site Data + +This data is available anywhere liquid is available. This includes templates, posts, pages, and includes. + + + site = { + "related_posts"=> + [...(Array of liquified Jekyll::Post objects)...], + "safe"=>false, + "auto"=>true, + "server"=>true, + "server_port"=>4000, + "source"=>"/Users/jade/Dropbox/github/jekyll-bootstrap", + "destination"=>"/Users/jade/Dropbox/github/jekyll-bootstrap/_site", + "plugins"=>"/Users/jade/Dropbox/github/jekyll-bootstrap/_plugins", + "future"=>true, + "lsi"=>false, + "pygments"=>false, + "markdown"=>"maruku", + "permalink"=>"/:categories/:title.html", + "markdown_ext"=>"markdown,mkd,mkdn,md", + "textile_ext"=>"textile", + "maruku"=> + { + "use_tex"=>false, + "use_divs"=>false, + "png_engine"=>"blahtex", + "png_dir"=>"images/latex", + "png_url"=>"/images/latex" + }, + "rdiscount"=> + { + "extensions"=>[] + }, + "redcarpet"=> + { + "extensions"=>[] + }, + "kramdown"=> + { + "auto_ids"=>true, + "footnote_nr"=>1, + "entity_output"=>"as_char", + "toc_levels"=>"1..6", + "use_coderay"=>false, + "coderay"=> + { + "coderay_wrap"=>"div", + "coderay_line_numbers"=>"inline", + "coderay_line_number_start"=>1, + "coderay_tab_width"=>4, + "coderay_bold_every"=>10, + "coderay_css"=>"style" + } + }, + "time"=>2011-12-20 14:03:53 -0800, + "posts"=> + [...(Array of liquified Jekyll::Post objects)...], + "pages"=> + [...(Array of liquified Jekyll::Page objects)...], + "html_pages"=> + [...(Array of liquified Jekyll::Page objects)...], + "categories"=> + {"examples"=> + [...(Array of liquified Jekyll::Post objects)...], + "lessons"=> + [...(Array of liquified Jekyll::Post objects)...], + "tags"=> + { + "permalinks"=> + [...(Array of liquified Jekyll::Post objects)...], + "urls"=> + [...(Array of liquified Jekyll::Post objects)...], + "templating"=> + [...(Array of liquified Jekyll::Post objects)...], + "liquid"=> + [...(Array of liquified Jekyll::Post objects)...], + "posts"=> + [...(Array of liquified Jekyll::Post objects)...] + } + } + + + +### Sitewide Custom Data + +Set sitewide custom data using the config file. + +Variables held in the config file get merged into the site variable. + + + + + +## Categories + +Categories may only be applied to posts and are available on a per-post basis as well as aggregated +in a sitewide global variable, i.e. all categories available for the website. + +When iterating over categories the order is alpha descending + +## Tags + +Tags may only be applied to posts and are available on a per-post basis as well as aggregated +in a sitewide global variable, i.e. all tags available for the website. + +When iterating over tags the order is alpha descending. diff --git a/_posts/core-samples/helpers/2011-9-27-posts-collate.md b/_posts/core-samples/helpers/2011-9-27-posts-collate.md new file mode 100644 index 0000000000..299f6cb277 --- /dev/null +++ b/_posts/core-samples/helpers/2011-9-27-posts-collate.md @@ -0,0 +1,34 @@ +--- +layout : post +categories : helpers +--- + +The posts collate helper organizes and lists posts in month/year clusters. +The posts collate helper follows the [Jekyll-bootstrap include helper](/lessons/bootstrap-api.html) strategy. + +## Usage + +### Collate All Posts in Reverse Chronological Order + +By default all posts are organized in reverse-chronological order - newest to oldest. + +{% capture text %}|.% assign posts_collate = site.posts %.| +|.% include helpers/posts_collate.html %.|{% endcapture %} +{% include helpers/liquid_raw.html %} + + +### Collate a Sub-Set of Posts + +To collate a sub-set of posts, just pass in the sub-set. +Bellow, only posts tagged "jekyll" will be collated: + +{% capture text %}|.% assign posts_collate = site.tags.jekyll %.| +|.% include helpers/posts_collate.html %.|{% endcapture %} +{% include helpers/liquid_raw.html %} + + +## Source + +The source code is available at: + + ./_includes/helpers/posts_collate.html diff --git a/_posts/core-samples/helpers/2011-9-28-categories-list.md b/_posts/core-samples/helpers/2011-9-28-categories-list.md new file mode 100644 index 0000000000..a8319801c2 --- /dev/null +++ b/_posts/core-samples/helpers/2011-9-28-categories-list.md @@ -0,0 +1,49 @@ +--- +layout : post +categories : helpers +--- + +The categories list helper provides a convenient way to list categories. +The categories list helper follows the [Jekyll-bootstrap include helper](/lessons/bootstrap-api.html) strategy. + +## Usage + +### List Sitewide Categories + +List site-wide categories by passing in the `site.categories` variable: + +{% capture text %}
        + |.% assign categories_list = site.categories %.| + |.% include helpers/categories_list.html %.| +
      {% endcapture %} +{% include helpers/liquid_raw.html %} + +### List Categories for a Specific Post + +You can also list categories specific to a post: + +{% capture text %}
        + |.% assign categories_list = page.categories %.| + |.% include helpers/categories_list.html %.| +
      {% endcapture %} +{% include helpers/liquid_raw.html %} + +### List Categories Per Post Iteratively + +Finally let's iterate through all posts: + +{% capture text %}|.% for post in site.posts %.| +

      Categories for: |.{post.title}.|

      +
        + |.% assign categories_list = post.categories %.| + |.% include helpers/categories_list.html %.| +
      +|.% endfor %.|{% endcapture %} +{% include helpers/liquid_raw.html %} + + +## Source + +The source code is available at: + + ./_includes/helpers/categories_list.html \ No newline at end of file diff --git a/_posts/core-samples/helpers/2011-9-29-pages-list.md b/_posts/core-samples/helpers/2011-9-29-pages-list.md new file mode 100644 index 0000000000..dcdc4e048d --- /dev/null +++ b/_posts/core-samples/helpers/2011-9-29-pages-list.md @@ -0,0 +1,43 @@ +--- +layout : post +categories : helpers +--- + +The pages list helper provides a convenient way to list pages. +The pages list helper follows the [Jekyll-bootstrap include helper](/lessons/bootstrap-api.html) strategy. + +## Usage + +### List All Pages + +{% capture text %}
        + |.% assign pages_list = site.pages %.| + |.% include helpers/pages_list.html %.| +
      {% endcapture %} +{% include helpers/liquid_raw.html %} + +### List Pages From a Sub-Group + +Pages cannot have categories. However we can setup a similar functionality +by manually associating a page to a "group". Do this in the page's yaml front matter: + + --- + layout: default + title: A Nice Title + group: project + --- + +You then pass the group name to the pages\_list helper: + +{% capture text %}
        + |.% assign pages_list = site.pages %.| + |.% assign group = 'project' %.| + |.% include helpers/pages_list.html %.| +
      {% endcapture %} +{% include helpers/liquid_raw.html %} + +## Source + +The source code is available at: + + ./_includes/helpers/pages_list.html diff --git a/_posts/core-samples/helpers/2011-9-30-tags-list.md b/_posts/core-samples/helpers/2011-9-30-tags-list.md new file mode 100644 index 0000000000..9ddaf53733 --- /dev/null +++ b/_posts/core-samples/helpers/2011-9-30-tags-list.md @@ -0,0 +1,50 @@ +--- +layout : post +categories : helpers +--- + +The tag list helper lists tags and their total counts. +The tag list helper follows the [Jekyll-bootstrap include helper](/lessons/bootstrap-api.html) strategy. + +## Usage + +### List Sitewide Tags + +You can list sitewide tags by passing in the `site.tags` variable: + +{% capture text %}
        + |.% assign tags_list = site.tags %.| + |.% include helpers/tags_list.html %.| +
      {% endcapture %} +{% include helpers/liquid_raw.html %} + +### List Tags for a Specific Post + +You can also list tags specific to a post: + +{% capture text %}
        + |.% assign tags_list = page.tags %.| + |.% include helpers/tags_list.html %.| +
      {% endcapture %} +{% include helpers/liquid_raw.html %} + +### List Tags Per Post Iteratively + +Finally let's iterate through all posts: + +{% capture text %}|.% for post in site.posts %.| +

      Tags for: |.{post.title}.|

      +
        + |.% assign tags_list = post.tags %.| + |.% include helpers/tags_list.html %.| +
      +|.% endfor %.|{% endcapture %} +{% include helpers/liquid_raw.html %} + +## Source + +The source code is available at: + + ./_includes/helpers/tags_list.html + + diff --git a/_posts/core-samples/usage/2011-10-28-deployment-and-hosting.md b/_posts/core-samples/usage/2011-10-28-deployment-and-hosting.md new file mode 100644 index 0000000000..64bb0b49cd --- /dev/null +++ b/_posts/core-samples/usage/2011-10-28-deployment-and-hosting.md @@ -0,0 +1,36 @@ +--- +layout: page +categories : usage +--- + +Deploying a jekyll-based website comes in two flavors. +You can deploy to GitHub Pages or you can deploy to your own custom server. + +## Deploy Jekyll to GitHub Pages + +You can deploy Jekyll to your GitHub account and GitHub will parse your repo through Jekyll and host the result on username.github.com +This is very nice of GitHub and the most convenient strategy. +However you cannot extend jekyll via plugins with this version because GitHub will not run them for security reasons. + +[GitHub Pages](http://pages.github.com) provides a comprehension tutorial to deploying your Jekyll repository to GitHub Pages. + + +### Jekyll-Bootstrap is Built to Run on GitHub Pages. + itself, is running via GitHub pages. +You can see that this website is also available at: . + +If you follow the development practices outlined in Jekyll-bootstrap all you have to do is +clone the jekyll-bootstrap framework, clear out the posts and pages and add in your own content. +Then push this to github as per the [GitHub Pages](http://pages.github.com) tutorial. + +Please [contact me](http://plusjade.com) if you run into any trouble. + + +## Deploy Jekyll to Your Custom Server + +The main reason you'd want to host your website yourself is because you can then run custom plugins and customize Jekyll to your heart's content. + +Please see the original docs for [custom Jekyll deployment strategies](https://github.com/mojombo/jekyll/wiki/Deployment). + + + diff --git a/_posts/core-samples/usage/2011-10-29-configuring-urls.md b/_posts/core-samples/usage/2011-10-29-configuring-urls.md new file mode 100644 index 0000000000..efc9140c18 --- /dev/null +++ b/_posts/core-samples/usage/2011-10-29-configuring-urls.md @@ -0,0 +1,26 @@ +--- +layout : post +categories : usage +tags : [permalinks, urls] +--- + +URL configuration is an important aspect of Jekyll as users usually require +total control over how links to their content are handled. Fortunately Jekyll provides extensive customization options as to how your permalinks will be generated: + +[Jekyll Permalinks](https://github.com/mojombo/jekyll/wiki/Permalinks) + +## Jekyll-Bootstrap's URL Configuration + +A peek into `_config.yml` notes that Jekyll-bootrap uses this configuration: + + permalink: /:categories/:title.html + + +This means any category specified on a post will be included within the url, followed by the post title. + +Traditionally a blog will namespace its post by date, for example: + + permalink: /:categories/:year/:month/:day/:title/ + + +Play around with what url configuration works best for you. \ No newline at end of file diff --git a/_posts/core-samples/usage/2011-10-30-jekyll-theming.md b/_posts/core-samples/usage/2011-10-30-jekyll-theming.md new file mode 100644 index 0000000000..c22616da6e --- /dev/null +++ b/_posts/core-samples/usage/2011-10-30-jekyll-theming.md @@ -0,0 +1,31 @@ +--- +layout: post +categories : usage +--- + + +## Creating Your Layout + +Jekyll-bootstrap uses [twitter bootstrap](http://twitter.github.com/bootstrap) to provide the layout structure. +This is because I am not a designer. (designers please contribute themes to Jekyll-bootstrap!) + +To get up and running the fastest you might just take a peak at the twitter bootstrap design elements +and setup a quick template that you are happy with. + + +### Static Assets + +The `assets` folder follows a logical structure: +`css` folder contain css, `javascripts` folder contain javascript files etc. +You can link to these static assets following the logical directory path. + +### Create a Base Template + +The base template in Jekyll-bootstrap is at: `/_layouts/default.html` +You can see how the global layout is defined and how assets are linked to. + +### Create a Post Template + +The post template in Jekyll-bootstrap is at: `/_layouts/post.html` +This template is a sub-template that all posts refer to. You can see the post template defines +the default template its parent layout. diff --git a/_posts/core-samples/usage/2011-10-31-jekyll-quick-start.md b/_posts/core-samples/usage/2011-10-31-jekyll-quick-start.md new file mode 100644 index 0000000000..e09e07c8dd --- /dev/null +++ b/_posts/core-samples/usage/2011-10-31-jekyll-quick-start.md @@ -0,0 +1,81 @@ +--- +layout: post +categories : usage +--- + + +## 1. Install Jekyll-Bootstrap-Core + +[Install Jekyll-Bootsrap-Core](/index.html#start-now) if you haven't already. +Jekyll-bootstrap-core is a clean base framework for your blog. +It includes two themes, some useful pages, and bootstrap include-helpers. + +## 2. Run Jekyll Locally + +In order to preview your blog locally you'll need to install the jekyll gem. Note gem dependencies will also be installed. + + $ gem install jekyll + +If you run into a problem please consult the original [Jekyll installation documentation](https://github.com/mojombo/jekyll/wiki/Install). +You can also [contact me](http://github.com/plusjade) through github. + +Once the gem is installed you can navigate to your Jekyll-bootstrap-core directory +and run jekyll: + + $ cd jekyll-bootstrap + $ jekyll --server + +Your blog is now available at: [http://localhost:4000/](http://localhost:4000/). + + +## 2. Choose a Theme + +Jekyll-bootstrap-core has a basic theming system that I'll be steadily improving. +You can read about how to choose and customize a theme in the [Theming](/usages/theming.html) section. + +## 3. Create Some Content + +### Create a Post + +Create a file with valid date and title in the filename and place it into the `_posts` folder. +Jekyll-bootstrap provides many post files for you to copy from to better understand the formatting requirements. + +### Create a Page + +Create a file anywhere in the root directory, for example `/about.md` and remember to provide +valid YAML Front Matter so Jekyll recognizes the file as a page. + +Jekyll-bootstrap provides many page examples for reference. +You can study the source and customize it for your own needs. + +
        +{% assign pages_list = site.pages %} +{% assign group = "example-page" %} +{% include helpers/pages_list.html %} +
      + + +## 4. Publish + +After you've added posts or made changes to your theme or other files, simply commit them to your git repo and push the commits up to GitHub. + +A GitHub post-commit hook will automatically deploy your changes to your hosted blog. You will receive a success or failure notice for every commit you make to your blog. + +## 5. Customize + +Jekyll-bootstrap-core can be used as-is as a basic blogging platform with little need +to understand what's going on under the hood. + +However I'm betting you want to get your hands dirty. +The following outlines the deeper Jekyll-Bootstrap documentation. + +### Jekyll Introduction + +The [{{site.categories.lessons.first.title}}]({{site.categories.lessons.first.url}}) is meant for core understanding of how and why Jekyll works the way it does. +You must start with this in order to understand everything else in Jekyll-Bootstrap. + +### The API Section + +The API pages document main data-structures and design strategies used in Jekyll and Jekyll-Bootstrap. + + diff --git a/archive.html b/archive.html new file mode 100644 index 0000000000..3e622e70bc --- /dev/null +++ b/archive.html @@ -0,0 +1,9 @@ +--- +layout: page +title : Archive +header : Post Archive +group: example-page +--- + +{% assign posts_collate = site.posts %} +{% include helpers/posts_collate.html %} \ No newline at end of file diff --git a/assets/themes/mark-reid/css/screen.css b/assets/themes/mark-reid/css/screen.css new file mode 100644 index 0000000000..494c382ad2 --- /dev/null +++ b/assets/themes/mark-reid/css/screen.css @@ -0,0 +1,549 @@ +/* @override http://mark.reid.dev/files/css/screen.css */ + +/* @override + http://mark.reid.dev/files/css/screen.css + http://mark.reid.name/files/css/screen.css +*/ + +/* screen.css + * + * A clean, simple stylesheet that aims for + * a consistent vertical rhythm. + * + * Base font height: 16px + * Base line length: 24px + * + * AUTHOR: Mark Reid + */ + +/* @group Reset */ +body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,p,blockquote,th,td,abbr { margin:0; padding:0;} +/* @end */ + +body { + font-family: Palatino, georgia, "times new roman", serif; + background-color: whitesmoke; + background-position: center -18em; + background-repeat: repeat-x; +} + +/* Hack via Joel Spolsky to make image rescaling nicer in IE */ +img { -ms-interpolation-mode:bicubic; } + +/* IE6 ignores this and uses default size of 16pt */ +html>body { font-size:16px; } +p { margin: 0 0 1.5em 0; text-align: justify; } + +a { text-decoration: none; color: #339; } +a:hover { text-decoration: underline; color: #33f; } +a.pdf:before { + margin-right: 1em; + content: url(/files/css/icon_pdf.gif); } + +h1,h2,h3,h4 { + line-height:1em; + font-size:1.5em; + font-weight: normal; + clear: left; + font-family: 'lucida grande', sans-serif; +} +h1 { margin-bottom: 1em; } +h2 { + font-size: 100%; + line-height: 1.5em; + margin:1.5em 0 1.5em 0; + font-weight:bold; +} + +hr { + border-top: 1px solid silver; + border-bottom: none; + padding: 0; + margin: 1.46em 0 0 0; +} + +sup { line-height: 1ex; } + +#site { + max-width: 46em; + margin: 1.5em auto 3em auto; + line-height:1.5em; +} + +#page, #disqus_thread { + background: white; +/* background-image: url(grid.png); */ + padding: 3em 3em 1.5em 3em; + border: 1px solid #ccc; +} + +/* More experimental CSS3 features */ +#page, #disqus_thread { + box-shadow: 2px 2px 8px #aaa; + -webkit-box-shadow: 2px 2px 8px #aaa; + -moz-box-shadow: 2px 2px 8px #aaa; +} + +#disqus_thread { padding-top: 0; } + +/* TODO +#page { counter-reset: section; } +#page h2:before { + margin-left: -3.5ex; + color: silver; + content: "§" counter(section) ". "; + counter-increment: section 2; +} +*/ + +/* @group FancyFirst */ +.emphnext + p:first-letter, p.emphfirst:first-letter { + font-size: 48px; + padding: 0 0.15em 0 0; + margin: 0.05em 0 -0.15em 0; + line-height: 1em; + float: left; +} + +.emphnext + p:first-line, p.emphfirst:first-line { + font-variant: small-caps; + font-size: larger; +} +/* @end */ + +.right { float: right; clear: left; } +.left { float: left; clear: right; } +.inset { + border: 1px solid silver; + padding: 2px; + margin: 0em 0.8em 0.8em 0.8em; +} +.right.inset { margin-right: 0 !important; } +.left.inset { margin-left: 0 !important; } +.quiet { + color: grey; + font-size: 0.875em; + line-height: 1.714em; +} +blockquote { + padding: 0 2.8em; + margin: 1.714em 0; + color: #444; + font-size: 0.875em; + line-height: 1.714em; +} + +.note { + padding-top: 0.5em; + background-color: #fafaff; + border-top: 1px solid silver; + border-bottom: 1px solid silver; +} +/* @group Table */ +table.neat { + width: 80%; + margin: 1.5em auto 1.5em auto; + table-layout: fixed; + border-spacing: 0; +} +table.neat tr { text-align: center; } +table.neat th { font-weight: normal; background-color: #eeeeee; } +table.neat td { background-color: white; } +table.neat th.title { border-bottom: 1px solid gray; border-top: 1px solid gray; vertical-align: bottom; background-color: lightgrey; } +caption { + color: #333; + font-size: 0.875em; + margin: 0.875em auto 0 auto; + line-height: 1.14em; + text-align: justify; +} + +/* @end */ + +/* @group Lists */ +ul { + margin-top: 1.5em; + margin-bottom: 1.5em; + line-height: 1.5em; + padding-left: 1.5em; +} +ul li { + list-style-type: square; + list-style-position: outside; +} +ol li { + list-style-type: decimal; + list-style-position: inside; +} +dt { font-weight: bold;} +dd { margin: 0 0 1.5em 0; text-align: justify; } + +ul.compact { margin: 0; padding: 0;} +ul.compact li { list-style: ; + list-style-type: square; + list-style-position: inside; +} +ul.compact li span.date { + display: none; + color: grey; + width: 20%; +} +ul.compact li a { + width: 70%; +} +/* @end */ + +/* @group Header */ +#header, #header a { color: silver; } +#header .hover { color: transparent; } +#header:hover a { color: black; text-shadow: #aaa 2px 2px 3px;} +#header:hover a:hover { text-decoration: none; } +#header a:hover .hover { color: silver; } +#header { + position: relative; + font-variant: small-caps; + line-height: 1em; + margin-top: .5em; + margin-bottom: 0; +} +#header h1 { + font-family: Palatino, georgia, "times new roman", serif; + margin-bottom: 0; + line-height: 0.9em; + display: block; + font-weight: normal; +} + +#header ul { + position: absolute; + top: 0; + right: 0; + font-size: 100%; + line-height: 1.6em; + display: block; + margin: 0; + width: 50%; + text-align: right; +} +#header ul li { display: inline; } +#header ul li a { + padding: 0.4em 0.3em 0 0.3em; + display: inline; +} +#header ul li a:hover { + color: blue; + border-bottom: 2px solid blue; +} +#header .byline { + color: silver; + font-size: 10pt; + line-height: 75% +} +#header:hover .byline a { color: silver; text-shadow: none; } +#header:hover .byline a:hover { color: black; text-shadow: #aaa 1px 1px 2px;} + +/* @group Twitter */ +#twitter_update_list { display: inline; margin: 0; } +#twitter_update_list li { display: inline; margin: 0;} +.twitter-title { display: inline; margin: 0; } +.twitter-title a { display: inline; } +/* @end */ + +body#Work #header a.work, +body#Home #header a.home, +body#Play #header a.play, +body#Info #header a.info, +body#Code #header a.code, +body#Past #header a.past, +body#Kith #header a.kith +{ + border-bottom: 2px solid silver; +} + +/* @end */ + +/* @group Footnotes */ +.footnotes { color: grey; } +.footnotes:hover { color: black; } +.footnotes ol li { + list-style-type: decimal; + list-style-position: inside; + font-size: 75%; + line-height: 1.5em; +} +.footnotes ol li > a { display: none; } +/* @end */ + +/* @group Sections */ +.section { + font-size: 87.5%; + line-height: 1.43em; + margin-bottom: 1.43em; + margin-top: 1.43em; + margin-left: 7.5em; + padding-right: 3em; +} +.section h1 { + font-family: Palatino, georgia, serif; + font-size: 100%; + line-height: 1.43em; + position: absolute; + width: 6em; + max-width: 6em; + margin-left: -7.5em; + font-weight: bold; + font-variant: small-caps; +} +.section p { margin-bottom: 1.43em; } + +/* @end */ + +.list .title { font-weight: bold; } +p.line { position: relative; margin: 0; } +p.excerpt { margin: 0; } +.comments { font-size: smaller; position: absolute; color: silver; right: 0; top: 0; } +.excerpt { color: black; } + +/* @group Signature */ +.signature { + margin-top: 3em; + position: relative; +} +.signature .author { + font-variant: small-caps; + font-style: normal; + color: black; + display: block; + margin-bottom: 1.5em; +} +.signature .date { + font-size: 87.5%; + line-height: 1.5em; + display: block; + font-variant: small-caps; + font-style: normal; + position: absolute; + right: 0; + top: 0; +} +.signature .location { + display: block; + font-size: 87.5%; + line-height: 1.5em; + position: absolute; + right: 0; + top: 1.5em; +} +/* @end */ + +/* @group Code */ +pre { + margin: 1em 0 1.5em 0; + font-size: 0.75em; /* Hack to make code look same size as body font */ + line-height: 1.5em; + color: #111; + background: #fffff0; + border: 1px solid #ddc; + padding: 0.5em 1em; + overflow: hidden; + + /* Experimental CSS3 stuff */ + box-shadow: 1px 1px 6px #ccc; + -webkit-box-shadow: 1px 1px 6px #ccc; + -moz-box-shadow: 1px 1px 6px #ccc; +} +pre:hover { + border-right: none; + overflow: visible; +} +code { + font-size: 1em; + background-color: #f7f7ff; + line-height: 1.4em; +} +pre > code { + background-color: transparent; +} +/* @end */ + + +/* @group Disqus */ +#disqus_thread { + margin-top: 2.93em; +} +.dsq-comment-body { + text-align: justify; + line-height: 1.29em; +} +.dsq-comment { + padding-top: 0 !important; + margin-top: 1.7em !important; + margin-bottom: 1.9em !important; + background-image: none !important; +} +.dsq-comment-message { + line-height: 1.714em; +} +.dsq-comment-header { + background-color: whitesmoke !important; + border-top: 1px solid silver !important; + border-bottom: 1px solid silver !important; + margin-bottom: 1.15em !important; +} +.dsq-header-time { margin-left: 0 !important; } +.dsq-comment-header cite { + font-variant: small-caps; + margin-left: 0 !important; +} +.dsq-comment-footer { + font-size: 75% !important; + margin-top: 1px !important; +} +#dsq-options { + background: whitesmoke; + border-bottom: 1px solid silver; + border-top: 1px solid silver; + padding: 0 0 0 1em; +} +#dsq-comments-count { + margin-top: 0.8em !important; + margin-bottom: 1.2em !important; +} +#dsq-extra-links { padding-left: 0 !important; } +#dsq-extra-links li img { display: none; } +#dsq-options-toggle { color: silver; font-size: 75% !important;} +#dsq-add-new-comment { + margin-top: 1.19em !important; + margin-bottom: 1.25em !important; +} +/* The following position, width and height ensure + * that none of the body in the iframe shows through. + */ +form#comment { + position: absolute; + height: 100%; + width: 100%; + background-color: white !important; +} +/* @end */ + +/* @group LibraryThing */ +span.LTtitle { display: none; } +div.LTitem { display: inline; margin-right: 0.7em; } +div.LTprovided { display: none; } +/* @end */ + +/* @group Last.fm */ +#lastfm a { margin-right: 0.7em; } +/* @end */ + +/* @group Delicious */ +.delicious-posts { } +.delicious-posts ul, .delicious-posts li, .delicious-banner { margin: 0; padding: 0 } +.delicious-posts li { list-style-position: outside; margin-bottom: 1em; margin-left: 1em; text-align: justify; } +.delicious-post { } +.delicious-banner { display: none; } +.delicious-posts a:hover { } +.delicious-posts a { } +.delicious-post a { font-weight: bold; } +p.delicious-extended { font-size: 100%; display: inline; } +p.delicious-extended:before { content: ' — '; } +/* @end */ + +/* @group Footer */ +#footer { + margin-top: 0; + color: grey; + font-size: 87.5%; + line-height: 1.3em; +} +#footer address { + position: relative; + margin: .5em 0 0 0; + text-align: right; +} +#footer a { + font-variant: small-caps; + font-style: normal; + color: #77d; + text-decoration: none; +} +#footer .copyright { + position: absolute; + left: 0; + text-align: left; + display: block; +} +#footer .engine { + position: absolute; + text-align: right; + display: block; + right: 0; +} +/* @end */ + + +/* @group Figures and images */ +dl.figure { + margin-top: 1.5em; + margin-bottom: 1.5em; + text-align: center; +} + +dl.figure dd { + color: #333; + font-size: 0.875em; + margin: 0.875em auto 0 auto; + line-height: 1.14em; + text-align: justify; + width: 85%; +} +/* @end */ + +/* @group Equations */ +div.maruku-equation { display: block ;text-align: center; } +div.maruku-equation img.maruku-png { position: relative; top: -0.75em;} +span.maruku-inline { } +img.maruku-png { } +/* @end */ + +/* .prev-next */ +.prev-next { + position:relative; +} +.prev-next .next{ + float:right; +} + +/* tag_box ======================================================== */ +.tag_box { + list-style:none; + margin:0; + padding:5px 0 ; + overflow:hidden; +} +.tag_box li { + list-style:none; + line-height:1.8em; +} +.tag_box.inline li { + float:left; +} +.tag_box a { + padding: 3px 6px; + margin: 2px; + background: #eee; + border-radius: 3px; + border:1px dashed #ccc; + text-decoration:none; +} +.tag_box a span{ + vertical-align:super; + font-size:0.8em; +} +.tag_box a.active { + background:#57A957; + border:1px solid #4C964D; + color:#FFF; +} + diff --git a/assets/themes/mark-reid/css/syntax.css b/assets/themes/mark-reid/css/syntax.css new file mode 100644 index 0000000000..2774b76492 --- /dev/null +++ b/assets/themes/mark-reid/css/syntax.css @@ -0,0 +1,60 @@ +.highlight { background: #ffffff; } +.highlight .c { color: #999988; font-style: italic } /* Comment */ +.highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */ +.highlight .k { font-weight: bold } /* Keyword */ +.highlight .o { font-weight: bold } /* Operator */ +.highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */ +.highlight .cp { color: #999999; font-weight: bold } /* Comment.Preproc */ +.highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */ +.highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */ +.highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */ +.highlight .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */ +.highlight .ge { font-style: italic } /* Generic.Emph */ +.highlight .gr { color: #aa0000 } /* Generic.Error */ +.highlight .gh { color: #999999 } /* Generic.Heading */ +.highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */ +.highlight .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */ +.highlight .go { color: #888888 } /* Generic.Output */ +.highlight .gp { color: #555555 } /* Generic.Prompt */ +.highlight .gs { font-weight: bold } /* Generic.Strong */ +.highlight .gu { color: #aaaaaa } /* Generic.Subheading */ +.highlight .gt { color: #aa0000 } /* Generic.Traceback */ +.highlight .kc { font-weight: bold } /* Keyword.Constant */ +.highlight .kd { font-weight: bold } /* Keyword.Declaration */ +.highlight .kp { font-weight: bold } /* Keyword.Pseudo */ +.highlight .kr { font-weight: bold } /* Keyword.Reserved */ +.highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */ +.highlight .m { color: #009999 } /* Literal.Number */ +.highlight .s { color: #d14 } /* Literal.String */ +.highlight .na { color: #008080 } /* Name.Attribute */ +.highlight .nb { color: #0086B3 } /* Name.Builtin */ +.highlight .nc { color: #445588; font-weight: bold } /* Name.Class */ +.highlight .no { color: #008080 } /* Name.Constant */ +.highlight .ni { color: #800080 } /* Name.Entity */ +.highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */ +.highlight .nf { color: #990000; font-weight: bold } /* Name.Function */ +.highlight .nn { color: #555555 } /* Name.Namespace */ +.highlight .nt { color: #000080 } /* Name.Tag */ +.highlight .nv { color: #008080 } /* Name.Variable */ +.highlight .ow { font-weight: bold } /* Operator.Word */ +.highlight .w { color: #bbbbbb } /* Text.Whitespace */ +.highlight .mf { color: #009999 } /* Literal.Number.Float */ +.highlight .mh { color: #009999 } /* Literal.Number.Hex */ +.highlight .mi { color: #009999 } /* Literal.Number.Integer */ +.highlight .mo { color: #009999 } /* Literal.Number.Oct */ +.highlight .sb { color: #d14 } /* Literal.String.Backtick */ +.highlight .sc { color: #d14 } /* Literal.String.Char */ +.highlight .sd { color: #d14 } /* Literal.String.Doc */ +.highlight .s2 { color: #d14 } /* Literal.String.Double */ +.highlight .se { color: #d14 } /* Literal.String.Escape */ +.highlight .sh { color: #d14 } /* Literal.String.Heredoc */ +.highlight .si { color: #d14 } /* Literal.String.Interpol */ +.highlight .sx { color: #d14 } /* Literal.String.Other */ +.highlight .sr { color: #009926 } /* Literal.String.Regex */ +.highlight .s1 { color: #d14 } /* Literal.String.Single */ +.highlight .ss { color: #990073 } /* Literal.String.Symbol */ +.highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */ +.highlight .vc { color: #008080 } /* Name.Variable.Class */ +.highlight .vg { color: #008080 } /* Name.Variable.Global */ +.highlight .vi { color: #008080 } /* Name.Variable.Instance */ +.highlight .il { color: #009999 } /* Literal.Number.Integer.Long */ diff --git a/assets/themes/tom/css/screen.css b/assets/themes/tom/css/screen.css new file mode 100644 index 0000000000..810e5a1b2d --- /dev/null +++ b/assets/themes/tom/css/screen.css @@ -0,0 +1,197 @@ +/*****************************************************************************/ +/* +/* Common +/* +/*****************************************************************************/ + +/* Global Reset */ + +* { + margin: 0; + padding: 0; +} + +html, body { + height: 100%; +} + +body { + background-color: white; + font: 13.34px helvetica, arial, clean, sans-serif; + *font-size: small; + text-align: center; +} + +h1, h2, h3, h4, h5, h6 { + font-size: 100%; +} + +h1 { + margin-bottom: 1em; +} + +p { + margin: 1em 0; +} + +a { + color: #00a; +} + +a:hover { + color: black; +} + +a:visited { + color: #a0a; +} + +table { + font-size: inherit; + font: 100%; +} + +/*****************************************************************************/ +/* +/* Home +/* +/*****************************************************************************/ + +ul.posts { + list-style-type: none; + margin-bottom: 2em; +} + + ul.posts li { + line-height: 1.75em; + } + + ul.posts span { + color: #aaa; + font-family: Monaco, "Courier New", monospace; + font-size: 80%; + } + +/*****************************************************************************/ +/* +/* Site +/* +/*****************************************************************************/ + +.site { + font-size: 110%; + text-align: justify; + width: 40em; + margin: 3em auto 2em auto; + line-height: 1.5em; +} + +.title { + color: #a00; + font-weight: bold; + margin-bottom: 2em; +} + + .site .title a { + color: #a00; + text-decoration: none; + } + + .site .title a:hover { + color: black; + } + + .site .title a.extra { + color: #aaa; + text-decoration: none; + margin-left: 1em; + } + + .site .title a.extra:hover { + color: black; + } + + .site .meta { + color: #aaa; + } + + .site .footer { + font-size: 80%; + color: #666; + border-top: 4px solid #eee; + margin-top: 2em; + overflow: hidden; + } + + .site .footer .contact { + float: left; + margin-right: 3em; + } + + .site .footer .contact a { + color: #8085C1; + } + + .site .footer .rss { + margin-top: 1.1em; + margin-right: -.2em; + float: right; + } + + .site .footer .rss img { + border: 0; + } + +/*****************************************************************************/ +/* +/* Posts +/* +/*****************************************************************************/ + +#post { + +} + + /* standard */ + + #post pre { + border: 1px solid #ddd; + background-color: #eef; + padding: 0 .4em; + } + + #post ul, + #post ol { + margin-left: 1.35em; + } + + #post code { + border: 1px solid #ddd; + background-color: #eef; + font-size: 85%; + padding: 0 .2em; + } + + #post pre code { + border: none; + } + + /* terminal */ + + #post pre.terminal { + border: 1px solid black; + background-color: #333; + color: white; + } + + #post pre.terminal code { + background-color: #333; + } + +#related { + margin-top: 2em; +} + + #related h2 { + margin-bottom: 1em; + } \ No newline at end of file diff --git a/assets/themes/tom/css/syntax.css b/assets/themes/tom/css/syntax.css new file mode 100644 index 0000000000..2774b76492 --- /dev/null +++ b/assets/themes/tom/css/syntax.css @@ -0,0 +1,60 @@ +.highlight { background: #ffffff; } +.highlight .c { color: #999988; font-style: italic } /* Comment */ +.highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */ +.highlight .k { font-weight: bold } /* Keyword */ +.highlight .o { font-weight: bold } /* Operator */ +.highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */ +.highlight .cp { color: #999999; font-weight: bold } /* Comment.Preproc */ +.highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */ +.highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */ +.highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */ +.highlight .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */ +.highlight .ge { font-style: italic } /* Generic.Emph */ +.highlight .gr { color: #aa0000 } /* Generic.Error */ +.highlight .gh { color: #999999 } /* Generic.Heading */ +.highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */ +.highlight .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */ +.highlight .go { color: #888888 } /* Generic.Output */ +.highlight .gp { color: #555555 } /* Generic.Prompt */ +.highlight .gs { font-weight: bold } /* Generic.Strong */ +.highlight .gu { color: #aaaaaa } /* Generic.Subheading */ +.highlight .gt { color: #aa0000 } /* Generic.Traceback */ +.highlight .kc { font-weight: bold } /* Keyword.Constant */ +.highlight .kd { font-weight: bold } /* Keyword.Declaration */ +.highlight .kp { font-weight: bold } /* Keyword.Pseudo */ +.highlight .kr { font-weight: bold } /* Keyword.Reserved */ +.highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */ +.highlight .m { color: #009999 } /* Literal.Number */ +.highlight .s { color: #d14 } /* Literal.String */ +.highlight .na { color: #008080 } /* Name.Attribute */ +.highlight .nb { color: #0086B3 } /* Name.Builtin */ +.highlight .nc { color: #445588; font-weight: bold } /* Name.Class */ +.highlight .no { color: #008080 } /* Name.Constant */ +.highlight .ni { color: #800080 } /* Name.Entity */ +.highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */ +.highlight .nf { color: #990000; font-weight: bold } /* Name.Function */ +.highlight .nn { color: #555555 } /* Name.Namespace */ +.highlight .nt { color: #000080 } /* Name.Tag */ +.highlight .nv { color: #008080 } /* Name.Variable */ +.highlight .ow { font-weight: bold } /* Operator.Word */ +.highlight .w { color: #bbbbbb } /* Text.Whitespace */ +.highlight .mf { color: #009999 } /* Literal.Number.Float */ +.highlight .mh { color: #009999 } /* Literal.Number.Hex */ +.highlight .mi { color: #009999 } /* Literal.Number.Integer */ +.highlight .mo { color: #009999 } /* Literal.Number.Oct */ +.highlight .sb { color: #d14 } /* Literal.String.Backtick */ +.highlight .sc { color: #d14 } /* Literal.String.Char */ +.highlight .sd { color: #d14 } /* Literal.String.Doc */ +.highlight .s2 { color: #d14 } /* Literal.String.Double */ +.highlight .se { color: #d14 } /* Literal.String.Escape */ +.highlight .sh { color: #d14 } /* Literal.String.Heredoc */ +.highlight .si { color: #d14 } /* Literal.String.Interpol */ +.highlight .sx { color: #d14 } /* Literal.String.Other */ +.highlight .sr { color: #009926 } /* Literal.String.Regex */ +.highlight .s1 { color: #d14 } /* Literal.String.Single */ +.highlight .ss { color: #990073 } /* Literal.String.Symbol */ +.highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */ +.highlight .vc { color: #008080 } /* Name.Variable.Class */ +.highlight .vg { color: #008080 } /* Name.Variable.Global */ +.highlight .vi { color: #008080 } /* Name.Variable.Instance */ +.highlight .il { color: #009999 } /* Literal.Number.Integer.Long */ diff --git a/categories.html b/categories.html new file mode 100644 index 0000000000..529a34532a --- /dev/null +++ b/categories.html @@ -0,0 +1,21 @@ +--- +layout: page +title: Categories +header: Posts By Category +group: example-page +--- + +
        + {% assign categories_list = site.categories %} + {% include helpers/categories_list.html %} +
      + + +{% for category in site.categories %} +

      {{ category[0] | join: "/" }}

      +
        + {% assign pages_list = category[1] %} + {% include helpers/pages_list.html %} +
      +{% endfor %} + diff --git a/index.md b/index.md new file mode 100644 index 0000000000..14f94fe8fc --- /dev/null +++ b/index.md @@ -0,0 +1,45 @@ +--- +layout: page +title: Hello from Jekyll-Bootstrap-Core +header: This is Jekyll-Bootstrap +--- + +Read [Jekyll Quick Start](http://jekyllbootstrap.com/jekyll-quick-start.html) + +Complete usage and documentation available at: [Jekyll Bootstrap](http://jekyllboostrap.com) + +## Update Author Attributes + +In `_config.yml` remember to specify your own data: + + title : My Blog =) + + author : + name : Name Lastname + email : blah@email.test + github : username + twitter : username + +The theme should reference these variables whenever needed. + +## Sample Posts + +This blog contains sample posts which help stage pages and blog data. +When you don't need the samples anymore just delete the `_posts/core-samples` folder. + + $ rm -rf _posts/core-samples + +Here's a sample "posts list". + +
        + {% for post in site.posts %} +
      • {{ post.date | date_to_string }} » {{ post.title }}
      • + {% endfor %} +
      + +## To-Do + +This theme is still unfinished. If you'd like to be added as a contributor, [please fork](http://github.com/plusjade/jekyll-bootstrap)! +We need to clean up the themes, make theme usage guides with theme-specific markup examples. + + diff --git a/pages.html b/pages.html new file mode 100644 index 0000000000..91c6c963a5 --- /dev/null +++ b/pages.html @@ -0,0 +1,21 @@ +--- +layout: page +title: Pages +header: Pages +group: example-page +--- + +

      All Pages

      +{% assign pages_list = site.pages %} +{% include helpers/pages_list.html %} + + +

      Pages in group: project

      +{% assign pages_list = site.pages %} +{% assign group = 'project' %} +{% include helpers/pages_list.html %} + +

      Pages in group: example-page

      +{% assign pages_list = site.pages %} +{% assign group = 'example-page' %} +{% include helpers/pages_list.html %} diff --git a/sitemap.txt b/sitemap.txt new file mode 100644 index 0000000000..59367c5331 --- /dev/null +++ b/sitemap.txt @@ -0,0 +1,7 @@ +--- +# Remember to set production_url in your _config.yml file! +--- +{% for page in site.pages %} +{{site.production_url}}{{ page.url }}{% endfor %} +{% for post in site.posts %} +{{site.production_url}}{{ post.url }}{% endfor %} \ No newline at end of file diff --git a/tags.html b/tags.html new file mode 100644 index 0000000000..fa36a9c3d7 --- /dev/null +++ b/tags.html @@ -0,0 +1,20 @@ +--- +layout: page +title: Tags +header: Posts By Tag +group: example-page +--- + +
        + {% assign tags_list = site.tags %} + {% include helpers/tags_list.html %} +
      + + +{% for tag in site.tags %} +

      {{ tag[0] }}

      +
        + {% assign pages_list = tag[1] %} + {% include helpers/pages_list.html %} +
      +{% endfor %}