salesforce零基础学习(八十四)配置篇: 自定义你的home page layout

当我们进入salesforce系统或者切换app后,默认第一个看到的就是home页面。home页面简单的来说可以包括左侧(narrow component)和右侧(wide component)两部分。

左侧包含Recent View,Custom Link,Create New等快捷入口等组件,右侧包括tasks,item to approval,calendar,dashboard snapshot等等。

有时,不同简档的用户需要看到不同的Home页面中的组件或者显示不同的custom link等操作,这时我们就需要针对不同的简档配置不同的home page layout。配置步骤如下:

一. Home Page Layout配置

1.Set Up处搜索home page找到Home Page Layouts进入;

2.输入custom home page layout 名称,勾选需要显示在左侧和中间部分需要显示的组件;

3.调整顺序并点击save & assign;

4.将创建的page layout 分配给profile 为System Administrator保存;

5.效果展示:

通过第一个图和效果展示的图可以看到通过自定义配置,将左侧的Create New组件拿掉了。

通过上面的配置,我们看到针对profile自定义home page layout 很简单,无非就是勾选需要的component,调整顺序后分配一个或者多个简档即可。

那么component是怎么出现的呢?

component包含两部分,一部分是标准的component,包括Create New,Item to approve等等,另外一部分就是自定义 home page component.使用自定义home page component可以让你的home首页变得更加丰富,更加符合扩充的业务要求。

 二.Home Page Component

1.点击Set Up,搜索Home Page Component后点击Home Page Component:从图中可以看到,上面标准的component包括常见的component,其中Messages & Alerts 和Custom Links可以自定义,其他均只能引用,无法修改,下面有新建自定义的Components的按钮可以新建;

2.点击New按钮新建Custom Components,可以分成四类创建

  •   Links:选择一个或者一组custom link作为一个component展示,类似标准组件custom links效果,此种类型仅可以放在左侧(Narrow Component);
  •   Image/Logo:一张图片展示在sidebar处,此处更多的是使用公司的logo;
  •   HTML Area:富文本编辑器展示HTML区域,此类型可以放在左侧(Narrow Component),也可以放在右侧(Wide Component);
  •        Visualforce Area:展示一个VF Page,此类型可以放在左侧(Narrow Component),也可以放在右侧(Wide Component)。

 Links类型为可以创建一个自定义链接展示在component中,后面会详细描述Links类型的展示,下面针对Image/Logo,HTML Area 以及Visualforce Area 类型简单描述。

2.1 Image/Logo:此类型通常用于展示公司Logo,其他情况下根据业务情况自己抉择。显示的图片需要先上传Document上并且要求图片必须小于100K。

  •   选择Type类型为Image,Name赋值以后点击Next;
  •   点击Insert an Image选择图片存在的Document,选择后点击Save。
  •   点击需要添加的Home Page Layout,将需要的componnet选中,并调整Component显示顺序后Save;
  •   Home首页效果展示。 

   2.2 Html Area : 此处可以使用富文本编辑器简单的展示你需要展示的HTML区块,此模块不支持HTML标签,区域可以根据你创建时的选择放在左侧以及右侧。

  •   选择Type为HTML Area 输入名称后选择Next;
  •   使用富文本编辑器按照要求创建需要的富文本内容以及格式后点击Save;
  •   更改Home Page Layout,选择Test Html Area后更改显示顺序点击Save.下图为显示效果。

2.3 Visualforce Area : HTML Area展示的效果毕竟没法写样式有很多限制,展示Visualforce Page可以更加丰富页面效果,比如首页展示公司产品进行轮播等等。

  •   新建Type 为Visualforce Area的Component,并赋值Name;
  •    选择需要展示的Visualforce Page 设置显示的高度等设置信息点击Save,然后修改Home Page Layout,将此Component勾选;
  •    展示效果:

 三. Custom Link

第二步中有一项是创建类型为Custom Links,选择此类型后将一个或者一组Custom Link放在一起作为一个Component展示,Custom Link入口以及实现展示如下:

