# Content elements

# Base content element

📍 Each content element contain base and common props.

📍 Each content element has Ce prefix ( We would like to avoid conflicts with other libraries or with your UI components )

Base props are used by render components:

 props: {
      id: this.data.uid,
      type: this.data.type,
      appearance: this.data.appearance

📍 this.data.content contains all custom props shipped by API

📍 Common props are related mainly with header, check shareProps

# Create own content element

  1. Create component, you can use base content element mixin to inherit all common props.


    <strong> Hello {{ header }} </strong>
import baseCe from '~typo3/components/content/elements/baseCe'
export default {
  name: 'CeText',
  extends: baseCe
  1. Register your content elements as plugin for Nuxt. Create components.js in /plugins/ directory


import Vue from 'vue'
import CeText from '~/components/content/elements/CeText'

const components = {

export default ({ app }) => {
  Object.keys(components).forEach(key => {
    Vue.component(key, components[key])
  1. Setup nuxt configuration
export default {
  plugins: ['~/plugins/components']

To render this content element your API should returns content element with type text