5

Sitecore の PageEditor およびプレビュー インターフェースには、ユーザーが言語を選択できる「ドロップダウン」/オーバーレイ メニューをトリガーする言語セレクター ボタンがあります。この動作を再現するにはどうすればよいですか?

(私はこの質問に答えるために着手し、解決策を思いつきました。コメント/強化のために SOF に投稿しています。)

4

1 に答える 1

13

Sitecore.ClientアセンブリでSitecore.Shell.Applications.WebEdit.Commands.ChangeLanguageSitecoreがどのようにそれを行うかを確認できますSitecore.Shell.Applications.WebEdit.Commands.SetLanguage

これには、独自のコマンドを 2 つ作成する必要があります。1 つのコマンドがボタンに関連付けられており、1 つのコマンドはサブアイテムが選択されたときに実行されます。この例は、国の Cookie を変更するシナリオに基づいています。

ChangeCountry コマンド

まず、メニューを表示するコマンドです。Menu動的オプション付きの が表示されていることがわかります。オーバーライドGetHeaderGetIcon、ユーザーの現在の選択に基づいてボタン自体を動的にすることができます。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Sitecore.Shell.Applications.WebEdit.Commands;
using Sitecore.Diagnostics;
using Sitecore.Data.Items;
using Sitecore.Web.UI.Sheer;
using Sitecore.Web.UI.HtmlControls;
using Sitecore.StringExtensions;
using System.Web;

namespace Prototype.Commands
{
    public class ChangeCountry : WebEditCommand
    {
        protected Dictionary<string, CountryOption> _countries = new Dictionary<string, CountryOption>
        {
            {"US", new CountryOption {
                ID = "US",
                Name = "United States",
                Icon = "Flags/32x32/flag_usa.png"
            }},
            {"CA", new CountryOption {
                ID = "CA",
                Name = "Canada",
                Icon = "Flags/32x32/flag_canada.png"
            }},
            {"MX", new CountryOption {
                ID = "MX",
                Name = "Mexico",
                Icon = "Flags/32x32/flag_mexico.png"
            }},
            {"DE", new CountryOption {
                ID = "DE",
                Name = "Germany",
                Icon = "Flags/32x32/flag_germany.png"
            }}
        };

        public override void Execute(Sitecore.Shell.Framework.Commands.CommandContext context)
        {
            Assert.ArgumentNotNull(context, "context");
            if (context.Items.Length == 1)
            {
                Item item = context.Items[0];
                SheerResponse.DisableOutput();
                Menu control = new Menu();
                //replace with lookup and loop of available values
                foreach (var key in _countries.Keys)
                {
                    var country = _countries[key];
                    string id = country.ID;
                    string header = country.Name;
                    string icon = country.Icon;
                    string click = "prototype:setcountry(country={0})".FormatWith(key);
                    control.Add(id, header, icon, string.Empty, click, false, string.Empty, MenuItemType.Normal);
                }
                SheerResponse.EnableOutput();
                SheerResponse.ShowPopup("ChangeCountryButton", "below", control);
            }
        }

        public override string GetHeader(Sitecore.Shell.Framework.Commands.CommandContext context, string header)
        {
            HttpCookie country = HttpContext.Current.Request.Cookies["country"];
            if (country != null && _countries.ContainsKey(country.Value))
            {
                return _countries[country.Value].Name;
            }
            return base.GetHeader(context, header);
        }

        public override string GetIcon(Sitecore.Shell.Framework.Commands.CommandContext context, string icon)
        {
            HttpCookie country = HttpContext.Current.Request.Cookies["country"];
            if (country != null && _countries.ContainsKey(country.Value))
            {
                return _countries[country.Value].Icon;
            }
            return base.GetIcon(context, icon);
        }

        protected class CountryOption
        {
            public string ID { get; set; }
            public string Name { get; set; }
            public string Icon { get; set; }
        }
    }
}

Commands.config またはインクルード ファイルのいずれかに、新しいコマンドを登録します。

<command name="prototype:changecountry" type="Prototype.Commands.ChangeCountry,Prototype" />

国の変更ボタン

の下に新しい Chunk と Button を作成します/sitecore/content/Applications/WebEdit/Ribbons/WebEdit/Experience。このリボン ストリップは、プレビュー モードでも参照/複製されます。ボタンは次のプロパティを使用します。

リボンボタン

Click フィールドはコマンドの名前と一致する必要があり、ID フィールドはSheerResponse.ShowPopup上記の呼び出しで提供された要素 ID と一致する必要があります。

SetCountry コマンド

次は、メニュー/ドロップダウンのアイテムが選択されたときに呼び出されるコマンドです。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Sitecore.Shell.Applications.WebEdit.Commands;
using System.Net;
using Sitecore.Diagnostics;
using Sitecore.Web.UI.Sheer;
using System.Web;

namespace Prototype.Commands
{
    public class SetCountry : WebEditCommand
    {
        public override void Execute(Sitecore.Shell.Framework.Commands.CommandContext context)
        {
            Assert.ArgumentNotNull(context, "context");
            var country = context.Parameters["country"];
            Assert.IsNotNullOrEmpty(country, "Country not found");
            HttpCookie cookie = new HttpCookie("country", country);
            HttpContext.Current.Response.Cookies.Add(cookie);
            WebEditCommand.Reload(WebEditCommand.GetUrl());
        }
    }
}

この例では、選択した値に基づいて Cookie を設定し、ページをリロードしています。渡される値は、 のメニュー項目に関連付けられたクリック イベントに基づいていますChangeCountry。同様に、構成時のコマンドの名前は、ChangeCountryクリック イベントで使用されたものと一致する必要があります。

<command name="prototype:setcountry" type="Prototype.Commands.SetCountry,Prototype" />
于 2012-06-01T17:59:52.767 に答える