website

website

A Jekyll website template based on Material ocean and Forty theme by HTML5UP

FortyPlus - Jekyll Theme

A modified version of the Jekyll theme by HTML5 UP. This is my personal fork which adds many important features and makes the theme highly modular and user customizable.

Forty Theme

Added Features

  • very easy setup - fork the template and start posting
  • beautiful material ocean color pallette
  • Jekyll Admin integration for easier use
  • highly modularize the theme - most of the widgets and features are user togglable
  • proper URl's for posts and projects
  • remove the annoying date on post URL's
  • better project structure - group all pages under the pages folder
  • separation between projects and posts
  • skills widget - add your skills under the skills key value pair in config.yml
  • tiles for both posts and projects - you can toggle them in _config.yml
  • go to top button
  • separate page for each post and project
  • next and previous post navigation buttons
  • read time for posts and projects
  • minimal syntax highlighting via prism
  • site wide search via lunr
  • disqus comments integration for posts - add your disqus forum name in config.yml
  • fork repository button on projects
  • better font awesome integration via fontawesome kit
  • fix font awesome issues on mobile devices
  • social media shearing icons for both projects and posts
  • RSS feed support
  • SEO optimizations
  • Sitemap for better SEO
  • asciinema integration
  • YouTube integration
  • automatically open external URL's in new tab
  • separate contact page - add your details in _config.yml
  • Formspree.io contact form integration - just add your email to the _config.yml and it works!
  • Add your social profiles easily in _config.yml. Only social profiles buttons you enter in config.yml show up on the site footer, you can easily add your own social media's if they're not included by default

Using Included Templates

YouTube

Used to link to a YouTube video

{% include youtube.liquid id="video_id" -%}

Asciinema

Used to link to an asciinema video

{% include asciinema.liquid id="video_id" -%}

Project Structure

.
├── assets
│   ├── css
│   ├── fonts
│   ├── images
│   └── js
├── _includes
├── _layouts
├── _pages
├── _posts
├── _sass
│   ├── base
│   ├── components
│   ├── layout
│   └── libs
└── tag

How to Use

For those unfamiliar with how Jekyll works, check out jekyllrb.com for all the details, or read up on just the basics of front matter, writing posts, and creating pages.

  • Fork this repository
  • run bundle install in the repo folder
  • run jekyll serve
  • go to http://localhost:4000/admin and start blogging!

Credits

Original README from HTML5 UP:

Forty by HTML5 UP html5up.net | @ajlkn Free for personal and commercial use
under the CCA 3.0 license (html5up.net/license)

This is Forty, my latest and greatest addition to HTML5 UP and, per its
incredibly creative name, my 40th (woohoo)! It's built around a grid of "image
tiles" that are set up to smoothly transition to secondary landing pages (for
which a separate page template is provided), and includes a number of neat
effects (check out the menu!), extra features, and all the usual stuff you'd
expect. Hope you dig it!

Demo images\* courtesy of Unsplash, a radtastic collection of CC0 (public
domain) images you can use for pretty much whatever.

(\* = not included)

AJ [email protected] | @ajlkn

Credits:

Demo Images: Unsplash (unsplash.com)

Icons: Font Awesome (fontawesome.github.com/Font-Awesome)

Other: jQuery (jquery.com) html5shiv.js (@afarkas @jdalton @jon_neal @rem)
background-size polyfill (github.com/louisremi) Misc. Sass functions
(@HugoGiraudel) Respond.js (j.mp/respondjs) Skel (skel.io)

Repository Jekyll logo icon licensed under a Creative Commons Attribution 4.0 International License.