2 – Set Up Project

File structure

├── build/                   # Build files
├── dist/                    # Distribution files
├── src/                     # Source files
│   ├── assets/              # Assets directory
│       ├── fonts/           # Fonts directory
│       ├── img/             # Image directory
│       ├── js/              # JavaScript files
│       ├── styles/          # CSS files
│   ├── plugins/             # WordPress plugins
│   ├── theme/               # PHP Template files
├── tools/                   # Tools and utilities
│   ├── stylelintrc.json     # Stylelint configuration file
│   ├── IntelliJ.xml         # IntelliJ code style
└── .babelrc                 # Babel configuration
└── .gitignore               # Git ignored files
└── LICENSE                  # License agreements
└── README.md                # You are reading this
└── gulpfile.js              # Gulp configuration
└── package.json             # Node packages

To install WordPressify you need to clone the repository from GitHub:

git clone https://github.com/luangjokaj/wordpressify

Install dependencies

This will clone the repository on your local machine. Navigate to the newly created folder and install the dependencies:

npm install

Change template name

At this point WordPressify is installed and ready to be used for the first time. Before starting, open gulpfile.js and edit your template name:

/* -------------------------------------------------------------------------------------------------
Theme Name
------------------------------------------------------------------------------------------------- */
const themeName = 'wordpressify';

Install WordPress

On the first run we need to install WordPress, we do this once by running the command:

npm run install:wordpress

It will fetch the latest WordPress version, which is the build we use for the development server.

Start Workflow

We are ready to start our development server with the command:

npm run dev

If you are running a fresh instance of WordPress, the installation wizard will set up a wp-config.php file containing database credentials, site name etc.

You are ready to go! Happy coding!

WordPress Plugins

If you want to add or build WordPress plugins, you can do that from the directory:


Production Template

To generate your distribution files run the command:

npm run prod

The template will be saved as a zip file in:


Screencast: Installation, first setup.

Windows Users

If you are running Windows, PHP has to be installed and configured. Check the gulp-connect-php documentation.

We prepared a video screencast demonstrating the installation processs using a Windows operating system, you can find it here: How to install WordPressify on Windows? Or check out this tutorial on Medium.

Continue to:
3 – Styles, PostCSS and SCSS