barryclark / jekyll-now

Build a Jekyll blog in minutes, without touching the command line.

March, 2016: If you're on an old version of Jekyll Now and run into a) build warnings or b) syntax highlighting issues caused by Jekyll 3 and GitHub Pages updates, just ✨update your _config.yml✨ and you'll be set!

Jekyll Now

Jekyll is a static site generator that's perfect for GitHub hosted blogs (Jekyll Repository)

Jekyll Now makes it easier to create your Jekyll blog, by eliminating a lot of the up front setup.

• You don't need to touch the command line
• You don't need to install/configure ruby, rvm/rbenv, ruby gems ☺️
• You don't need to install runtime dependencies like markdown processors, Pygments, etc
• If you're on Windows, this will make setting up Jekyll a lot easier
• It's easy to try out, you can just delete your forked repository if you don't like it

In a few minutes you'll be set up with a minimal, responsive blog like the one below giving you more time to spend on writing epic blog posts!

Quick Start

Step 1) Fork Jekyll Now to your User Repository

Fork this repo, then rename the repository to yourgithubusername.github.io.

Your Jekyll blog will often be viewable immediately at https://yourgithubusername.github.io (if it's not, you can often force it to build by completing step 2)

Step 2) Customize and view your site

Enter your site name, description, avatar and many other options by editing the _config.yml file. You can easily turn on Google Analytics tracking, Disqus commenting and social icons here too.

Making a change to _config.yml (or any file in your repository) will force GitHub Pages to rebuild your site with jekyll. Your rebuilt site will be viewable a few seconds later at https://yourgithubusername.github.io - if not, give it ten minutes as GitHub suggests and it'll appear soon

There are 3 different ways that you can make changes to your blog's files:

1. Edit files within your new username.github.io repository in the browser at GitHub.com (shown below).
2. Use a third party GitHub content editor, like Prose by Development Seed. It's optimized for use with Jekyll making markdown editing, writing drafts, and uploading images really easy.
3. Clone down your repository and make updates locally, then push them to your GitHub repository.

Step 3) Publish your first blog post

Edit /_posts/2014-3-3-Hello-World.md to publish your first blog post. This Markdown Cheatsheet might come in handy.

You can add additional posts in the browser on GitHub.com too! Just hit the + icon in /_posts/ to create new content. Just make sure to include the front-matter block at the top of each new blog post and make sure the post's filename is in this format: year-month-day-title.md

Local Development

1. Install Jekyll and plug-ins in one fell swoop. gem install github-pages This mirrors the plug-ins used by GitHub Pages on your local machine including Jekyll, Sass, etc.
2. Clone down your fork git clone https://github.com/yourusername/yourusername.github.io.git
3. Serve the site and watch for markup/sass changes jekyll serve
4. View your website at http://127.0.0.1:4000/
5. Commit any changes and push everything to the master branch of your GitHub user repository. GitHub Pages will then rebuild and serve your website.

Moar!

I've created a more detailed walkthrough, Build A Blog With Jekyll And GitHub Pages over at the Smashing Magazine website. Check it out if you'd like a more detailed walkthrough and some background on Jekyll. 🤘

It covers:

• A more detailed walkthrough of setting up your Jekyll blog
• Common issues that you might encounter while using Jekyll
• Importing from Wordpress, using your own domain name, and blogging in your favorite editor
• Theming in Jekyll, with Liquid templating examples
• A quick look at Jekyll 2.0’s new features, including Sass/Coffeescript support and Collections

Jekyll Now Features

✓ Command-line free fork-first workflow, using GitHub.com to create, customize and post to your blog
✓ Fully responsive and mobile optimized base theme (Theme Demo)
✓ Sass/Coffeescript support using Jekyll 2.0
✓ Free hosting on your GitHub Pages user site
✓ Markdown blogging
✓ Syntax highlighting
✓ Disqus commenting
✓ Google Analytics integration
✓ SVG social icons for your footer
✓ 3 http requests, including your avatar

✘ No installing dependencies ✘ No need to set up local development
✘ No configuring plugins
✘ No need to spend time on theming
✘ More time to code other things ... wait ✓!

Questions?

Open an Issue and let's chat!

Other forkable themes

You can use the Quick Start workflow with other themes that are set up to be forked too! Here are some of my favorites:

