We have a lot of custom components that can be added on to the page. If
the page has a Breadcrumb or a Video component, we need to add the
JSON-LD structured data to the page.
https://developers.google.com/search/docs/data-types/breadcrumbhttps://developers.google.com/search/docs/data-types/video
One approach is to do it on the client side using JS where we can go
through the html and look for any breadcrumb or video component and add
a tag to the page for each. But I was hoping to get it done in
the backend since we have all the details there. So as soon as the user
drops a breadcrumb component and saves it while authoring the page, we
should be able to fetch the details from component and add the
structured data to the bottom of the page. Which means if I were to
"view as published" the page, and i do View Source I will see the
structured data at the bottom. How can we do this in AEM? Are there any
best practices?