This post describes how you get from here to your own complete site. You don’t need any advance knowledge.

If you have any questions during configuration, feel free to send an email.

  1. You’ll need a free Github account for your organization, if you don’t have one already. If you’re not familiar with Github, here’s a list of governments using it.

  2. Head over to JekyllOrg and click fork. The name of your fork should exactly match your account name.

  3. You can now use your Github account to set up your site and login to Prose.io, where you can add news articles on a regular basis.

Images

For each of the sections - Issues, Services, Events, Resources, About and on the homepage, you’ll probably want your own images.

The large images are 1800px x 1200px and the small images are 480px x 480px. If you use the same file names, your images will appear automatically.

These images all belong in the /images/featured folder.

You’ll also need a small image for each of your team / staff members of 180px x 180px. These belong in the /images/team folder.

Site configuration

The config.yml file contains the key details you won’t need to update often. The first section you’ll see is this:

title: JekyllOrg
description: a free Jekyll theme for organizations and non-profits
baseurl: "/JekyllOrg" # the subpath of your site, e.g. /blog
url: "https://damianeoloan.github.io" # the base hostname & protocol for your site

  1. Under title, add your organization name.

  2. Under description, add your slogan or a short description, which will appear on your homepage.

  3. Remove line 12 beginning baseurl, or simply remove /JekyllOrg.

  4. On line 13, replace damianeoloan with your account name.

Next you’ll see the social profiles, like this:

facebook_username: damianeoloan
github_username: damianeoloan
linkedin_username: damianeoloan
# ...
email: damianoloan0@gmail.com

  1. Delete the ones you don’t want.

  2. Replace ‘damianeoloan’ with your account name for each of the social platforms.

The email address you use here is used for the contact form. When your site is ready, you should try it out on the About page.

These will appear in the footer at the bottom of each page. That’s all for configuration!

Team members

If you open the data folder, you’ll see a file called team-members.yml. Each team / staff member takes five details:

- name:  Erin Herrmann
  role: CEO
  img: http://placehold.it/120x120
  description: "Erin is a JekyllOrg co-founder and has been CEO for eight years."
  email: erin@jekyllorg.com

For each person, replace the image link with ‘/images/featured/yourfilename.jpg’, and replace the other relevant details.

Now you’ll all appear ☺ on the About page.

Locations

Your office locations also live in the data folder, under locations.yml. For each one, you’ll see this:

- name: London
  address: 1 Random St
  latitude: 51.443932
  longitude: -0.280600

If you’re not sure of your office coordinates, find them on a Google Map by searching your address, clicking on the marker and then ‘what’s here?’

Your office locations will also appear on your About page.

Issues

This section is for the issues your organization works on.

If your organization works on cat welfare for example, you may want this to say cat welfare.

1) Inside the ‘pages’ folder you’ll see a file called ‘issues’, with the following:

---
title: Issues
description: add a short introduction to the issues you address here
---

You can edit the title and description and it will appear on the issues page.

2) To use the same title on the main menu, in the data folder, open nav-links.yml.

- title: Issues
  url: /issues/

You can replace the title here with Cat Welfare, and perhaps the url or page address to /cat-welfare.

3) Now in the ‘issues’ folder, you’ll see each one begins like this:

---
title: Issue One
description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
related: # Add the title of related issues here and they will appear at the bottom of the page
  - Issue Two
  - Issue Three
  - Issue Five
---

Here you can change the title, perhaps to ‘Cats on the Road’, and add your description. Inside this document, you can add all the relevant information.

Including a title in the related section means that page will appear in the Related Issues section at the bottom of the page you’re working on.

Services

Adding your services follows the same logic as Issues above. The information is in three places:

  1. In the pages folder under /pages/services;

  2. In the data folder under nav-links.yml;

  3. In the ‘services’ folder.

If you don’t have any services, then delete the page, the nav-link entry and the folder and it won’t appear.

Events

To add your events, we just need to edit two places.

  1. In the ‘pages’ folder under Events, you can edit the description.

  2. In the ‘events’ folder, you’ll see each event takes at least three details, a start date, a title and a description:

---
layout: event
start-date: 2016-04-30 09:00
end-date: 2016-04-30 12:00 # optional
locations:
  - name: 1 Random Ave, Cardiff # optional
    latitude: 51.484039
    longitude: -3.218629
  - name: 1 Random St, London # optional
    latitude: 51.443932
    longitude: -0.280600
title: Event Listing Five
description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec a diam lectus. Sed sit amet ipsum mauris. Maecenas congue ligula ac quam viverra nec consectetur ante hendrerit. Donec et mollis dolor."

To find the coordinates for your event location, follow the instructions in the locations section.

Resources

If you have some pdf files you’d like to share, you can feature them under resources.

  1. Save your pdf in the ‘resources’ folder;

  2. In the ‘data’ folder under resources.yml, you’ll see each one takes at least three details:

- title: Setting up your JekyllOrg site
  description: "Ut est perspiciatis iste illum laudantium. A molestiae impedit autem suscipit sint soluta est. Nesciunt rerum facere eos et rem reiciendis beatae eius. Dolore dolores aliquam ut commodi tenetur."
  published-date: 2016-03-30 # Optional, e.g. 1987-01-23
  path: /resources/setup.pdf # E.g. /resources/my-file.pdf

Add your title, description and where you saved the file as in the example.

News

Your news articles live in the ‘blog’ folder, inside ‘posts’. You can add files here to create a new post.

The file name should be in the format YYYY-MM-DD-your-title.md

To create news articles, it may be more convenient to use Prose.

Maps

As your maps will use Google Maps, you’ll just need to get a key from Google. You should only allow your site to use your key.

Add your key to the config.yml file:

# API keys
api_keys:
  google: ""

You’re done!

Your website will be live online at https://youraccountname.github.io. It’s no problem to use your own address for the website, just follow the guide here.

Again, if you have any questions during configuration or if you’d like a custom version of JekyllOrg for your organization, feel free to send an email.