Wednesday, July 6, 2016

Create Personal Website with Pelican - Part 1

Recently, I need create a personal website to advertise myself (I am about to graduate next year, so a personal website seems a must have to find a job ^)^). After a simple search, I found, you can create the website by using pelican, which is powered by Python! I immediately decided to create  a website using it.

There're many blogs showing how to install pelican, so I will skip it. What I found missing from most of the online blogs are how to build a personal website step by step, especially some details, so I will try to fill it up. To make this simple, I will use the site I created as an example. You can see my website here.

Let's start after you installed Pelican, and the Markdown extension, see here if you don't know how to install, or you can check out this blog.

Step 1:
Follow the documentation to run the pelican-quickstart to create the website folder.  Most of the questions you can use default options, and your own personal information. (I use SSH later to upload my website, so I put my username and ssh host url there).

Step 2:
A quick understand of the folder structure:
yourproject/ ├── content │ └── (pages)
├── output ├── develop_server.sh ├── fabfile.py ├── Makefile ├── pelicanconf.py └── publishconf.py
  • pelicanconf.py is the general configuration file
  • publishconf.py is the configuration file for publishing the site
  • fabfile.py is the configuration file for tool Fabric that you can automize your develop process later.
  • Makefile is also aimed at automizing the develop process
  • content folder will store all the different files you will develop, for our case, markdown files or images we need embed into the site. For example, you can have a pages folder to store all the different pages, and an image folder to store all the images.
  • output folder will have all the files that created for your site, for example, html, css, and so on.

Step3:
You can create folders in the content folder for different purposes. For example, you can create a pages folder to store all the pages, and images folder to store all the images you need.

After you created the pages folder, you can put the pages you want on your website into this folder. For example, let's put 3 pages into this folder, Home.md, Fun.md, and About.md. Here's the example for the Home.md:
Title: Home
Date: 2016-06-10 15:30
URL:
save_as: index.html     

---  
This is my home page!
---

## News and Events:
2016/06/10 I create my home page 
I think I don't need to explain this, if you are not familiar with Markdown, checkout this great cheatsheet. The only thing you should pay attention to in this page is the URL and save_as, this is telling pelican that we want this page as the default page when someone first entered into our website. You only need this in the home page, for others, you don't need this.

Step4:
Now you can build you website using 'make html', and this will generate the website to the output folder. To see it, first start a server by using the command 'make serve' in the output folder, then you can check the website at 'http://localhost:8000/'.

You notice that, it all looks good, except the tabs are in reverse order 'About', 'Fun', and 'Home'. To change this, just add PAGEORDERBY = 'date' to your pelicanconf.py file. Now you should see them in the correct order.

Now you have the website! You can find generated files at Qingkai's Github. And in the next blog - part 2, we will see how we change theme, add images, videos, attach files, add google analytics, and publish your site!

4 comments:

  1. It's true Bluehost is the industry leading hosting provide and they are best For wordpress Hosting,
    BlueHost Basic Plan Discount – $3.49/mo* for first contract
    No coupon or promotion code needed – Just purchase via our promo link (see below) and you’ll get an extra 55% discount from your first BlueHost bill.
    BlueHost WEb Hosting Discount

    ReplyDelete
  2. Take the time to move forward in your life. Personal development means many things to many people. Whether you decide to learn a new skill, begin to exercise, or hire a life coach, you'll be taking the right steps to a wonderful journey. This contact form

    ReplyDelete
  3. Hello my dear,

    I see your blog every day ... your blog is Very useful for me and I love so much ...

    You can see

    Looking pelican, camera, telescope, drone & gun cases in Australia? Our products are designed from the ground up and rigorously tested to ensure upmost quality.


    Visit Now - Pelican case

    ReplyDelete
  4. hello admin.
    Really happy to read this blog.I thing you are a skilledd blogger. you show youe tallent in this blog.Thanks for sharing.keep sharing more blogs.

    White Label Website Builder

    ReplyDelete