C9 Blocks Development

 Overview

Using source code, Git, NPM, installing libraries, creating production files

Install C9 Blocks from Github

 — Working with version control + source code

Installing from Git

You can download the C9 Blocks plugin from our Github repository, or from the command line. Once you’ve navigated to your plugins directory in WordPress you can type the following to install the plugin.

git clone https://github.com/covertnine/c9-blocks.git

This copies the repo into a directory called “c9-blocks.”

Finally, activate the plugin from the ‘Plugins’ section of the WordPress Admin.

You can create your own branches, or push to your own repos on Github or BitBucket.

Using Development Build Tools

 — Installing NPM and using build tools

Our plugin was started using the Create Guten Block GitHub Project, a “📦 A zero-configuration #0CJS developer toolkit for building WordPress Gutenberg block plugins.”

We assume you have some familiarity with using a package manager like, NPM, and have some development or testing environment to run build tools that help keep CSS and Javascript minified for faster performance and provide CSS preprocessing, among other features.

To learn more about NPM, head over to their official website.

If you’d like to make your own custom build of C9 Blocks, you can follow the steps above to install from our Github repo. Then step into the plugin directory and type the following:

npm i or npm -install

You should see output of packages being installed and configured. Once that has completed, run the following command to have your SASS and JS files turned into production code as you work on your editor.

For more information about NPM, troubleshooting NPM errors, or installing NPM for development, a good starting place is the Create Guten Block Readme

npm start

After a few seconds of compiling and running through build steps, you should have a screen that looks like the one to the right, courtesy of the immensely helpful tool, Create Guten Block, which we have modified and added a few of our own libraries to.

You can run a production build by typing the following command into another terminal window form within the c9-blocks plugin folder.

npm run build

This provides you your own custom build after editing any CSS or JS files. And if we were you, we’d commit it to your own Github Repo so you can track your changes or work on files as a team.