Posts

Showing posts from July, 2025

Adding Style to Custom Component in Sitecore XM Cloud Component Builder

Image
When you working on components in XM Cloud, there is always a need to provide the styling to it. In NextJs component it is pretty clear as you can add the classes to the elements, but when you are creating the components using XM Cloud component builder then things becomes much more easy. In my previous blog , I have shown how you can create a no-code component using the xm cloud component builder and in this blog i will show you how you can provide style to the controls in component builder. Please note, Since Sitecore has released its AI version and now being called SitecoreA , so i have updated this blog as per new options available in XM Cloud. Reaching out to Components Section Step 1: Click on your site and select Design Studio option Step 2: Click on Component option Create Component Step 3: Now lets create a new component Creating Elements Step 4: Create few elements Currently i have added 2 types of elements, one is heading and other is text. See on right section, they pro...

Working with Component Builder in Sitecore XM Cloud

Image
In my previous blog , I have guided to setup Next.js app in Sitecore XM Cloud instance. In this blog, I wanted to explain how you can connect your cloned Nextjs App with your XM Cloud instance. BUT I thought as we have not built any component yet for site home page or any page and it will look odd to see a blank page after configuring and running on the local machine. So, I thought building a component using XM Cloud Component Builder first and then will checkout configuring Nextjs app in next blog. Creating Component using Component Builder Step 1: Login into your Sitecore XM Cloud account and click on your app. On the right pane, click on Open app button. Step 2:  On the menu bar, click on Components Step 3: Create Component Collection This is the group of component under a single collection. This collection will be visible in Page builder and it become easy to search from categorised the components based on their nature or type. Step 4: Choose a name to c...