Posts

Showing posts with the label XM Cloud

Complete Guide: Multilingual Setup in Sitecore XM Cloud with Next.js JSS

Image
Sitecore XM Cloud: Enabling Multiple Languages for Global Websites and Involved Configuration In today’s digital era, building platforms that cater to diverse audiences is no longer optional — it’s essential. When we talk about global community, they would like to view the content in their regional language. Seeing this requirement and working in Sitecore XM Cloud, we had an option to add content in multiple languages. However, to use this feature you need to do some configurations. In this part of blog, I will try to explain How you can add new Language in XM Cloud and how you can configure the locale according to your requirements. In second part, I will discuss how you can setup language fallback in XM Cloud with necessary steps. Adding Language You can add the Language in 2 ways. Although you get the option to add the additional language while setting up the site initially like below:   But if you skipped that then you are left with 2 options. One is from Conten...

Build your Custom JSS Next.js component in Sitecore XM Cloud

Image
  In this blog, I will guide you How you can create your custom Next.Js Component with XM Cloud. I am assuming you have already created a site in XM Cloud and you have cloned the starter Nextjs app on your system. If not then you can follow this guide . In case, if you have cloned the project but facing issues while connecting or running it with XM Cloud instance then you can follow this guide . Till now, I have found there are different approaches which one can follow, but in this blog, we will create a JSS Rendering, from scratch with minimal complexities, which uses an Item as Data Source created from custom data template. Please note, we are not using XM Cloud Component Builder to create the components. Prerequisites Valid XM Cloud login. Site must be created on XM Cloud. Nextjs-starter project must be cloned and in running state. Code Editor with Git must be working. Set up Data Template Step 1: Goto Templates and reach to your site collection folder. In m...

Steps to Consider: Connect JSS Next.js Project with Sitecore XM Cloud

Image
In this blog, I will show how you can connect your local JSS Next.js App with XM Cloud Deploy. If you are wondering how to setup NextJs App with XM Cloud then do visit this blog . Please note, this blog refers to some steps which I have done previously while setting up my site on the portal. I would suggest you to just a have look into steps so that you can understand the further stated steps better. Since we will be running our local instance with XM Cloud, it would be better to create any component, lets say XM Cloud Component using component builder, and bind on home page to confirm and test the changes. If you are seeking to know How to create a component in XM Cloud then follow this guide . Prerequisites You must have cloned your NextJs app on your machine. Nodejs/Git must be installed. Any code editor, Visual Studio Code preferred. Site must be created on XM Cloud Portal. Exploring XM Cloud Deploy Lets begin with grabbing the environment variables which will b...

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...