---
title: "Scribanテンプレートの扱い方"
slug: "working-with-scriban-templates"
abstract: "SXA Storefrontで提供されているScribanテンプレートの概要紹介。"
---
# Scribanテンプレートの扱い方

SXAストアフロントには [、Scriban](https://doc.sitecore.com/xp/en/developers/sxa/100/sitecore-experience-accelerator/scriban-templates.html)テンプレートを使用した複数のレンダリングが含まれています。Scribanテンプレートは、他のSXAレンダラーでは表現できない高度なロジックを含み、複数のレンダラーを1つのテンプレートで置き換えることができます。これにより、レンダリングバリアントの複雑さが大幅に軽減されます。Scribanテンプレートは、フィールドレンダラー、セクション、タグなどに似たレンダラーとして利用可能で、他のレンダラーと共存することも可能です。既存のレンダリングバリアントを置き換えるためにも利用できます。

Scribanテンプレートの利点は、高速で軽量なスクリプト言語を使って既存の機能を容易に拡張できることです。通常レンダリングバリアントを使う際にSitecoreアイテムでHTML構造を定義するのではなく、Scribanテンプレート内で直接構造を作成できます。次の画像に示すように、従来のアイテムツリーレンダリングバリアントにおけるSitecoreアイテムの構造はScribanテンプレートでミラーリングされています。同じHTMLが作成されますが、はるかにコントロールが強化され、プログラミング言語の構成文や様々な関数、コンテキストアイテム、プロパティにアクセスするカスタムオブジェクトにアクセスできます。

> !注基盤となる [テンプレート言語](https://github.com/lunet-io/scriban/blob/master/doc/language.md) や [組み込み関数](https://github.com/lunet-io/scriban/blob/master/doc/builtins.md) に関する一般的なドキュメントは [、ScribanのGitHubリポジトリ](https://github.com/lunet-io/scriban)で入手可能です。

![Diagram showing traditional rendering variant and Scriban template](https://doc.sitecore.com/api/markdown-image/xp/ja/developers/102/sitecore-experience-commerce/images/TraditionalVsScribanRendering.png)

> !ヒントテンプレートフィールドは、下端にカーソルを合わせて境界線をドラッグすることで展開できます。

大まかに、以下の画像はレンダリングバリアントを用いてScribanテンプレートを使った際のデータ処理方法を示しています。

![How data is process when using a Scriban template](https://doc.sitecore.com/api/markdown-image/xp/ja/developers/102/sitecore-experience-commerce/images/HighLevelScribanProcess.png)

以下のSXA StorefrontレンダリングはScribanテンプレートとして利用可能です。これらのレンダリングは [それぞれCXAObservable](https://doc.sitecore.com/xp/ja/developers/102/sitecore-experience-commerce/rendering-communication.html "Rendering communication")を介して通信します。

-   [Commerce Search結果](https://doc.sitecore.com/xp/ja/developers/102/sitecore-experience-commerce/customizing-the-commerce-search-results-rendering.html "Customizing the Commerce Search Results rendering")
-   [無料ギフトセレクション](https://doc.sitecore.com/xp/ja/developers/102/sitecore-experience-commerce/customizing-the-free-gift-selection-rendering.html "Customizing the Free Gift Selection rendering")
-   [ミニカート](https://doc.sitecore.com/xp/ja/developers/102/sitecore-experience-commerce/customizing-the-minicart-rendering.html "Customizing the Minicart rendering")
-   [注文ライン](https://doc.sitecore.com/xp/ja/developers/102/sitecore-experience-commerce/customizing-the-order-lines-rendering.html "Customizing the Order Lines rendering")
-   [プロダクトバンドル](https://doc.sitecore.com/xp/ja/developers/102/sitecore-experience-commerce/customizing-the-product-bundle-rendering.html "Customizing the Product Bundle rendering")
-   [製品価格](https://doc.sitecore.com/xp/ja/developers/102/sitecore-experience-commerce/customizing-the-product-price-rendering.html "Customizing the Product Price rendering")
-   [ショッピングカートライン](https://doc.sitecore.com/xp/ja/developers/102/sitecore-experience-commerce/customizing-the-shopping-cart-lines-rendering.html "Customizing the Shopping Cart Lines rendering")

これらのレンダリングには廃止版もあり、既存のサイトでのみ後方互換性を提供するため利用可能で、Scribanテンプレートの代わりに標準的なRazorベースのMVCビューとコードバインドを使用しています。これらの[レンダリングはツールボックスから](https://doc.sitecore.com/xp/en/developers/sxa/100/sitecore-experience-accelerator/restructure-the-sxa-toolbox.html)追加または削除できます。作成するには、*/sitecore/Content/Sitecore/Storefront/Presentation/Available Renderings/Commerce*に移動し、**データ**セクションの**コンテンツ**タブで**編集**をクリックしてください。

> !注Scribanテンプレートの改変方法のデモについては、Discover Sitecoreチャンネルの[Sitecore Experience Commerce - SXA Storefront](https://youtu.be/HgwnRTYtTXs?t=91)動画をご覧ください。ScribanコードはVariantDetailsセクションのコンテンツタブのテンプレート欄からアクセスできます。テンプレートフィールドは、下の境界にカーソルを合わせて境界の端をドラッグすることで展開できます。