Score: Paper Ball 3 - Jekyll Default 1
MISSION: Create a Central Profile Blog Using GitHub Pages
I had a great idea - use GitHub Pages as my central blog for projects and interest. Sounds simple enough, right? Well it is simple if you keep focus on the project priority, start with the basics and explore your options later.
Well, after several hours I found myself exploring Jekyll, themes for Jekyll and the GitHub Layout themes.
This is where I went off track: I wanted to combine the best parts of all my options and found myself drifting away from the mission. I had to “paper ball” my efforts 3 times before accepting the fact that I had gone off target and needed to get back to the original goal.
Paper Ball 1: GitHub Page Layout
Creating a GitHub page is an easy implementation, just create a new repo with the name [your GitHubID].github.io.
GitHub provides a nice theme tool to get your GitHub page up and running. Go to Settings -> GitHub Pages -> Automatic Page Generator and you’ll find find several layouts to choose from. I had already installed Jekyll locally and found the default style of Jekyll pretty plain so the MERLOT layout look like a nice style for my project.
Conflict: Looking at the MERLOT layout, I didn’t see the same structure as the default Jekyll layout. A lot of the default structure didn’t seem to be in the MERLOT layout.
So I decided to use the MERLOT style on the Jekyll default configuration. (See “Comparison Between MERLOT and Jekyll Default” below)
Well it turns out the MERLOT Layout is pretty structured and then I would have to redo the mobile style.
[Paperball!]
Paper Ball 2: Jekyll Theme 1
Ah! There are themes for Jekyll! Nice… Let’s go shopping.
One of the first results from searching jekyll themes is Jekyll Themes…
I found a nice looking theme that focused on displaying a portfolio of work for an artist or developer.
The portfolio grid was nice, and I would use it someday but for now I wanted to just hide it and use a basic blog approach.
Problem: The portfolio grid is fed by the _posts listings. So, if I comment-out the portfolio grid, I have no _post ability. Well after a couple hours I realized that I would need to do too much re-engineering to make this work for my needs.
[Paperball!]
Paper Ball 3: Jekyll Theme 2
Ok, back to Jekyll Themes to see if I can find a tighter fit to a simple blog with some style.
Found one.. It’s a very nice them and focused on technical blogging. I dive in and start customizing it with my data and find; it’s going to take me another couple hours to get it to a baseline setup before beginning to add any content.
This would be a great solution for a client re-design but not for my immediate need.
[Paperball!]
I was running out of project time.
I needed to get my blog up and running!
I am now back to the basics - the Jekyll default theme.
You win for now Jekyll default style, but I’m coming back and when I do…
I’m going to create my own theme!!
Comparison Between MERLOT and Jekyll Default:
index.MERLOT: <meta http-equiv="X-UA-Compatible" content="chrome=1">
head.JEKYLL: <meta http-equiv="X-UA-Compatible" content="IE=edge">
index.MERLOT: <meta name="viewport" content="width=640">
head.JEKYLL: <meta name="viewport" content="width=device-width">
index.MERLOT: n/a
head.JEKYLL: <meta name="description" content="Struggling between breadth and depth of knowledge, this site is devoted to exploring a balance of both deep and wide topics of web development.
">
index.MERLOT: <link rel="stylesheet" href="stylesheets/core.css" media="screen">
<link rel="stylesheet" href="stylesheets/mobile.css" media="handheld, only screen and (max-device-width:640px)">
<link rel="stylesheet" href="stylesheets/pygment_trac.css">
head.JEKYLL: <link rel="stylesheet" href="/css/main.css">
index.MERLOT: <script type="text/javascript" src="javascripts/modernizr.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="javascripts/headsmart.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#main_content').headsmart()
})
</script>
head.JEKYLL: n/a
index.MERLOT: n/a
head.JEKYLL: <link rel="canonical" href="http://allenmay.github.io/blog/2014/09/08/paperball-3-jekyll-defaul-1.html">
index.MERLOT: <title>Allen May's GitHub Page by AllenMay</title>
head.JEKYLL: <title>Score: Paper Ball 3 - Jekyll Default 1</title>
index.MERLOT: <body>
default.JEKYLL: <body>
List of resources used for this project: