Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/kirbyt/timeline-jekyll-theme

A multipurpose, single page Jekyll theme.
https://github.com/kirbyt/timeline-jekyll-theme

Last synced: 3 months ago
JSON representation

A multipurpose, single page Jekyll theme.

Host: GitHub
URL: https://github.com/kirbyt/timeline-jekyll-theme
Owner: kirbyt
License: apache-2.0
Created: 2015-01-20T03:27:40.000Z (over 9 years ago)
Default Branch: master
Last Pushed: 2020-05-07T20:03:38.000Z (about 4 years ago)
Last Synced: 2024-01-17T11:44:04.391Z (5 months ago)
Language: CSS
Size: 1.26 MB
Stars: 97
Watchers: 3
Forks: 65
Open Issues: 1
Metadata Files:
- Readme: readme.markdown
- License: LICENSE

Lists

awesome-starred - kirbyt/timeline-jekyll-theme - A multipurpose, single page Jekyll theme. (others)
awesome-stars - timeline-jekyll-theme
project-awesome - kirbyt/timeline-jekyll-theme - A multipurpose, single page Jekyll theme. (CSS)

README

# Timeline Jekyll Theme

Timeline is multipurpose, single page Jekyll theme that includes a timeline section.

**Example sites**:

- [Demo site](http://kirbyt.github.io/timeline-jekyll-theme)
- [kirbyturner.com](http://www.kirbyturner.com)

This theme is a mashup of two other themes:

- [Grayscale by Start Bootstrap](https://github.com/IronSummitMedia/startbootstrap-grayscale)
- [Agency Jekyll Theme](https://github.com/y7kim/agency-jekyll-theme)

Big thanks to the creators of Grayscale and Agency. This theme would not be possible without their hard work.

## How to Use

Timeline works in a similar fashion as a Jekyll blog site with two differences:

1. Pages are displayed as sections within the single HTML web page.
2. Posts are displayed as timeline entries.

### Creating a Section

To add a section, create a new *.html* file such as *about.html*. This will add the section to the navigation menu and display the section as part of the single page HTML. The file should include the following YAML front matter:

- **layout** It's value should always be `null`.
- **title** This is the text displayed in the navigation menu.
- **section-type** This identifies the section type, or layout for the section. The possible values are:
+ `default`
+ `contact`
+ `timeline`

Use the **section-type** `default` when you want to display the content in a regular section.

Use the **section-type** `contact` to display a contact section. A contact section can optionally contain an email address and a list of social networks that are display below the content. See *contact.html* for an example of setting the email address and social networks.

Use the **section-type** `timeline` to display a timeline of entries.

## More About Timelines

A timeline is a list of post sorted by date. To create a new timeline entry, add a new post to the *_posts* directory. The post should have the following YAML front matter properties:

- **layout** It's value should always be `null`.
- **title** This is the header text for the career entry.
- **subtitle** (Optional) This is the sub-header text for the career entry.
- **image** (Optional) This is a reference to the thumbnail image displayed with the career entry. If blank or not present, then `site.career-img` defined in the *_config.yml* is used.

Example timeline post front matter:

```
---
layout: null
title: 2014
subtitle:
image: "img/timeline/2014.png"
---
```

# License

Code released under the [Apache 2.0][license] license.

**Portions copyrighted by**

[license]: https://github.com/kirbyt/timeline-jekyll-theme/blob/master/LICENSE