Custom blocks are pre-built design blocks that can help your users design content faster by reusing existing blocks.

Block Category

All blocks are organized under a category. This helps users find different blocks easily. For example: Headers, Footers, Features, etc.

Block Tags

Each block can have comma-separated tags which are searchable and make it easier for users to filter and find different blocks.

There are 2 ways to create and load custom blocks.

GUI Block Builder

No Coding Required

This is the quickest way to create tons of custom blocks. They are stored on our servers, and automatically loaded when you initialize the editor with the correct projectId.

1. Open Unlayer Dashboard.
2. Go to your Project. If you don't have one, create a new one.
3. Go to the Blocks menu on top.
4. Click New Block
5. Fill the form and click Create Block

JavaScript API

Requires Coding

If you want to save and load blocks from your own servers, you can load them up when initializing the Unlayer editor. Here's a code sample.

<script>
  unlayer.init({
    blocks: [
      { /* Block JSON Object */ }.
      { /* Block JSON Object */ }.
      { /* Block JSON Object */ }
    ]
  })
</script>