jekylldark

jekylldark is a Jekyll theme with a dark color scheme. It features a responsive layout with customizable navbar, sidebar, content area, and footer using HTML, Markdown, and Liquid. It is important to note that while there is templating for all of these site areas, it is not necesary to use them all. By leaving out a config file, it is possible to eliminate an element from the site. Please see the README for information about how to apply the theme to your Jekyll site.

In order for the site to work properlly, it will be necessary to create a few files and folders. To start, make sure that your _config.yml file has the title and the url of your site. Then, you will want to add a title-description. This is the desciption that will appear under the title of the site in the sidebar. You can additionally add a full-desciption that will appear in the footer of the site where there is more room. The > means to ignore line breaks until the next item. It is important to note where -'s are used as these matter when creating lists.

Next, create a folder in the root of the site called _data. This is where we will create the files, footer.yml, navigation.yml, and sidebar.yml. Here is what the files that populate this site look like.

By using some key words in each of these files, specifically styled content areas are created. In the footer, adding header: Title will add the title and the full description of the site and adding header: Connect will create an area for social links and icons. The icons come from Font Awesome and are retrieved from their CDN by adding image: NAMEOFICON. In almost all cases the name of the icon is an all lowercase, no spaces version of the name of the site so there should be no need to look it up.

The navbar can be filled out with main navigation locations and with dropdown lists. The way that this is done can be seen in the above gist.

The sidebar of the site has special areas for projects and posts. These are created with header: Featured Projects and header: posts.

Information on creating posts can be found on the posts page and examples of the different styled elements can be found on the examples page.