bootflow-cli v1.2.6
BOOTFLOW-CLI : A WordPress Developer Toolkit
A WordPress developer toolkit that kickstarts your next WordPress theme development project with modern tools and workflows.
š How it works?
Bootflow-cli scaffolds a starter WordPress theme inside your wp-content/themes folder using the values supplied through a CLI interface. The starter theme supports Gulp, SASS, Babel, Webpack, AutoPrefixer, BrowserSync (Reloads your browser while development), assets minification and image optimizations.
You can just start using modern development tools and plugins in your WordPress theme Development Stack with almost no-configuration involved.
ā”ļø Quick Installation
Ā Ā Ā Ā ā¶ļø Create a Fresh Bootflow Theme
Ā Ā Ā Ā ā¶ļø Integrate Bootflow In An Existing Theme
ā”ļø Create a Fresh Theme
Go your terminal and cd to your local wp-content directory, where you want to start developing the theme and run the below given npx command:
npx bootflow-cli
You will be asked a few questions to generate your theme files, answer them correctly and a fresh copy of your development scaffolding theme will be generated inside your themes folder.
The Generated WordPress Theme
Generated Developer WordPress theme supports:
- Bootstrap 5.x, FontAwesome 5.x
- SASS Compilation
- CSS AutoPrefixer
- JS Babel Transpilation (ES6 Presets)
- Webpack 5 Script Bundling
- Assets Minification (CSS, JS, Images)
- Image Optimizer (JPEG, GIF, PNG and SVGs)
- CSS Sprite Images
- BrowserSync for a no-lag browser reload on file changes
- Gulp Workflow
Generated Theme's Folder Structure
.
āāā themes
āāā bootflow
āāā assets (hold the compiled CSS,JS,Images)
āĀ Ā āāā css
āĀ Ā āāā images
āĀ Ā āāā js
āĀ Ā āāā webfonts
āāā assets_src ( Static Assets Source Files )
āĀ Ā āāā images
āĀ Ā āāā js ( Webpack or Babel JS )
āĀ Ā āāā scss ( All Your SCSS Files )
āĀ Ā āāā sprite_images ( Your Sprite Icons/Images )
āĀ Ā āāā webfonts
āāā babel.config.json
āāā footer.php
āāā functions.php
āāā gulpfile.js ( Gulp Config and tasks folder )
āāā header.php
āāā inc
āĀ Ā āāā classes
āĀ Ā āĀ Ā āāā autoload.php ( PHP Classes autoloader )
āĀ Ā āĀ Ā āāā template-functions.php
āĀ Ā āĀ Ā āāā theme-hooks.php ( All your theme hooks )
āĀ Ā āĀ Ā āāā theme-setup.php
āĀ Ā āāā helper-functions.php
āĀ Ā āāā loader.php ( Loads Classes and helpders )
āāā index.php
āāā package.json
āāā screenshot.png
āāā style.css
ā”ļø Integrate Bootflow In An Existing Theme
Start using SCSS, WebPack, Gulp, NPM workflow in your exisiting WordPress theme.
Go to the terminal and cd to the WordPress theme directory in which you want to integrate Bootflow and run the below given npx command:
npx bootflow-cli
Complete the questions asked to integrate the workflow and you are done.