• Hyde by MDO
• Lanyon by MDO
• mojombo.github.io by Tom Preston-Werner
• Left by Zach Holman
• Minimal Mistakes by Michael Rose
• Skinny Bones by Michael Rose

Credits

• Jekyll - Thanks to its creators, contributors and maintainers.
• SVG icons - Thanks, Neil Orange Peel. They're beautiful.
• Solarized Light Pygments - Thanks, Edward.
• Joel Glovier - Great Jekyll articles. I used Joel's feed.xml in this repository.
• David Furnes, Jon Uy, Luke Patton - Thanks for the design/code reviews.
• Bart Kiers, Florian Simon, Henry Stanley, Hun Jae Lee, Javier Cejudo, Peter Etelej, Ben Abbott, Ray Nicholus, Erin Grand, Léo Colombaro, Dean Attali, Clayton Errington, Colton Fitzgerald, Trace Mayer - Thanks for your fantastic contributions to the project!

Contributing

Issues and Pull Requests are greatly appreciated. If you've never contributed to an open source project before I'm more than happy to walk you through how to create a pull request.

You can start by opening an issue describing the problem that you're looking to resolve and we'll go from there.

I want to keep Jekyll Now as minimal as possible. Every line of code should be one that's useful to 90% of the people using it. Please bear that in mind when submitting feature requests. If it's not something that most people will use, it probably won't get merged. 💂‍♂️

jekyll-now's Issues

Add feedburner support

Perhaps something like what was done in Jekyll Bootstrap astropanic/jekyll-bootstrap@3f88703

truncatewords is unsafe

Hi,
thanks for this easy starting point with jekyll!

I just want to make you aware that this line in index.html is unsafe:
{{ post.content | truncatewords:40}}
Depending of what you have in your post, you might be in the middle of markup. I am not entirely sure why, but in our page it resulted in strange <em> tags appearing. I switched it now to use the
{{ post.excerpt }}
tag with a custom excerpt separator and that works better.

Best,
Anna

Add text at the footer?

Hey! I'd like to add text (Copyright text, etc.) to the bottom of my jekyll-now site. Any way I can do this? What file should I edit?

Could you kindly please find the svg version of this icon please?

Add google analytics anonymizeIp option

Hi,

thanks for this great repository! i love it <3
Maybe it is a good suggestion to add a google analytics anonymizeip variable in the _config file.

ga('set', 'anonymizeIp', true);

And then use it like that

ga('create', '{{ site.google_analytics }}', 'auto');
{% if site.google_analytics_anonymizeip %}
ga('set', 'anonymizeIp', true);
{% endif %}
ga('send', 'pageview');

or is there a better way to handle that?

Best,
Stefan

Hello, if I wanted to have a sort function how to do?

Hello, if I wanted to have a sort function how to do?

CSS not working

I'm totaly new to Jekyll. I followed the instructions on the README.md. I managed to adjust my settings but I can't get the css to load properly. What setting should I adjust?

The fork is not working...

Hello! I have followed the instruction and done the fork. However, it does not create a fork but redirects me to another fork that I did (from a project that was in turn forked by jekyll-now). Do you know why I am having this issue?
Thanks,
Martina

cannot render disqus

I have add my disqus auto-generate script into disqus.html and saved it. But I cannot see the DISQUS in my post page.Why?

Page tab icon

Is there any way to add an icon to the browser tab?

Changes to page aren't showing up

Hi Barry,
I've followed your instructions on Smashing Magazine (and here) to the letter, but I seem to be stuck. When I edit the Hello-World.md file, give it a new name, and commit it to my repository, I can see the file in the repository. But when I go to skeskali.github.io, I still see the default setup page you get when I first forked Jekyll. However, when you mouse over links, you can see my URL in the status bar.

What am I doing wrong? I've checked my config file over and over again, but I don't see anything wrong.

Smashing Mag link in README is a 404

Using the site search I couldn't find the article (or at least it wasn't obvious from any of the results for "barry clark" or "jekyll now".

archive page

What about adding an archive page? I think that is essential for a blog. Thanks for your work!

How to do SEO for jekyll-now based blog?

Hi, I made a blog based on jekyll-now and thank you for your great work! but the problem is I cannot find my blog in the first 5 page when searching in Google, which I think there might be some problem here. I am not very familiar with SEO, but how to do that for jekyll-now based blog?

