Is it possible to only render the divs in the experience manager and use a React.Fragment for the “production” site? Or can we override the default behavior of BrContainerBox with a property or some sort of Bloomreach configuration?
I’m looking forward to your reply!
With kind regards,
Peter van Meijgaard
Lead Frontend Developer @ ANWB
Indeed, changing the xtype of the container to nomarkup would solve the issue. Then you would have to change that through the cms console though, which can be a lot of work if you already have a lot of config in production. If you also want the hst.vbox container type to not render extra divs and you are sure you will never need it to render extra divs, you can change the mapping of the container type, the same way you map you own components:
I’ve asked our Bloomreach developers and we’re going to see if switching to xtype=hst.nomarkup is indeed a workable solution for us.
Another question though. In the documentation I read that by switching to hst.nomarkup, it’s now necessary to include a custom element in the container component (<@hst.include ref="nomarkup-container"/>) and an extra CSS class for container items (nomarkup-container-item-root).
Is still needed for the components being rendered by the React SDK and the BrManageContentButton is being used?
I looked at the documentation about this functionality, but couldn’t find it anywhere and it seems that no extra HTML elements are added to the code of the example projects using the React Bloomreach SDK.
I’m not a part of the Bloomreach team or anything, but I’ve ran into this issue myself before so thought I would help But I’m pretty sure you don’t need to add these extra elements if you’re using the React Sdk, we also use the nomarkup containers and we didn’t have to add these elements.