通过动态样式和着色改进 Microsoft Dynamics CRM 2013/2015 表单的用户体验

引言

我有一个需求，需要为 Microsoft dynamic CRM 表单添加一些背景颜色、对齐方式和字体。我认为这非常重要，因为 Microsoft dynamic CRM 2013/2015 中的默认主题是无色的，所有部分的背景颜色都相同。

以前



操作后

背景

您需要对 Microsoft dynamic CRM 定制、Javascript 和样式表有基本的了解。

解决方案

我开始在互联网上搜索，并找到了 Hassan Kazemi 编写的一个很好的解决方案。这个解决方案的问题是任何样式都会应用于页面上的所有项目，例如所有部分、所有选项卡...等等。

我尝试通过单独处理表单项目来扩展 Hassan Kazemi 的想法。因此，您将拥有更多灵活性来操作表单上的颜色、字体、背景、内边距或任何样式选项。

基本思路是创建一个自定义样式表文件，并在 (表单加载) Javascript 事件上加载此文件，以动态覆盖原始样式表。

如何应用

1. 确定要应用样式表的项目。
   • 使用 Google Chrome 按 F12 打开开发人员工具
     
     
   
   
   • 从开发人员工具中单击搜索图标
     
     
   
   
   • 选择要更改样式的项目。
     
     
   
   
   • 复制所选项目的 CSS 路径
     
     
   
   
   • 将项目粘贴到记事本中
     
     
   
   
   • 为该项目编写新的样式
     
     
   
   
   • 对要更新样式的任何项目重复上述步骤。
   • 记事本的内容将在下一步中添加
2. 创建样式表。
   • 设置 → 定制 → 解决方案，然后打开您的解决方案或选择自定义系统
     
     
   
   
   • 选择 Web 资源
     
     
   
   
   • 按新建，然后填写下面的快照中的必填字段。
     
     
   
   
   • 选择文本编辑器，将步骤 1 中的样式从记事本复制并粘贴到其中，然后保存并发布。
     
     
3. 使用 Javascript 加载样式表。
   • 选择表单属性
     
     
   
   
   • 在“表单库”部分下单击“添加”
     
     
   
   
   • 选择“新建”以创建新的自定义 Javascript 库，或选择您现有的自定义 Javascript 库。
     
     
   
   
   • 填写快照中的字段并选择文本编辑器。
     
     
   
   
   • 复制并粘贴下面的函数并按确定。

     function LdCSS() {
     var path="/WebResources/new_custom.css";
     var head = document.getElementsByTagName('head')[0];
     var link = document.createElement('link');
     link.rel = 'stylesheet';
     link.type = 'text/css';
     link.href = path;
     link.media = 'all';
     head.appendChild(link);
     }
     
     
             

     
     
   
   
   • 按添加
     
     
   
   
   • 选择表单加载事件下的“事件处理程序”下的“添加”。
     
     
   
   
   • 写下函数名称。
     
     
   
   
   • 按确定 → 确定 → 保存并发布。
     
     

现在您可以刷新表单页面并应用样式。所以，继续享受直观的彩色屏幕吧。

 

关注点

此解决方案仅适用于本地部署的 dynamic CRM。不幸的是，它不适用于 CRM online。

参考文献

https://www.linkedin.com/pulse/how-colorize-microsoft-dynamics-crm-20132015-crm-consultant