Salesforce-Visualforce-6.静态资源(Static Resources)

最新推荐文章于 2024-01-05 11:43:56 发布
最新推荐文章于 2024-01-05 11:43:56 发布
阅读量372 收藏
点赞数
分类专栏： Salesforce-Visualforce 文章标签： visualforce salesforce
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/nihaixiao/article/details/125472586
版权

一、静态资源简介

静态资源允许上传可以在 Visualforce 页面中引用的内容。资源可以归档（例如 .zip 和 .jar 文件）、图像(images)、样式表(stylesheets)、JavaScript 和其他文件。
静态资源由 Lightning 平台管理和分发，该平台充当文件的内容分发网络 (CDN)。自动处理缓存和分发。

静态资源使用 $Resource 全局变量进行引用，该变量可由 Visualforce 直接使用，或用作 URLFOR() 等函数的参数。

以下方法将$Resource 添加到页面：

  • 添加JavaScript 文件：
< apex:includeScript value="{! $Resource.jQuery }" />
< apex:includeScript value="{! URLFOR($Resource.jQueryMobile,'jquery/jquery.mobile-1.4.5.js')}"/>
  • 添加CSS 样式表：
<apex:stylesheet value="{! URLFOR($Resource.jQueryMobile,'jquery/jquery.mobile-1.4.5.css')}"/>
  • 添加图形文件：
<apex:image alt="eye" title="eye" url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/eye-black.png')}"/>

创建并上载压缩的静态资源

二、创建并上传静态资源

  1. 从 http://jquery.com/download/ 下载当前版本的 jQuery JavaScript 库。
  2. 从设置中，在“快速查找”方框中输入“静态资源”，然后选择静态资源，最后单击新建。
  3. 输入 jQuery 作为名称。
  4. 单击选择文件，然后选择下载的 jQuery JavaScript 文件。创建简单的静态资源
    在这里插入图片描述
    有了 jQuery 的静态资源版本，可以通过在表达式中引用的方式以在 Visualforce 页面中使用 jQuery，例如 {! $Resource.jQuery }。

三、在 Visualforce 页面中添加静态资源(JavaScript 例)

  • 使用 $Resource 全局变量和点记法来引用独立的静态资源。
<apex:page>
    <!-- Add the static resource to page's <head> -->
    <apex:includeScript value="{! $Resource.jQuery }"/>
    <!-- A short bit of jQuery to test it's there -->
    <script type="text/javascript">
        jQuery.noConflict();
        jQuery(document).ready(function() {
            jQuery("#message").html("Hello from jQuery!");
        });
    </script>
    <!-- Where the jQuery message will appear -->
    <h1 id="message"></h1>
</apex:page>
  • 预览结果：
    在这里插入图片描述

四、创建并上传压缩的静态资源

  1. 从 http://jquerymobile.com/download/ 下载当前版本的 jQuery Mobile JavaScript 库。
  2. 打开 zip 文件并删除 /demos/ 目录及其内容。
  3. 压缩文件夹并将其命名为 jquery.zip。
  4. 从设置中，在“快速查找”方框中输入“静态资源”，然后选择静态资源，最后单击新建。
  5. 输入 jQueryMobile 作为名称。
  6. 单击选择文件，然后选择 jquery.zip 文件
    在这里插入图片描述

五、在 Visualforce 页面中添加压缩的静态资源

使用 $Resource 全局变量以及 URLFOR() 函数来引用压缩静态资源中的项目。
URLFOR() 函数可以将压缩静态资源的引用以及其中项目的相对路径组合起来，以创建一个 URL，该 URL 可以与引用静态资源的 Visualforce 组件一起使用。

例如，URLFOR($Resource.jQueryMobile, ‘images/icons-png/cloud-black.png’) 返回压缩静态资源中特定图形资产的 URL，该 URL 可供 < apex:image> 组件使用。

可以为 < apex:includeScript> 和 < apex:stylesheet> 组件的 JavaScript 及样式表文件构建类似的 URL。

  • 示例1：
