Skip to content

Setup and Customization

Ahmet Cecen edited this page Sep 26, 2016 · 4 revisions

On the front page of the Project-Pages Editor, click on "Edit Content" on the project-pages card.

You should now see the core folder structure of your new instance. There are many more files and folders in the actual repository, but Project-Pages Editor masks any content that is not necessary for the everyday user.

For now, we will start with the following file:

Click on this file to open it in the editor. You will see a long file filled with setup settings. Don't worry, you only need to change 3 lines here for a basic setup. The file is formatted in a straightforward way: blue strings are parameter names, and black text is their value. So the following line:

title: Project Pages

is saying that the title of this project-pages instance is "Project-Pages". You can change this to any other name. Now let's break down this file into three sections and examine their functionality.

Site Settings

# Site settings
title: Project Pages
description: "An Integrated Scientific Blogging Template"
url: "https://projectpages.github.io"

This section is the only section you absolutely have to configure to use your blog. Here is what each value here corresponds to:

So simply change these to:

# Site settings
title: TITLE OF YOUR BLOG
description: "DESCRIPTION OF YOUR BLOG"
url: "https://USERNAME.github.io"

After changing these, click on the save button on the right, then click commit.

You are now set to use your blog. Checkout the creating content sections of the wiki for guides and tips.

Secondary Parameters

# Secondary Parameters
baseurl: "/project-pages"
header-img: img/home-bg.jpg
headercolor: "#FFFFFF"
logo: /project-pages/img/logos/Project-Pages-New-Logo-Inverted.png

These parameters control the following:

  • baseurl: this is the name of your repository which is /project-pages by default. If you setup your instance using another method than forking like duplication/mirroring, or you changed the name of your repository, change this accordingly.

  • header-img: Url to the image you want to display at the header. If you want to use another header image that reflects your blog, insert the url to that image. This can be a link to a webpage, dropbox, Flickr etc image, as long as it is public.

  • headercolor: Change this to change the color of the title and description texts. This might be necessary if you change the header image, due to visibility reasons. You can google search "html color picker" and use a webservice to choose the color in the hex format.

  • logo: Changes the logo at the header.

Tertiary Parameters

If you actually have a need to change these, you should already know what they are. I don't want to confuse novice users with the details here. Feel free to contact me if you do end up needing clarification.

Clone this wiki locally