Skip to content

How to create a block

Nadim Tuhin edited this page Oct 12, 2015 · 32 revisions

Lets create a test block for onepager. (writing in progress..)

.
├── wp-content/themes/themename
|   ├── onepager
|   |   ├── blocks
|   |   |   ├── test
|   |   |   |   ├── config.php
|   |   |   |   ├── view.php
|   |   |   |   ├── style.php
|   |   |   |   ├── block.css
|   |   |   |   ├── block.js
|   |   |   |   ├── block.jpg

##Configuration file

//config.php
return array(
    'slug' => 'nt-test' //must be unique, add prefix if necessary
    'name' => 'NT Test' //Could be anything,
    'groups' => array('block-category-1', 'block-category-2'),
    'assets' => function($blockRootUrl){
    	Onepager::addScript('nt-test', $blockRootUrl."/block.js");
    }
);

###slug (string) No two slug of two blocks can be same. So make sure you prefix your name with your block slug. For example if your name is Robert make your block slug rt-test

###name (string) Name of your slug appears on the block image. The name should represt its behaviour. Again prefix your block with your name. For example if its Robert make your block name RT Test

###groups (array) Groups is an array. The block can fall under these categories

'groups'=> array(
	"navbars",
	"headers",
	"contents",
	"portfolios",
	"teams",
	"testimonials",
	"blogs",
	"sliders",
	"pricings",
	"footers"
)

or you are free to write your own catgories.

###assets (anonymous function) You can add assets to your blocks. Follow this article for indepth click here