Expand my Community achievements bar.

SOLVED

Adding JSON-LD schema to an aem page if the page has a specific component

Avatar

Level 2

Editing to tag a few members here. 

 

@smacdonald2008 @kautuk_sahni @Dipti_Chauhan 

I have seen similar questions being asked here but did not see any answer so apologies if this is duplicate.

 

So 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/breadcrumb

https://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 <script> 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?

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

One option could be to write Sling Filter with scope SlingFilterScope.INCLUDE and once breadcrumb component is included on page, you can add you structure as needed.

 

 

Thanks

Dipti

View solution in original post

4 Replies

Avatar

Correct answer by
Community Advisor

One option could be to write Sling Filter with scope SlingFilterScope.INCLUDE and once breadcrumb component is included on page, you can add you structure as needed.

 

 

Thanks

Dipti

Avatar

Level 2
Thanks Dipti. Can you please elaborate a little. So you are saying when the author adds the Breadcrumb component the filter will

Avatar

Level 2
Thanks Dipti. Can you please elaborate a little. So you are saying when the author adds the Breadcrumb component the filter will be called and it will extract the data and create a JSON and add to the page? How will we get hold of the parent page containing the component and add JSON at the bottom of HTML?

Avatar

Community Advisor

Hi @gautamg99016783

  In filter you will have SlingHttpServletRequest, hence you will be able to get current resource and parent.

 

Thanks

Dipti