Skip to content

maulana-kurniawan/maulana-kurniawan.github.io

 
 

Repository files navigation

Maulana Kurniawan's Portfolio

Forked from:

Particle Particle

Added with my own customizations & features!

Basic Setup

  1. Download latest version of Ruby.

    • Windows:

      • Download and install Ruby+Devkit and just proceed, left all the options as-is in the installer.

      • After installation is completed, open cmd.exe and run:

        ridk install
      • Complete the configuration.

    • Debian, Ubuntu and their derivatives:

      • Install Ruby and other prerequisites:

        sudo apt-get install ruby-full build-essential zlib1g-dev
      • Set up a gems installation directory for your user account.

        echo '# Install Ruby Gems to ~/gems' >> ~/.bashrc
        echo 'export GEM_HOME="$HOME/gems"' >> ~/.bashrc
        echo 'export PATH="$HOME/gems/bin:$PATH"' >> ~/.bashrc
        source ~/.bashrc
    • Other Linux: Refer to this guide.

    • macOS: I don't know, never use macOS. Refer to this guide for macOS.

  2. Install Jekyll and Bundler:

    gem install jekyll bundler
  3. Clone this repository:

    git clone https://github.com/maulana-kurniawan/maulana-kurniawan.github.io.git

Site and User Settings

Fill in your informations on the _config.yml and _data.yml file to customize and personalize your site.

Don't forget to change your url before you deploy your site!

Color and Particle Customizations

  1. Color & font customization:
    • Edit the _fonts.scss inside _sass directory for font source, either from Google Fonts or local fonts.
    • Edit _vars.scss inside _sass directory for set the color and font variable values.
  2. Particle customization:
    • Go to particle.js site configuring the particle.js.
    • After finishing up the configuration, tap the "→ Download current config (json)" button, particlesjs-config.json will be downloaded and place it in this project root directory.

Customize the Favicon

The favicons are located in the assets/img/favicons/ directory. Replace them with your own.

Generate the favicon

Prepare a square image (PNG, JPG, or SVG) with a size of 512x512 or more, and then go to the online tool Real Favicon Generator and click the Select your Favicon image to upload your image file.

In the next step, the webpage will show all usage scenarios. You can keep the default options, scroll to the bottom of the page, and click the Generate your Favicons and HTML code button to generate the favicon.

Download & Replace

Download the generated package, unzip and delete the following two from the extracted files:

  • browserconfig.xml
  • site.webmanifest

And then copy the remaining image files (.png and .ico) to cover the original files in the directory assets/img/favicons/ of your Jekyll site. If your Jekyll site doesn’t have this directory yet, just create one.

The following table will help you understand the changes to the favicon files:

File(s) From Online Tool From Local
*.png ✔️
*.ico ✔️

✔️ means keep, ❌ means delete.

Thanks to Chirpy for the "Customize the Favicon" guide!

Test and run the site in local

In order to compile the assets and run Jekyll on local you need to follow this steps:

  • Install gem dependencies by running:

    bundle install
  • Build the site and make it available on a local server with live reload to changes made:

    bundle exec jekyll s -l

License

This theme is free and open source software, distributed under the The MIT License. So feel free to use this Jekyll theme anyway you want.

Credits

This theme was partially designed with the inspiration from these fine folks and of course, author of this repo upstream:

Languages

  • SCSS 95.6%
  • HTML 4.2%
  • Other 0.2%