# Create element

### Structure

The main structures that make up an element:

* Template
* Mixins
  * Element
  * Javascript
  * Vendor
  * Liquid
* Props 
  * data
* Computed
  * settings (object)
  * style (object)
  * liquids (object)
  * javascript (function)
  * css (string)

### Register an element to Element List

{% code title="/src/components/LeftSide/Elements/ListElements.vue" %}

```bash
{
    name: 'Element Title',
    is: 'block',
    icon: 'CollectionIcon',
    // thumbn: '<svg>...</svg>'
    data: {
        name: 'element_name'
        settings: {
            ...
            // The default settings values
        },
        style: {
            ...
            // The default style values
        }
    }
}
```

{% endcode %}

### Register an element to builder

{% code title="/src/components/RightSide/Builder/Components/Core/Elements/index.js" %}

```
export { default as NameElement } from './Base/ElementFile.vue';
```

{% endcode %}