是否可以在Sitecore页面编辑器＆＃34;组件导航器＆＃34;中为占位符，组件和编辑框架定义不同的图标？

Question

在Sitecore页面编辑器中工作时，我们的编辑器使用蓝色箭头图标浏览占位符，组件树和编辑框架树以打开组件导航器。 组件导航器显示树中的每个祖先（从编辑器单击的页面区域的上下文），其中包含标题和小的蓝色方形子弹图标：

/sitecore/shell/~/icon/ApplicationsV2/16x16/bullet_square_glass_blue.png.aspx

不幸的是，所有组件，占位符和编辑框架都用相同的图标表示，并且单独通过标题来区分组件和占位符并不总是很容易（编辑框架按钮具有可编辑的标题和工具提示，在核心数据库中）。

理想情况下，我们希望使用彩色编码的子弹图标来帮助我们的编辑了解他们的位置以及他们点击的内容。

这些不是内容树中使用的图标。

那么我可以在任何地方为每个人设置不同的图标吗？如果没有，是否有针对此的代码修复？

编辑以澄清：此图像中的蓝色项目符号 - 正文是占位符，第一个图像横幅是一个组件，第二个是编辑框架（将获得新标题），横幅叠加是另一个占位符：

Answer 1

您需要做的是编辑所选ChromeTypes的.javascript文件。

转到sitecore\shell\Applications\Page Modes\ChromeTypes目录。你看到的是基础ChromeType函数和继承函数，如PlaceholderChromeType，RenderingChromeType等。

编辑要更改的类型图标。像这样覆盖icon函数：

icon: function() {
  return '/sitecore/shell/~/icon/ApplicationsV2/16x16/bullet_square_glass_green.png.aspx';
},

因此，如果你编辑PlaceholderChromeType.js文件，它应该像这样开始：

Sitecore.PageModes.ChromeTypes.Placeholder = Sitecore.PageModes.ChromeTypes.ChromeType.extend( {
  constructor: function() {
    this.base();
  },

  icon: function() {
    return '/sitecore/shell/~/icon/ApplicationsV2/16x16/bullet_square_glass_green.png.aspx';
  },

  controlId: function() {
    var marker = this.chrome.openingMarker();

清除浏览器缓存并刷新页面。现在所有占位符图标都是绿色的。

Answer 2

这些通常在WebEdit下配置;如“核心”数据库中所定义。例如，切换到“核心”后，请查看“/ sitecore / content / Applications / WebEdit / Edit Frame Buttons”。

您应该可以从那里进行所需的大部分图标更改。