<apex:page showHeader="false" sidebar="false" standardStylesheets="false">
    <!-- Add static resources to page's <head> -->
    <apex:stylesheet value="{! URLFOR($Resource.jQueryMobile,'jquery/jquery.mobile-1.4.5.css')}"/>
    <apex:includeScript value="{! $Resource.jQueryMobile }"/>
    <apex:includeScript value="{! URLFOR($Resource.jQueryMobile,'jquery/jquery.mobile-1.4.5.js')}"/>
    <div style="margin-left: auto; margin-right: auto; width: 50%">
        <!-- Display images directly referenced in a static resource -->
        <h3>Images</h3>
        <p>A hidden message:
            <apex:image alt="eye" title="eye" url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/eye-black.png')}"/>
            <apex:image alt="heart" title="heart" url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/heart-black.png')}"/>
            <apex:image alt="cloud" title="cloud" url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/cloud-black.png')}"/>
        </p>
    <!-- Display images referenced by CSS styles, all from a static resource. -->
    <h3>Background Images on Buttons</h3>
    <button class="ui-btn ui-shadow ui-corner-all ui-btn-icon-left ui-icon-action">action</button>
    <button class="ui-btn ui-shadow ui-corner-all ui-btn-icon-left ui-icon-star">star</button>
    </div>
</apex:page>

在这里插入图片描述

  • 示例2
<apex:page >
    <apex:image alt="cats" title="cats" url="{!URLFOR($Resource.vfimagetest, 'cats/kitten1.jpg')}"/>
</apex:page>

Resources

Using Static Resources
Referencing a Static Resource in Visualforce Markup
Styling Visualforce Pages
Using JavaScript in Visualforce Pages
$Resource
Instantly reloading Visualforce static resources

