1. サイトビルド管理

製品ページの作成

Version:
日本語翻訳に関する免責事項

このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。

製品は、Sitecore内のコンテンツアイテムです。MVCを使用して製品の詳細を表示します。

次の前提条件を満たします。

コンテンツ エディターで、次の操作を行います。

  1. _Products.cshtmlという製品のビューを作成し、Sitecoreのレイアウト コントロールで使用します。商品ページに表示されるリレーションシップのビューは、_ProductSummary.cshtmlと呼ばれます。

    _Products.cshtmlの

    @model ProductViewModel
@{
    var mod = (ProductViewModel)Model;
}
 
<div class="row">
    <div class="span5" id="productImages">
        <img src="@mod.FirstImagePath(ImageSize.Large)" alt="">
    </div>
    <div class="span4">
        <h3>@Model.DisplayNameRender</h3>
        <p>
            @Model.DescriptionRender
        </p>
    </div>
    <div class="span3">
        <h3>Price</h3>
        <span id="price">@Model.ListPriceRender</span>
    </div>
</div>
<div class="row">
    <div class="span12">
        @if (Model.Upsells != null && Model.Upsells.Any())
        {
            <h3>Upsells</h3>    
            <ul class="thumbnails" id="productUpsells">
                @foreach (var product in Model.Upsells)
                {   
                    <li class="span3">
                        @Html.Partial("~/Views/Catalog/_ProductSummary.cshtml", new ProductViewModel(product))
                    </li>  
                }
            </ul>
        }
    </div>
</div>

    _ProductSummary.cshtmlの

    @model ProductViewModel
@{
    var mod = (ProductViewModel)Model;
}
 
<a href="@Sitecore.Links.LinkManager.GetDynamicUrl(mod.Item)">
    <div class="thumbnail">
        <img src="@mod.FirstImagePath(ImageSize.Detail)" alt="">
        <div class="productLabel">
            <span class="label label-success">@mod.ListPriceRender</span><span class="label label-productName">@mod.DisplayNameRender</span>
        </div>
        <div class="detailsFloatOver">
                <h4>@mod.DisplayNameRender </h4>
                <p>@mod.ListPriceRender</p>
        </div>
    </div>
</a>

  2. 製品の基本ビュー モデルを作成します。

        public class ProductViewModel : Sitecore.Mvc.Presentation.RenderingModel, IImageEntity
    {
        private Item _item;
 
        public ProductViewModel() {}
        public ProductViewModel(Item item)
        {
            this._item = item;
            Upsells = new List<Item>();
        }
 
        public override Item Item
        {
            get
            {
                if (this._item == null)
                    return base.Item;
 
                return this._item;
            }
        }
 
        public string ProductId 
        { 
            get { return this.Item.Name; }
            set { this.Item.Name = value; }
        }
 
        public string Description { get; set; }
        public HtmlString DescriptionRender
        {
            get { return PageContext.Current.HtmlHelper.Sitecore().Field("Description", this.Item); }
        }
 
        public string DisplayName { get; set; }
        public HtmlString DisplayNameRender
        {
            get { return PageContext.Current.HtmlHelper.Sitecore().Field(Sitecore.FieldIDs.DisplayName.ToString(), this.Item); }
        }
 
        public decimal? ListPrice
        {
            get
            {
                var selectedCurrency = HttpContext.Current.Request.Cookies["currency"];
                if (selectedCurrency != null)
                {
                    if (this.Item["Price_" + selectedCurrency.Value] != null)
                    {
                        return decimal.Parse(this.Item["Price_" + selectedCurrency.Value].Replace("$", string.Empty), CultureInfo.InvariantCulture);
                    }
                }
 
                return decimal.Parse(this.Item["ListPrice"].Replace("$", string.Empty), CultureInfo.InvariantCulture);
            }
 
            set
            {
                this.Item["ListPrice"] = value.ToString();
            }
        }
 
        public HtmlString ListPriceRender
        {
            get
            {
                var selectedCurrency = HttpContext.Current.Request.Cookies["currency"];
                if (selectedCurrency != null)
                {
                    if (!string.IsNullOrEmpty(this.Item["Product_Price_" + selectedCurrency.Value]))
                    {
                        return PageContext.Current.HtmlHelper.Sitecore().Field("Product_Price_" + selectedCurrency.Value, this.Item);
                    }
                }
 
                return PageContext.Current.HtmlHelper.Sitecore().Field("ListPrice", this.Item);
            }
        }
 
        public string ImageFilename
        {
            get { return this.Item["Image_filename"]; }
            set { this.Item["Image_filename"] = value; }
        }
 
        public List<Item> Upsells { get; set; }
 
        public void Initialize(Rendering rendering)
        {
            base.Initialize(rendering);
        }
    }

  3. MVCアクション コントローラーは、次のコード セクションを使用して、製品に関する情報を取得できます。

    以下に示す例は、製品の画像、名前、説明、価格、および関係を示しています。リレーションシップはアイテムのフィールドであり、バリアントはアイテムの子になります。

            public ActionResult Product()
        {
            var productViewModel = GetProductViewModel(this.Item, this.CurrentRendering);
            return View(this.CurrentRenderingView, productViewModel);
        }

        protected ProductViewModel GetProductViewModel(Item productItem, Rendering rendering)
        {
            if (HttpContext.Items[_CurentProductViewModelKeyName] == null)
            {
                var productViewModel = new ProductViewModel();
                productViewModel.Initialize(rendering);
                
                // get upsells
                if (productItem != null && productItem.Fields.Contains(CommerceConstants.KnownFieldIds.RelationshipList) && !string.IsNullOrEmpty(productItem[CommerceConstants.KnownFieldIds.RelationshipList]))
                {
                    var upsells = new List<Item>();
                    RelationshipField field = new RelationshipField(productItem.Fields[CommerceConstants.KnownFieldIds.RelationshipList]);
 
                    if (field != null)
                    {
                        // display the upsells for this productItem
                        var relationships = GetRelationshipsFromField(field, "upsell");
                        if (relationships != null)
                        {
                            upsells = relationships;
                        }
                    }
 
                    productViewModel.Upsells = upsells;
                }
 
                HttpContext.Items[_CurentProductViewModelKeyName] = productViewModel;
            }
 
            return (ProductViewModel)HttpContext.Items[_CurentProductViewModelKeyName];
        }
 
        /// <summary>
        /// Gets a lists of target items from a relationship field
        /// </summary>
        /// <param name="field">the relationship field</param>
        /// <param name="relationshipName">the relationship name, for example upsell</param>
        /// <returns>a list of relationship targets or null if no items found</returns>
        protected List<Item> GetRelationshipsFromField(RelationshipField field, string relationshipName)
        {
            IEnumerable<Item> relationships = field.GetRelationshipsTargets(relationshipName);
            return relationships != null ? new List<Item>(relationships) : null;
        }

Sitecoreコンテンツエディタ内から製品をプレビューすると、その製品の詳細が記載されたページが表示されます。

この記事を改善するための提案がある場合は、 お知らせください!