Getting Started With Sitecore SXA Scriban

 Hi All,

We were recently required to create an SXA-based project with the requirement to use the SXA capability with as little code as possible.

I discovered that the SXA Scriban template was really helpful on that trip. The Scriban feature is really helpful, in my opinion. With the SXA Scriban template, there are a tonne of possibilities. We may generate multiple rendering variants by utilizing the Scriban template. 

LiquidJS is a technology used in the Scriban template. With that, we can use plain HTML inside the template and call object values using a syntax similar to MVC by simply placing "{{ }}" in place of dynamic values.

Ex:

 <div class="promo-text">  
   <div>  
     <div class="field-promotext">  
       {{ i_item.PromoText }}  
     </div>  
   </div>  
   <div class="field-promolink">  
     {{ i_item.PromoLink }}  
   </div>  

You need to be aware of the SXA cerating rendering variation before you go on this quest. If not, kindly click the following link to generate a rendering variation.

To begin using Scinban, you essentially need three things:

The embedding functions for the Scriban template may be found at https://doc.sitecore.com/xp/en/developers/sxa/93/sitecore-experience-accelerator/the-embedded-functions-for-the-scriban-template.html 

The embedded items and objects in the Scriban context can be found at https://doc.sitecore.com/xp/en/developers/sxa/93/sitecore-experience-accelerator/the-embedded-items-and-objects-in-the-scriban-context.html

https://doc.sitecore.com/xp/en/developers/sxa/93/sitecore-experience-accelerator/item-and-field-extensions.html is the URL for item and field extensions.

First, you need to be familiar with the terms used in the Scriban context, such as i_home, i_datasource, i_item, i_site, i_page, o_language, o_model, o_pagemode, etc. To learn more about these terms, click the link below:

https://doc.sitecore.com/xp/en/developers/sxa/93/sitecore-experience-accelerator/the-embedded-items-and-objects-in-the-scriban-context.html

After taking a brief look at the aforementioned URL, you are aware of the fundamental objects that you may utilize in your Scriban template in order to access the things that you require. I_item and o_model, which I utilized the most in our project, are my personal favorites.

We can refer to the following documents to gain access to items and field extensions:

https://doc.sitecore.com/xp/en/developers/sxa/93/sitecore-experience-accelerator/item-and-field-extensions.html

It will be very beneficial for initiating the scriban and obtaining certain fundamental values in the scriban template.

You can search for the embedded function after you have covered these two subjects. Using that, you can use the following url to perform some basic operations, such as retrieving field values, displaying photos, retrieving link values, searching for things, retrieving dictionary values, etc.

https://doc.sitecore.com/xp/en/developers/sxa/93/sitecore-experience-accelerator/the-embedded-functions-for-the-scriban-template.html 

I'm hoping this will motivate you to begin working at SXA Scriban. Please let me know if I can be of any assistance to you. I'd be glad to assist you. We also value your feedback.

I'll try to include additional blogs with Scriban example codes and other proof-of-concept websites built entirely using SXA Scriban, complete with search features, in upcoming blog articles.

I hope you enjoy this Sitecore blog. Stay tuned for more Sitecore related articles.

Till that happy Sitecoring :)

Please leave your comments or share this article if it’s useful for you.  

Some Other References: Clone an existing SXA component to create a brand new component

https://github.com/scriban/scriban/blob/master/doc/builtins.md