Did you know that you can navigate the posts by swiping left and right?

Modifying the Header

24 Jun 2015 . category: tech . Comments

The intro part of the index page (Header) is consisted of four elements:

  1. A black favicon
  2. Background image
  3. Welcome text
  4. Your image

Black favicon

The black favicon is an image on the left of the navigation bar. Preferably it should be a black and white version of your favicon.

black-favicon: "/img/black-lab-glass.ico"

Background image

In order to set the background, set the path to following variable:

background-img: "../img/intro-bg.jpg"

NB! Keep the .. in the beginning of the background image path

Welcome text

The welcome text is controlled by the following (self-explanatory) variables:

dynamic-typing: True
shuffle: True # Shuffle the lines.
loop: True
loop-count: False # Set False for infinite loop, or set any number for finite loop.
type-speed: 10 # Default 10
start-delay: 200 # Default 200
delete-delay: 5000 # Default 5000
lines: # You can add HTML Tags in the Text
  - text: "The lower you fall, the higher you'll fly."
  - text: "Where’s your will to be weird?"

Many thanks to @prashantsolanki3 for the dynamic typing feature!

Your image

You can set your image from the following variable:

me-img: "/img/jetpacktocat.png"

All set!


Marcus Johnson (mjohnsonengr) is a life-long learner who enjoys coding in JavaScript and TypeScript