Wednesday, July 20, 2016

Create Personal Website with Pelican - Part 2

Let’s continue to build a personal website from the part 1 of the blog. This week, we will see how to change to a different theme, add images, videos, attach files, add google analytics, and publish the sites. The generated site files can be found at Qingkai's Github.

Change a theme

You can change the theme of your website. You can either create your own theme, or there are already many existing themes that you can use, see these nice themes. I won’t bother to create my own theme, so I will use the existing ones. You can have a look of different themes. Now, let’s start to change themes. All you need do is to download these themes, say I store it in my Download folder. If I want to use a theme, for example, ‘subtle’. I can follow the steps:
# this will install the theme
$ pelican-themes -i ~/Downloads/pelican-themes-master/subtle
# list all the themes on you machine
$ pelican-themes -l
# use the theme
$ pelican content -t subtle
# Now you should see the change of the theme on your website (reload if you don't see it).
Note: If you want to change something on the theme, before you install it, go to the folder and change the html template or the css files.

Add an image or video

Adding an image or video is simple, just add the html code into the markdown file, then you will have them, all you need do is to adjust the alignment and position.
Add an image
<img align="left" src="./images/iron_man.jpg" alt="Drawing" style="width: 200px;"/>
Add a video:
<div style="margin: 0px auto; text-align: center;"><iframe width="560" height="315" src="https://www.youtube.com/embed/WSYRkTTcEg0" frameborder="0" allowfullscreen></iframe></div>

Attach file

This is how you attach a file:
You can download iron man's image [here]({filename}../images/iron_man.jpg)

Add Google Analytics

Add google analytics to track the visits of your site is quite simple in pelican, all you need do is to change the trackID field GOOGLE_ANALYTICS in the publishconf.py file. To get the track ID from google analytics, you can follow the steps here

Publish your site

There are many ways to publish your site. I am using Fabric to publish my site. Change the remote server configuration in the fabfile.py:
# Remote server configuration
# this is your remote server address and port
production = 'username@XXXX.XXX.berkeley.edu:22'
# this is the folder contains all your site content
dest_path = '/home/kongqk/public_html'
Ok, you almost done, after you modified your site, and you can publish it using:
$ fab build
$ fab publish
# then type your loggin information!
Finally, we are done, and now you can enjoy your personal website. This is a quick way to build a nice simple website, and hope it is useful to you. 

2 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. Amplify is a beautiful platform to build a personal website in just 100 seconds.Amplify is pretty much popular in terms of user friendliness and pricing factor.They are offering the complete package of the personal website including .me domain, cloud hosting, email account, pre-built theme and much more for $5 per month, which is less than a cup of coffee. You can browse our theme portfolio at http://www.erience.in/amplify/gallery.html
    In addition to this, you can also ask us to build a theme of your choice for just $ 100

    ReplyDelete