Experro’s Base Theme gives you the freedom to design and integrate your unique custom components seamlessly into the Visual Builder. Unlock endless possibilities and bring your vision to life effortlessly.

​
Tip!

Consider looking at the Component Best Practices for some tips!
To create a custom component, follow these steps to create a basic React component in the src/components/cms-library folder: Step 1: 
import React from 'react';

const CustomComponent = () => {
  return (
    <div>
      {/* Add your component's content here */}
    </div>
  );
}

export default CustomComponent;
Step 2: Once you have created your custom component, import your custom component in the src/components/cms-library/index.ts file and export your component from the same file, as demonstrated in the example below. 
// Import your CustomComponent
import CustomComponent from 'path/CustomComponent';

// ...other code

export {
  // ...other exports
  CustomComponent,
};
Step 3: After creating your custom component, the next step is to create a widget for it, to make it availabe in Visuals Builder component list. To gain a comprehensive understanding of widgets, please refer to the Widget documentation.