Sitecore

Hello everyone! In this blog, we'll explore how to extend the page props factory plugin to add our own custom fields. We will take a realistic example to understand the concepts. XM Cloud is based on the SXA framework. In SXA, there was an option to add and manage the favicon directly from the CMS. However, this functionality is not available in XM Cloud. Instead, the favicon is typically placed in the public directory of your Next.js application to ensure public accessibility. If you want the favicon to be managed exclusively through the CMS, what approach can be taken to achieve this? So let's get started with CMS changes.First Step will be to add favIcon template with favIcon field. Second will be to add that template as base template for your main Settings item. Follow the below screenshot. Let's see the FE changes that we need to do. Create a new file called CustomContextResolver.ts under lib --> page-props-factory --> plugins Add the below code. Check...

Hello everyone. In this blog we will see more example of writing GraphQL queries. This is continue part of my previous blog which you can find here So let's start without wasting any extra time. Below is the Sitecore structure which we will be using in our case. Let me give you an overview. We are having going to read children of Social Links folder. There are links item created from two different template. One is Social Link and another one is Footer Link. This is just for example purpose. Social Link template has one Image field named as logo. Below is the screenshot for your reference. Reading Children of Item passed as query parameter in GraphQL If you see above query, we are passing datasource and language as Paramter. Then we are calling children which is responsible for getting all Sitecore items under result object.We are just showing the template name and item name from the result Reading Children of of Item passed as Query in GraphQL with template id filter If y...

Hello everyone, in this blog we will try to learn how we can fetch the data from Sitecore using GraphQL and build the component in Next JS application. We will utilize the Tiles component which was build in my last blog regarding GraphQL. The blog link is available Here This is just an example as same component can be developed using Layout service also. Lets see the code for the front end and try to see learn what each code function do. import React from "react"; import { GetStaticComponentProps, useComponentProps, JSS_MODE_DISCONNECTED, GraphQLRequestClient, } from '@sitecore-jss/sitecore-jss-nextjs'; import { StyleguideComponentProps } from 'lib/component-props'; import config from 'temp/config'; type ListItem = { Image : { src : string; alt : string; } TileLink : { target : string; text : string; url : string; } Title : { value : string; } id : string; } const Tiles = (props:...