Jahz
1 supporter
Pahina WordPress Starter Theme

Pahina WordPress Starter Theme

Nov 21, 2020

Hello there! Thanks for checking out this article. So yes! I've decided to create my own WordPress starter theme powered by bootstrap 5 (SaSS) and it is based on the underscores theme.

https://github.com/jahzlariosa/pahina
https://josephlariosa.com/projects/pahina/

A WordPress starter theme based on Underscores and Boostratap 5

Basic Features

  • Combines Underscore’s PHP/JS files and Bootstrap’s HTML/CSS/JS.

  • Comes with Bootstrap (v5) Sass source files and additional .scss files. Nicely sorted and ready to add your own variables and customize the Bootstrap variables.

  • Uses a single minified CSS file for all the basic stuff.

  • Font Awesome integration (v6)

  • Jetpack ready.

  • WooCommerce support.

  • Child Theme ready.

  • Translation ready.

Installation

Download or clone the repo to wp-content/themes/pahina then navigate to wp-admin->themes and activate the theme.

Customization

Please do not use this as your primary theme, as all your changes will be overwritten when the pahina theme updates, instead use the childtheme - https://github.com/jahzlariosa/pahina-child

  • Your design goes into: /sass/theme.**

  • Add your styles to the /sass/theme/custom.scss file

  • And your variables to the /sass/theme/variables.scss

  • Or add other .scss files into it and @import it into /sass/theme/theme.scss.

  • Add your custom javascripts into ./js/theme.js

Compile

Requirements

  • node.js make sure node.js is installed to your machince/pc

  • gulp.js make things easier install gulp cli

npm install --global gulp-cli
  • Move the dependencies to the src folder, This includes bootstrap 5 & fontawesome source files

gulp get-src

Commands

  • Compile SaSS & Minify the css files

gulp styles
  • Compile and minify js files

gulp scripts
  • Run styles and scripts at once

gulp build-assets

Use browserSync | Edit gulpconfig.json

  • Serving from a server environment

"proxy": "localhost:3000" //replace this with your environment url
  • Run the server

gulp start

Enjoy this post?

Buy Jahz a beer

More from Jahz