Youtube link

I'd like to include a link to my youtube in my footer. I've changed the default page to include the link, and the _config file to keep track of the URL, but I don't know how to get the icon to work. I have the image I want (attached) but need to figure out how to get it into the right format for the _svg-icons.scss file. Any sugggestions?

Disqus threads for http and https sites separate

Is there a way to have the https site forward to the http site? I've just noticed that if people comment on a post reached using the http address and others do the same using the https address, the threads only show up on one or the other, as if there were two different sites.

Example: this post http://bewuethr.github.io/installing-fltk-133-under-visual-studio/ and the same under https, https://bewuethr.github.io/installing-fltk-133-under-visual-studio/, has two different comment threads.

Permalinks not working in local environment

Sorry, I am new to Jekyll and so this may be something trivial.

Everything is working fine with my remote repository hosted on my github account. However, when I run jekyll serve --watch locally, and then navigate to http://0.0.0.0:4000/about in the browser I get the 404 page.

If I type in http://0.0.0.0:4000/about.html, the page loads fine. Something seems to be going wrong with the routing in my local environment but I cannot figure out what it is. Any ideas?

I'm running:
jekyll 2.2.0
ruby 2.1.2p95
ubuntu 12.04

Using gh-pages branch in a non-user repo

Is there someway to use a regular repo (i.e. not one named username.github.io) via its gh-pages branch? Like if I forked jekyll-now and renamed the default branch to gh-pages, and then created a new default branch to do other (non-web) stuff? Would this work?

favicon.ico

Page Build Failure

I wasn't able to troubleshoot, due to Jekyll issues on my Ubuntu 14.10 install.

The error email from GitHub is as follows:

The page build failed with the following error:

The file style.scss contains syntax errors. For more information, see >https://help.github.com/articles/page-build-failed-markdown-errors.

syntax Error in Github

Hi,
Github recognized style.scss Syntax error so when you forked , your github page doesn't active until some change in style.scss file.
what's your comment about that?

Bests

Trying to fix the About page to utilize my content instead of the default

For whatever reason the about page content doesn't change. I took the _site folder off of my git ignore, but its still not updating the Git hub page.

Disabling image optimizations?

I've narrowed this problem down to Jekyll at least.

On my site I have a javascript zoom box that lets someone zoom in on an image.
See https://questionablecode.org/apk_extractor_3.0/#lessons-learned

However you can see once you zoom in one or two steps its very blurry. Here is the exact same example on Github pages without using Jekyll.
https://benjholla.github.io/testzoom/zoom_demo/example.html

For a brief time I thought CloudFlare was reponsible, so I forked my entire Jekyll site to another user repo and the images were still blurry.

