The bulmascores from se468

View Code? Open in Web Editor NEW

Bulmascores is a starter theme for Wordpress that uses Bulma and Webpack (Sass and ES6).

License: MIT License

PHP 78.53% JavaScript 14.15% CSS 7.32%

bulmascores's Introduction

Bulmascores makes it easy to set up your wordpress project with new web technologies.

Bulmascores is a Wordpress starter theme. It aims to combine Underscores + Bulma + Webpack.

Setting up a new project without proper workflow always takes time and is tedious. Bulmascores saves you time setting up your new wordpress website.

Official Website | Download Links

Demo Site

You can download take the theme, upload to your wordpress, and run npm install.

Getting Started

5 minutes setup:

Download the theme zip file here
Upload theme to your new blank Wordpress install.
Activate the Bulmascores at the theme backend.
If you want to use Webpack, check below for more setup options.

After this, you should be set up to load the front-page.php. visit the site and check if front-page.php is loading. You may now go to next step: setup webpack.

Setup Webpack:

Install the node dependencies:

npm install

Install webpack if you haven't already.

npm install webpack

Try to compile the sass and js in the src directory by typing

npm run dev

You should see the compiled sass and js files in the dist directory.

Go to your theme directory, find webpack.config.js. Modify BrowserSyncPlugin settings to match your own local host's urls.

new BrowserSyncPlugin({
    host: 'localhost',
    port: 3000,
    proxy: 'http://bulmascores.valet/',
    files: [{
        match: [
            '**/*.php',
            'public/dist/**/*.css',
            'public/dist/**/*.js'
        ]
    }]
})

Try to run with browsersync:

npm run watch

You are all set!

Features

Custom Nav Walker

Bulmascores is also integrated with custom Bulma_Nav_Walker class, which supports Bulma dropdown navigation bars.

Webpack, npm, Sass all built in

Focus on your website, instead of spending time to set up your project. Bulmascores is integrated with Webpack, so you can bring Sass and latest ES6 javascript functionalities to your wordpress project!