Posts

What’s New in Sitecore XM Cloud

Image
  In the September 2024 release for XM Cloud, Sitecore introduced a range of exciting features designed to simplify website management, making it easier for teams to collaborate within a single, centralized application. This update includes enhanced tools for managing site collections, creating new websites, setting site configurations, handling languages, editing hosts, and other features tailored for large-scale, multi-site environments. Let’s take a closer look at each feature. Site Collections - Simplified Creation and Management One of the key updates in the September release is the enhanced ability to create and manage Site Collections. Site collections provide a structured way to organize sites, allowing content and templates to be shared seamlessly across sites within a collection. With XM Cloud Sites, you can now create new site collections by providing a Display Name and a System or Item Name, ensuring stable, technical references. Site Collections help group sites in a way t
Post a Comment
Read more

Exploring XM Cloud Component Builder: Show Dynamic Content

Image
In my previous blogs on XM Cloud , I covered how to create and display static data using the component builder, as well as how to style and build different versions of a component. In this post, I'll focus on creating a dynamic data source for components. Dynamic content enables components to be flexible and reusable across different contexts. Content such as text, images, videos, and links can be populated from various sources, like CMS content, APIs, or a GraphQL URL. Components are composed of elements such as buttons, cards, or other components, and each element can have a data source assigned to it. There are two primary options for displaying content within a component: Static - You can define static content for an attribute, such as entering alt text for an image or uploading an image directly. Mapped - You can map the attribute to dynamic content (text, image, or link) from a data source previously added to your XM Cloud environment. This dynamic content can be used mul
Post a Comment
Location: Kolkata, West Bengal, India
Read more

Exploring XM Cloud Component Builder: Create Versions

Image
  In my previous  blog , I discussed  how to style a component, modify elements, and customize themes. In this post, I'll focus on creating different versions of a component. In XM Cloud Components, a component can have multiple visual representations, known as component versions. These versions allow us to personalize components for specific audiences in Pages. Additionally, versions and breakpoints can be used to create responsive bundles, enabling components to adjust their appearance based on screen width. Adding a Version to a Component To add a new version to a component: In the Components Builder, scroll to the bottom of the page and click Add version . If this version is intended for responsive design, specify the breakpoints at which it should be displayed. Duplicating a Component Version Once you've styled and configured a component, you can duplicate it to easily create versions with different layouts without starting from scratch. To duplicate a component version: I
Post a Comment
Read more

Exploring XM Cloud Component Builder: Add Styling To Your Component Part 3

Image
  In my previous  blog , I discussed on  how  to apply rules to the elements and how to implement theme . In the current blog, I'll discuss on Style a component, an elements and customize the theme . In XM Cloud Components , themes are managed in the Styles builder, allowing you to apply them to components with a single click. In a previous blog, I explained that themes consist of pre-built elements and style rules, designed to simplify the styling process by applying multiple styles at once. How to Style a Component Using a Theme: In the Components library, select the component you want to style. In the Components builder, locate the version you want to style and click Current theme in the top-right corner. In the right-hand panel, under the Themes tab, select the theme you wish to apply. The component will now be styled according to the chosen theme. Customizing a Theme You can tailor a theme by selecting alternative styles for certain categories of elements. This is possible o
Post a Comment
Location: Kolkata, West Bengal, India
Read more

Exploring XM Cloud Component Builder: Add Styling To Your Component Part 2

Image
  In my previous blog , I discussed on h ow we can add basic style and rules in Sitecore XM Cloud Components style library. In the current blog, I'll discuss on how  to apply rules to the elements and how to implement theme. Applying Style Rules to Elements in XM Cloud Components Once you have added the basic styles (colors, fonts, graphics, and breakpoints) to your  Styles library  and bundled them into style rules, you must specify which style rules can be applied to specific elements. This ensures that only on-brand and curated style options are available in the  Styles library , which will be used in the  Components builder . Custom CSS styles can also be added to elements for greater flexibility. Add a Text Element Style Text elements come with six default collections: Heading 1 , Heading 2 , Heading 3 , Heading 4 , Heading 5 , and Paragraph . Each text element is automatically assigned the corresponding HTML tag (e.g., adding a text element from the Heading 1 collection assi
Post a Comment
Location: Kolkata, West Bengal, India
Read more

Exploring XM Cloud Component Builder: Add Styling To Your Component

Image
  Welcome back to our XM Cloud Component Builder series blog. In my previous blog of this series I discussed about how to create a component using XM Cloud component builder. In this blog we will begin with understanding what the Sitecore XM Cloud Components style library. The Styles library and builder of XM Cloud Components is a design system that manages the styles of all components and their versions and ensures visual consistency across all your digital properties.  Define basic styling: In  XM Cloud Components , style design begins with defining the  basic category , which includes fonts, colors, graphics, and breakpoints. Fonts: You can define and select fonts to maintain consistency and readability across your website. To add a font to the Style library, follow these steps: In the Styles builder , click Fonts in the left pane. At the top of the page, click Add font library . In the Font type field, choose either Google or Custom fonts based on your requirements. For custom
Post a Comment
Read more