As a shot in the dark I took a look at the Jekyll asset pipeline (https://github.com/matthodan/jekyll-asset-pipeline#asset-compression) and disabled any compression features in my _config.yml file that I saw.

Any ideas? This is driving me crazy...and I'm getting desperate. It has something to do with Jekyll I'm pretty sure. My site code is here https://github.com/questionablecode/questionablecode.github.io

site.baseurl problems

I'm having issues with the {{ site.baseurl }} tag. It's for my main user page with a custom domain so I set the config variable to nothing, just the default "" and updated my CNAME file and website serves fine. However on a post page, the title link ( href="{{ site.baseurl }}") doesn't work it comes up as empty when viewing the source code. However, links using href="{{ site.baseurl }}{{ post.url }}" get done correct as /page-name/ and work fine.

Am I missing something somewhere?

Emoji is not working

Emoji is not working. I don't know what's wrong. I forked this repository and only change CNAME and _config.yml

thanks.

my site: rudi.prihandoko.id
source: https://github.com/prihandoko/prihandoko.github.io

Styling feed.xml

Several browsers (like Chrome don't have a default proper feed reader) hence feed content appear as in the xml file. Like so:

I've updated a XSL document for my feed.xml given it the following styling:
available at etelej.github.io/feed.xml

I wanted to send a pull request, but I have my .xsl document in a /assets/ folder, but wasn't sure where to put the file. Does jekyll-now have a folder for resource files?

Setting excerpt_separator Fails to Function

First of all - thanks for this project, it's really powerful.

Question for you - in my config.yml I'm setting excerpt_separator: "/n/n"

However this doesn't appear to do anything. Is there a way to easily update the excerpt_separator configuration variable?

hoverZoomLink class appended to images

Hey Barry,

I forked this repo to build my site, and I noticed there is a class appended called "hoverZoomLink". I have not been able to find where the class is in any of the assets. When I hover on an image, it shows a really large image that is quite annoying. Are you familiar with this?

Build failed because "style.scss" contains syntax errors

Github send me a e-mail to report this error.But why,I never modify this file.

preview draft posts on github ?

Hi Barry, Thanks for your very helpful work which I've used to set up a code centric blog.

I particularly liked not having to install jekyll etc. locally.

I've just realised that I can't think of a way to preview what a draft posts will look like without publishing it for everyone to see. My principal concern is that I don't want posts to be published by a particular feed aggregator until I've finished them. Any suggestions ?

Thanks,
Andy

Rss

The RSS feed link is not shown in the HTML, making it harder for people to subscribe to a person's blog. I've fixed it in my branch but unfortunately, the way I fixed prevents me sending a proper pull request, fortunately I can make a patch file!

diff --git a/_layouts/default.html b/_layouts/default.html
index 0c0f822..3d92552 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -10,7 +10,7 @@

     <meta name="author" content="{{ site.name }}" />
     <meta name="description" content="{{ site.description }}">
-
+    <link type="application/atom+xml" title="{{ site.name }} - {{ site.description }}" href="{{ site.baseurl }}/feed.xml" rel="alternate"/>
     <!--[if lt IE 9]>
       <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
     <![endif]-->

"Or you can use your GitHub profile pic"

I saw this mentioned in the configuration file. Could you clarify how one uses his GitHub profile pic?

Disqus does not work after adding 'disqus' shortname in _config.yml

Hi!

I added my registered Disqus shortname to _config.yml. Unfortunately Disqus does not work on my webpage: http://krris.github.io/Hello-World/
Do I have any ideas what I am doing wrong? Code you can see here: https://github.com/krris/krris.github.io

Thanks for help!

can not pagination

I want set "paginate: 5" , but isn't working
you can see http://tennc.github.io/
my config.yml
index.html

pagination i set like here

can you help me?

how to make code highlights by adding a code block like ?

I use '''

somecode 

and

some xml'codes

but it not works

Add G+ Icons

Hi, having G+ included in the option for social network would be great.

I don't know from where you get the icons, because in case you can provide a link and I can add by myseld

Build failed because "style.scss" contains syntax errors

I tried deleting the repo and reforking like suggested in a previous issue but it did not work. What else can I do?

ERROR:
The page build failed with the following error:
The file style.scss contains syntax errors. For more information, see https://help.github.com/articles/page-build-failed-markdown-errors.

Preview cuts off in middle of code block and renders rest of front page in code font

The front page shows the first six or so lines of each post and then the "READ MORE" link. However, if the last line displayed before that is in the middle of a code block, the rest of the front page gets rendered in the corresponding font:

Blog in User sub-repository

Hello,

If you're hosting your site at a Project repository on GitHub pages
(http://yourusername.github.io/repository-name)
and NOT your User repository (http://yourusername.github.io)
then add in the baseurl here, like this: "/repository-name"

Do you plan to enable this feature ( to host blog in User sub repository ) in the feature?
It would be very convenient for those users who host their personal web pages on GitHub.

Thank you

Github page build failure

Hello!
Firstly, thank you so much for your work on this repo, I'm immensely enjoying using it. Recently I have begun to notice some page build failures, a few of them I've managed to circumvent but this one is really giving me problems.

So the below code is the offender:

{% highlight ruby linenos %}
require 'capybara/rspec'
require 'airport'

feature 'Grand Finale' do

airport = Airport.new
planes = []
6.times { planes << Plane.new }
p = Plane.new

scenario '6 planes can be created' do
expect(planes.length).to eq 6
end

scenario 'airport knows planes are in the air' do
planes.each do |plane|
expect(plane.location).to eq('air')
end
end

scenario '6 planes can land at specified airport' do
Airport.any_instance.stub(:weather_good).and_return(true)
planes.each { |plane| plane.request_land airport }
expect(airport.landed_planes.length).to eq 6
end

scenario 'airport knows planes are in the airport' do
planes.each do |plane|
expect(plane.location).to eq('airport')
end
end

scenario 'plane is denied landing permission when airport is full' do
Airport.any_instance.stub(:weather_good).and_return(true)
expect { (p.request_land airport) }.to raise_error 'permission denied'
end

scenario '6 landed planes have status: landed' do
airport.landed_planes.each do |plane|
expect(plane.status).to eq 'landed'
end
end

scenario 'after all 6 planes takeoff there are no more landed planes' do
Airport.any_instance.stub(:weather_good).and_return(true)
planes.each do |plane|
airport.order_plane_takeoff plane
end
expect(airport.landed_planes.length).to eq 0
end

scenario 'after all 6 planes takeoff their status is 'flying'' do
planes.each do |plane|
expect(plane.status).to eq 'flying'
end
end
end
{% endhighlight %}

---

And this is the error email I get from Git:

The page build failed with the following error:

The tag highlight in _posts/2015-03-22-Week was not properly closed with {% endhighlight %}. For more information, see https://help.github.com/articles/page-build-failed-tag-not-properly-closed.

If you have any questions you can contact us by replying to this email.

Get posts to display in time order?

Hi, this might already be something I'm not doing right but how do I go about getting posts to display in time order? As currently they are going top-bottom/oldest-newest.

It isn't working

I tried quick start guide but it isn't working. The page at http://username.github.io says there's no page at that url. How can I solve it. HELP!

Page build error.

Hello there! I just forked and copied it to my io repo and it returned a build error without specific reason, anyone got it too?

My Photo

Steps for adding new icon in footer

I want to add a new icon in footer and link it to a page. Could you please explain the steps.

mailto code fix in `/_includes/svg-icons.html`

In /_includes/svg-icons.html there is a space between mailto: and the code snippet for the email address, in line 2. I suggest deleting that space, so it is:

--BEFORE
{% if site.footer-links.email %}{% include svg-icons/email.html %}{% endif %}

--FIX
{% if site.footer-links.email %}{% include svg-icons/email.html %}{% endif %}

On Chrome it somehow did not load up the mailto: link properly.

Cheers!
Hun Jae

Getting project pages to work with main jekyll-now site

Hi, I just followed the instructions on jekyll-now to launch my username.github.io site at:
openpencil.github.io Thanks for making it so simple.

I am now trying to build a project page for one of my project repos at:
https://github.com/openpencil/bayesianmice so that it would show up at:
http://openpencil.github.io/bayesianmice/index.html
Unfortunately, I am not having much luck with this. The result is a 404 page.

The repository is pretty simple as in it has a gh_pages branch, a _config.yml file and an index.html
I am wondering if you perhaps point me to where I am going wrong here.

Thanks for your time!

Google Translate Bubble is broken

You can see it here: https://translate.google.com/translate?sl=en&tl=es&u=jekyllnow.com

Probably, it's the CSS Reset causing this transparent background of the bubble.
I should investigate more.

[Question] Does not present lists on the final output

According to the Markdown language, lists such as below should be represented in a list format:

• A bulletted list
• alternative syntax 1
• alternative syntax 2
  • an indented list item

1. An
2. ordered
3. list

However when using the above format, jekyll blog does not show the list representation. Instead it shows continuous text.

Responsibilities * Intrusion detection - Analyze network and host based security events from our corporate and production environments * Perform initial triage, identify when an event has become an incident, escalate and continuously monitor for further activity * Analyze logs, write new rules, and improve upon existing detection rules (host and network) * 

Edit with highlight on the syntax used @etelej :

Review:
1. Less focus on formal education (Degree, Masters) or specific certification.
2. Basic knowledge on networking and OSes is a must.
3. Celebrate cross discipline learning and collaboration.

Responsibilities
* Intrusion detection - Analyze network and host based security events from our corporate and production environments
* Perform initial triage, identify when an event has become an incident, escalate and continuously monitor for further activity
* Analyze logs, write new rules, and improve upon existing detection rules (host and network)

Can't use syntax highlighting

I can't seem to get Jekyll to parse code sections and mark them up for the solarized theme. I'm marking the code up as below.

while (have_posts()) : the_post();