Use a Builderized React component in a symbol

Technical Questions
1

I have a React component for displaying product data which is integrated with our cart. I have been able to add that component successfully to a page. What I would LIKE to do, is be able to add that React component to a Symbol in Builder which includes other content next to the product detail and add to cart. But it appears that the react component is only visible in the collection of addable elements when I am editing a document which has a preview that pulls the react component in. But…symbols appear only to be previewable using the internal preview link, preventing the visibility of my react component.

Is there a special trick to adding a react component to a symbol in builder?

2

Hey Alex,

By default, symbols have a generic preview URL. So in your case, you’ll need to add one specific to your site that will load content of the same model name. For example, some people will do something like: our-site.com/builder-editing?model=symbol which renders <BuilderComponent model=“symbol” />