HW-Blank-Bootstrap-Theme | A starter theme for WordPress | Style Language library

We divided that code into several files inside app folder, wich are:. In app/View you can see two folders, the first one (Admin) is for make code to admin panel, the diference between this folder and Admin.php is that in this folder you write the logic and in Admin.php you just invoke the classes or funciontions. The second one (Components) is for usefull components linke Navbar or Navigation.
After installing WordPress, clone this repository within the themes directory and rename the created folder as you wish. (It is suggested that you also update your theme's name at the beggining of the index.css file)
Optional: To use this theme as a starting point for your own Wordpress project repository you may want to delete the hidden git directory inside the theme directory, and create a new git repo using git init.
Run npm install to install bootstrap, browser-sync and many other dependencies (tested with node version 14)
Run composer install.
Create a .env by creating a copy of .env.example and set LOCAL_DOMAIN with the correct value for your virtual domain.
Run npm run watch to start watching your files.
To see you changes you need to open in the browser the "Local" URL that the console gives to you (not the virtual domain), for example "http://localhost:3000".
Open the file assets/scss/index.scss to start creating your theme styles.
If you have errors when compiling with npm run watch, check your node version (and that you have already installed node modules).
If it compiles correctly but doesn't show your local URL it means that you haven't created the .env file.
If it compiles correctly but the local URL doesn't open you have a problem with your virtual domain.
admin: This file is for all code that is related to WP-admin, for example Theme options(Social links,GTM Id )
config: This file is for define some constants or configuration variables, for example IMG path
filters: This file is for make some filters
helpers: This file is for helper functions, for example display social icons
setup: This file is for make inicial setup like scripts and styles enqueuing and loading external fonts.
Optionally, your can use npm outdated to check if it is a newer bootstrap.
To use the bootstrap variables you just need to include the variables you want in your theme's /scss/_variables.scss. The full variables source file is located in ../node_modules/bootstrap/scss/_variables.scss.
Don't forget to check the Bootstrap 5 docs.
To optimize your final Bootstrap css you can comment every import that you don't use.