KousaiM
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Salesforce基础入门（1）
小驴JACK的博客
08-06 1192
如何将HTML5网页转化为Visualforce pages 首先要介绍“静态资源”这个概念，所在目录为：Build-&gt;Develop-&gt;Lightning Components-&gt;Static Resources 我们原来在HTML中引用的一些图片，css和js等文件都要重新压缩，上传保存为静态资源，以备Visualforce pages 引用。 值得注意的是压缩原网页文...
Salesforce入门教程（中文）-020 VF使用静态资源&移动端开发（未完）
布偶酱的博客
09-15 255
6.Utilize Static Resource（使用静态资源） 静态资源允许您上载可在Visualforce页面中引用的内容。资源可以被归档（例如.zip和.jar文件），图像，stylesheets样式表，JavaScript和其他文件。静态资源由Lightning Platform管理和分发，该平台充当文件的content distribution network内容分发网络（CDN）。缓存和分发是自动处理的。 静态资源使用$ Resource全局变量引用，该变量可以由Visualforce直接
Python库 | django-salesforce-oauth-0.3.0.tar.gz
05-14
资源分类：Python库 所属语言：Python 资源全名：django-salesforce-oauth-0.3.0.tar.gz 资源来源：官方 安装方法：https://lanzao.blog.csdn.net/article/details/101784059
SalesForce - Metadata API Developer Guide.pdf
07-29
元数据API开发者指南 Use Metadata API to retrieve, deploy, create, update or delete customization information, such as custom object definitions and page layouts, for your organization. This API is intended for managing customizations and for building tools that can manage the metadata model, not the data itself. To create, retrieve, update or delete records, such as accounts or leads, use data SOAP API or REST API.
报红字No static resource article/list. 怎么回事？怎么解决？
weixin_71108480的博客
01-05 2411
忘记添加类处理器映射路径了，添加对应的路径即可。
springboot2.x整合thymeleaf的404(找不到资源)500(html名和访问地址一样)问题
klz
02-12 1196
springboot2.x整合thymeleaf的问题 参考文档: https://www.cnblogs.com/yichunguo/p/12128324.html 先说问题 父版本号 <parent> <groupId>org.springframework.boot</groupId> <artifactId&...
Salesforce VisualForce引用静态资源
wangyi9896的博客
03-13 1126
引用图片静态资源&lt;apex:image value="{!$Resource.Conlogo}"/&gt;引用附件文件，引用静态资源的路径&lt;apex:image value="{!if(att.Id != null ,'/servlet/servlet.FileDownload?file='+att.Id,'')}"&gt;页面Css调用静态资源&lt;apex:stylesheet ...
在Salesforce中使用静态资源
weixin_30388677的博客
12-12 460
静态资源 静态资源是Salesforce中默认的一种数据类型，用户可以上传各种文件，比如zip文件、jpg文件、css文件、图像文件等。 在Visualforce页面、Lightning框架的开发过程中，我们可以引用静态资源，调用图像、CSS样式、JS函数等。 上传静态资源 在设置页面中搜索“静态资源”，点击“静态资源”链接，即可进入静态资源一览表。 点击“新建”按钮，即可进入静态资源的编辑界面。...
salesforce中常用技能总结（纯粹干货，深度积累）图解
一条咸鱼x
04-26 7584
转载原文链接:http://blog.csdn.net/itsme_web/article/details/539762041、使用SOQL语句查询时，字符串类型的只能使用‘单引号’,否则报错：Unknown error parsing query；eg：SELECT Id, Subject, CaseNumber, Status, Priority         FROM Case      ...
解决Spring Boot访问resources目录下的static资源问题（详细版）
热门推荐
dubulingbo的博客
12-23 2万+
Spring boot 日常填坑
Python库 | tap-salesforce-1.4.22.tar.gz
05-22
资源分类：Python库 所属语言：Python 资源全名：tap-salesforce-1.4.22.tar.gz 资源来源：官方 安装方法：https://lanzao.blog.csdn.net/article/details/101784059
Python库 | salesforce-streaming-client-0.1.3.tar.gz
05-21
资源分类：Python库 所属语言：Python 资源全名：salesforce-streaming-client-0.1.3.tar.gz 资源来源：官方 安装方法：https://lanzao.blog.csdn.net/article/details/101784059
generator-salesforce-spa:在 Salesforce.com 平台上创建单页应用程序
07-08
发电机-salesforce-spa 生成器入门什么是约曼？ 套路问题。 这不是一回事。 是这个人： 基本上，他戴着大礼帽，住在你的电脑里，等着你告诉他你想创建什么样的应用程序。 并非每台新计算机都预装了 Yeoman。 他住在...
基于matlab实现人工免疫算法的解决TSP问题的方法
最新发布
05-21
基于matlab实现人工免疫算法的解决TSP问题的方法，体现了免疫算法在进化计算过程中的抗原学习、记忆机制、浓度调节机制以及多样性抗体保持策略等优良特性.rar
麦肯锡图表绘制培训.pptx
05-21
麦肯锡图表绘制培训.pptx
Java_Android的自由轻量级流媒体前端.zip
05-21
Java_Android的自由轻量级流媒体前端
node-v18.20.2-linux-arm64
05-21
node-v18.20.2-linux-arm64node-v18.20.2-linux-arm64 node-v18.20.2-linux-arm64node-v18.20.2-linux-arm64 node-v18.20.2-linux-arm64node-v18.20.2-linux-arm64 node-v18.20.2-linux-arm64node-v18.20.2-linux-arm64 node-v18.20.2-linux-arm64node-v18.20.2-linux-arm64 node-v18.20.2-linux-arm64node-v18.20.2-linux-arm64 node-v18.20.2-linux-arm64node-v18.20.2-linux-arm64 node-v18.20.2-linux-arm64node-v18.20.2-linux-arm64 node-v18.20.2-linux-arm64node-v18.20.2-linux-arm64
华为的OD(Organizational Development)
05-21
华为的OD(Organizational Development)
从左到右的流水灯.PWI
05-21
毕设&课设&项目&实训- 【项目资源】： 包含前端、后端、移动开发、操作系统、人工智能、物联网、信息化管理、数据库、硬件开发、大数据、课程资源、音视频、网站开发等各种技术项目的源码。 包括STM32、ESP8266、PHP、QT、Linux、iOS、C++、Java、python、web、C#、EDA、proteus、RTOS等项目的源码。 【项目质量】： 所有源码都经过严格测试，可以直接运行。 功能在确认正常工作后才上传。 【适用人群】： 适用于希望学习不同技术领域的小白或进阶学习者。 可作为毕设项目、课程设计、大作业、工程实训或初期项目立项。 【附加价值】： 项目具有较高的学习借鉴价值，也可直接拿来修改复刻。 对于有一定基础或热衷于研究的人来说，可以在这些基础代码上进行修改和扩展，实现其他功能。 【沟通交流】： 有任何使用上的问题，欢迎随时与博主沟通，博主会及时解答。 鼓励下载和使用，并欢迎大家互相学习，共同进步。
simple-salesforce安装
04-30
simple-salesforce是一款开源的Python库，用于与Salesforce CRM的REST API进行交互。其安装非常简单，只需要遵循以下步骤： 1. 确认Python版本：simple-salesforce要求Python版本为3.x。如果您的机器上没有安装...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值