1.Set Up搜索Custom Link后在home下有一项为Custom Links,选中后即可新建或者更改Custom Link;

2.Custom Link源包括三部分组成:URL,On Click JavaScript以及Visualforce Page。重写过标准的action或者新建过action的小伙伴应该对下面的页面很熟悉,Custom Link同样也支持Merge Field;

  •   URL:此种方式直接在输入框写一下目标的URL即可,当然这里面是可以引用merge field以及function来简单的实现一些动态情况的处理;
  •   On Click JavaScript:如果此链接是有复杂的逻辑进行确认最终的URL,可以使用On Click JavaScript,此种方式除了可以引用merge field以外,引入ajax toolkit js后还可以使用soql语句进行fetch操作来更加强大的支持你的业务要求。下面的例子为当前登录用户为lightning用户,则显示标准lightning页面,否则显示自定义列表页面;
  • Visualforce Page:指定点击此链接跳转到某个Visualforce Page页面

3.修改Home Page Component,将需要显示的Custom Links 选中后,将此component显示在Home Page Layout上即可.

总结:此篇主要描述如何自定义Home主页的UI,以及Home Page Layout,Home Page Component,Custom Links使用,主要内容都是基于配置的,开发量基本没有。篇中有描述错误地方欢迎指出,有问题的欢迎留言。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Google Dart

AngularDart 4.0 高级-结构指令 顶

本指南介绍Angular如何用结构指令操纵DOM,以及如何编写自己的结构指令来完成相同的操作。

612
来自专栏瓜大三哥

matlab GUI基础2

GUIDE编程开发 matlab可视化姐买你的设计,一般有两种方法,一是直接通过编辑M脚本文件产生GUI,二是通过MATLAB图形用户界面开发环境GUIDE来建...

2057
来自专栏AhDung

【C#】组件分享:FormDragger窗体拖拽器

类似QQ、迅雷等讲究UI体验的软件,都支持在窗口内多处地方拖动窗口,而不必老实巴交的去顶部标题栏拖,这个组件就是让winform也能这样随性拖拽,随性度或更甚。...

602
来自专栏Lambda

【第一季】Vue2.0内部指令

学习这套课程你需要的前置知识: HTML的基础知识,你需要达到中级水平,写前端页面的结构代码完全没有问题。 CSS的基础知识,最好做过半年以上的切图和布局,最...

1719
来自专栏前端说吧

Vue-组件嵌套之——父组件向子组件传值

3259
来自专栏carven

利用canvas实现毛笔字帖(三)

3. 第3部分controller.js 这一部分的功能就是要修改毛笔的颜色,还有清空画布。 功能简单,我们一起向下讲。 一开始依然是init controll...

703
来自专栏用户2442861的专栏

最简单的JavaScript模板引擎

 在小公司待久了感觉自己的知识面很小,最近逛博客园和一些技术网站看大家在说JavaScript模版引擎的事儿,完全没有概念,网上一搜这是08年开始流行起来的。。...

441
来自专栏智能算法

微信小程序,开发大起底

作者简介:张智超,北京微函工坊开发工程师,CSDN微信开发知识库特邀编辑。微信小程序爱好者。 感谢@翟东平 @qq_31383345 @nigelyq 等热情参...

41513
来自专栏企鹅号快讯

如何操作DOM树?——“查询”

上一篇文章,我们写了关于《如何学习DOM?》的问题,指出DOM树的操作无非就是增删改查,那么,现在我们就来聊聊如何“查询”DOM树中的节点对象。 ? 如果想要操...

1879
来自专栏移动开发之家

从Android到React Native开发(三、自定义原生控件支持)

恍惚间3个月过去了,作为揭棺而起的失踪人口,迟来的第三篇,也是react native原生相关的最后的一篇,是时候给收个尾了。这次就不废话了,直接上主题( ̄^ ̄...

291

扫码关注云+社区