LWR Academy - January 2022

LWR Academy for
Experience Cloud
January 31, 2022
Starting soon
Please stand by ...
LWR Academy for
Experience Cloud
January 31, 2022
Raj Rao
Raj Rao Durgesh Dhoot

Sr. Director, Cloud Solution Sr. Manager, Partner Practice
Alliances, Experience Cloud Development
/in/raj-rao/ /in/ddhoot/
Forward-Looking Statements
This presentation contains forward-looking statements about the Company’s financial and operating results, which may include expected GAAP and non-GAAP
financial and other operating and non-operating results, including revenue, net income, earnings per share, operating cash flow growth, operating margin
improvement, expected revenue growth, expected current remaining performance obligation growth, expected tax rates, stock-based compensation expenses,
amortization of purchased intangibles, shares outstanding, market growth, environmental, social and governance goals, expected capital allocation, including
mergers and acquisitions (such as the proposed acquisition of Slack Technologies, Inc.), capital expenditures and other investments, expectations regarding closing
contemplated acquisitions and contributions from acquired companies. The achievement or success of the matters covered by such forward-looking statements
involves risks, uncertainties and assumptions. If any such risks or uncertainties materialize or if any of the assumptions prove incorrect, the Company’s results could
differ materially from the results expressed or implied by the forward-looking statements it makes. The risks and uncertainties referred to above include those
factors discussed in Salesforce’s reports filed from time to time with the Securities and Exchange Commission, including, but not limited to: risks associated with
our ability to consummate the proposed Slack Technologies, Inc. transaction on a timely basis or at all; our ability to successfully integrate Slack Technologies, Inc.’s
operations; our ability to realize the anticipated benefits of the proposed transaction; the impact of Slack Technologies, Inc.’s business model on our ability to
forecast revenue results; disruption from the transaction making it more difficult to maintain business and operational relationships; the impact of, and actions we
may take in response to, the COVID-19 pandemic, related public health measures and resulting economic downturn and market volatility; our ability to maintain
service performance and security levels meeting the expectations of our customers, and the resources and costs required to avoid unanticipated downtime and
prevent, detect and remediate performance degradation and security breaches; our ability to secure and costs related to data center capacity and other
infrastructure provided by third parties; our reliance on third-party hardware, software and platform providers; the effect of evolving domestic and foreign
government regulations, including those related to the provision of services on the Internet, those related to accessing the Internet, and those addressing data
privacy; current and potential litigation involving us or our industry, including litigation involving acquired entities such as Tableau; regulatory developments and
regulatory investigations involving us or affecting our industry; our ability to successfully introduce new services and product features, including any efforts to
expand our services beyond the CRM market; the success of our strategy of acquiring or making investments in complementary businesses and strategic
partnerships; our ability to compete in the market in which we participate; the success of our business strategy and our plan to build our business; our ability to
execute our business plans; our ability to continue to grow unearned revenue and remaining performance obligation; the pace of change and innovation in
enterprise cloud computing services; the seasonal nature of our sales cycles; our ability to limit customer attrition and costs related to those efforts; the success of
our international expansion strategy; the demands on our personnel and infrastructure resulting from significant growth in our customer base and operations; our
dependency on the development and maintenance of the infrastructure of the Internet; our real estate and office facilities strategy and related costs and
uncertainties; fluctuations in, and our ability to predict, our operating results and cash flows; the variability in our results arising from the accounting for term
license revenue products; the performance and fair value of our investments in complementary businesses through our strategic investment portfolio; our ability to
protect our intellectual property rights; our ability to develop our brands; the valuation of our deferred tax assets and the release of related valuation allowances;
uncertainties regarding our tax obligations in connection with potential jurisdictional transfers of intellectual property; uncertainties regarding the effect of general
economic conditions; and risks related to our debt and lease obligations.
031621
First, some logistics
Questions, answers and staying in touch.
How do you ask a question?

• Raise your hand or post your question in the
Q&A section on your Zoom Window.
Where can you get the presentation?

• Yes, we will also be sharing the presentation
slide decks with you at the end of the session.
Will this be available as a recording after

today?
• Will be shared within the next 48 Hours.
QUICK POLL
1. Have you build any sites using

the Experience Builder?
2. Have you developed any
Lightning Web Components?
Footer
Audience
Best suited for developers, consultants, architects that have experience:

● Using Experience Builder to build sites
● Developing Lightning web components
● Working with Salesforce DX, User Interface API, and Apex Resources
Our Goals for this Academy
Takeaways
Education. You will leave this session able to understand the differences between existing
Aura Experience Sites and the new LWR Experience Sites. You will be able to communicate
when to use Aura and when to use LWR for a customer implementation.
Implementation. You will leave this session with an understanding of how to set up,
configure, build, and deploy LWR Experience Sites. This will be the meat of the workshop and
will be hands on to ensure you are engaged. We will use a series of checkpoints and quizzes to
ensure everyone is up-to-speed on the platform.
Roadmap. You will leave this session with an understanding of the safe harbor roadmap of
LWR and the adjacent features. You will be aware of underlying changes we are making for
performance and scale and the features we are making for usability and ease of use.
Opportunity. You will leave this session knowing areas of opportunity for driving business
value. We know what’s possible with the platform. We can give helpful pointers and materials
on how to pitch LWR Experience Sites to customers.
Agenda
1. Sign up for a Developer Org

2. Intro to Lightning Web Runtime for Experience Cloud
3. What are we building today?
4. Setting up the LWR Template
5. LWC Components for LWR Experiences
a. Building Components
b. Connecting Components to Data
c. Branding Components
6. Call to Action
7. Resources
8. AP Credential, Partners Resources & Upcoming Enablement
Sign-up for a New Salesforce Developer Org
1. Sign up for a New dev org —

https://developer.salesforce.com/signup
2. Check your inbox after a few minutes, look
for email from “developer@salesforce.com”
5
Google Slides does not
have an image
Minutes
placeholder option.
3. Click Verify Account button to set your Please place an image of

Hands-On Exercise
speaker over this circle
manually. Place Logo in
password. IMPORTANT: You will get only one circle below.
chance to set your password upon clicking

Verify Account button. If you don’t finish
setting the password in your first attempt,
you will need to sign up for another org.
Intro to Lightning
Web Runtime
(LWR)
for Experience Cloud
Product Vision: Experience Cloud
Manage content and create connected experiences for any channel
Marketing Websites, Forums B2B, B2C & PRM Mobile Commerce Industry Lightning Custom
Emails & Journeys & Help Centers Portals Apps Storefronts Bolt Solutions Apps
Experience
Builder and
Developer Tools
Themes Templates Components Runtimes
AI: Personalization, Recommendations, Search

Foundational
Platform Content: Creation, Management, Delivery
Services Data, Analytics and Process: CRM, CDP, Tableau, Mulesoft, Flow
Trust: Availability, Business Continuity, Security and Scale
Customer 360 Platform

Lightning Web Runtime
Standards
Based
✓ The industry’s first Web
Compilation Component static site
Modern generator
Tooling
✓ Standards based around
modern Javascript and open
source
✓ Prerequisite for high-scale

Developer Secure developer-driven experiences
Centric
Lightning Web
Components
Platform First
Navigation
Build B2C Performant
Experiences on
Salesforce Design System

routing apis lwc
Lightning Web Components
i18n data ...more
Lightning Web Security

Application Component
index.html home
Salesforce Functions
O
routes.json home.js FP
theme.json home.html
components # home.css
Static
Lightning Web Components
Experience Page
Salesforce Design System
Lightning Data Service
Lightning Web Security
Salesforce CRM (Sales, Service,

Marketing, Commerce)
Dynamic
Salesforce
Components
Customer
Components
Partner / Vendor
Components
Generally
Available
Build Your Own (LWR) Template Spring ‘21
Highly performant, developer-driven portals and sites
Summer ’21 Features

Benefits ● UI API, Apex Support
● Remove “/s” from URL
Build with Lightning Web
● Declarative Branding Tokens and CSS
Runtime for sub-second Variables
performance
● Locker, CSRF, and CSP Security
Enables fully custom ● Lightning Navigation

experiences with your ● Flexible Layout, Rich Content Editor,
design system HTML Editor, Tile Menu, and Login
Components
Access CRM and Apex with ● Standard, Object, and Content Pages
100% LWC technologies ● Page Access and Authentication
● Referential Integrity
● Extensive Developer Docs (link)
Quiz #1
What are some of the benefits of What are some of the benefits of
Lightning Web Runtime on Lightning Web Runtime on
Experience Cloud? Experience Cloud?
A. Built 100% with Lightning Web A. Built 100% with Lightning Web
Components Components
B. Leverages Static Site Generation B. Leverages Static Site Generation
C. Supports React and Angular C. Supports React and Angular
D. Both A and B D. Both A and B ✅
E. All of the Above E. All of the Above
Quiz #1
What type of components can be What type of components can be

used on Lightning Web Runtime for used on Lightning Web Runtime for
Experience Cloud? Experience Cloud?
A. Salesforce Components A. Salesforce Components
B. Partner/Vendor Components B. Partner/Vendor Components
C. Customer Components C. Customer Components
D. Both A and C D. Both A and C
E. All of the Above E. All of the Above ✅
What are we
building today?
LWR Experiences
Sample LWR Site
Sample LWR Site - Custom Navigation Menu
Custom Navigation Menu LWC

Sample LWR Site - Search Component
Custom Search LWC

Sample LWR Site - User Profile Component
Custom Profile LWC

Create an LWR Site
Setting up the BYO (LWR) Template
Creating an LWR Site
● How to enable Experience Cloud

● Differences between Authenticated and
Unauthenticated Choices
○ When to use one versus the other
● OOTB Pages in the Template
Generally
Available
How to Create a BYO (LWR) Template Spring ‘21
Create a new Experience Site in the Experience Wizard (as seen below)
What do I need to buy to get BYO (LWR)?
I’m no SKU or licensing expert but here’s my general advice:

Building a Customer or Partner Portal...
➔ What? Member or Login-based Experience Cloud SKUs
➔ Why? You need user licenses. The same licenses that apply to Aura experiences also work
with LWR-built sites.
Building a public-facing Website with or without CRM data...
➔ What? Salesforce CMS [Recommended]
➔ Why? You’re focused on unauthenticated content. The CMS SKU allows you to accelerate
your content services (blogs, press releases) while also providing the Martech functions
one needs in order to build a website.
Complete Pre-work Steps 1 - 13 listed in the
Pre work document:
10
have an image
Minutes
placeholder option.
○ Download Content Files
Please place an image of
○ Create a Trusted Site Hands-On Exercise
○ Make CMS App Tabs Visible circle below.
○ Clone Github Repository using VSCode
○ Deploy managedContentTypes
○ Import Salesforce CMS Content
○ Start Here: https://sfdc.co/LWRAcademyPrework
Create an LWR Site
○ Deploy resources from the cloned LWR-BYO repo to
10
have an image
your Dev Org Minutes
placeholder option.
○ Start Here: https://sfdc.co/LWRAcademyWorkbook Please place an image of

Hands-On Exercise
circle below.
Quiz #2
BYO (LWR) Template
My customer wants to build a food blog My customer wants to build a food blog
where their users can log in and save where their users can log in and save
their favorite recipes to their accounts. their favorite recipes to their accounts.
They want this on LWR. What solutions They want this on LWR. What solutions
should I recommend? should I recommend?
A. No SKU needed A. No SKU needed
B. Customer Community B. Customer Community
C. Salesforce CMS C. Salesforce CMS
D. Both Customer Community and D. Both Customer Community and
Salesforce CMS Salesforce CMS ✅
Quiz #2
BYO (LWR) Template
What is one feature unauthenticated What is one feature unauthenticated

LWR sites have that authenticated sites LWR sites have that authenticated
do not? sites do not?
A. Access to Salesforce CMS A. Access to Salesforce CMS
B. No /s in the URL B. No /s in the URL ✅
C. Object Pages C. Object Pages
D. Lightning Locker D. Lightning Locker
Lightning Web
Components
for LWR Experiences
Component Building
Building Connecting Branding

Components Components to Components
Data
➔ Components ➔ CMS Picker ➔ Colors

➔ Page Layouts ➔ Data Binding ➔ Text
➔ Theme Layouts ➔ Spacing
Building
Components
for LWR Experiences
Everything is LWC!
Woohoo!
Theme Layouts Page Layouts Components

➔ Built using slots ➔ Built using slots ➔ Work in both Aura and
LWR Experiences
➔ One slot is default for ➔ Special LWC target
page layout lightningCommunity__Page_Layout ➔ Can be used without
Locker using capability
➔ Uses F6 Navigation for lightningCommunity__RelaxedCSP
Accessibility
➔ Special LWC target
➔ Special LWC target lightningCommunity__Page
lightningCommunity__Theme_Layout
Building Components
● How to build an LWC Theme Layout

● How to build an LWC Page Layout
● How to build an LWC Component for an
LWR Experience
● How to deploy LWC components to show
in the Experience Builder
How to Build a Custom LWC Theme Layout
customThemeLayoutExample.js
import { LightningElement } from 'lwc';
/**
* @slot themeHeader
* @slot themeFooter
*/
export default class CustomThemeLayoutExample extends LightningElement {}
customThemeLayoutExample.html customThemeLayoutExample.js-meta.xml
<template> <?xml version="1.0" encoding="UTF-8"?>
<header data-f6-region> <LightningComponentBundle
<slot name="themeHeader"></slot> xmlns="http://soap.sforce.com/2006/04/metadata"
</header> fqn="customThemeLayout">
<section data-f6-region> <apiVersion>52.0</apiVersion>
<slot></slot> <isExposed>true</isExposed>
</section> <masterLabel>
<footer data-f6-region> Custom Theme Layout with Header and Footer
<slot name="themeFooter"></slot> </masterLabel>
</footer> <description>A custom theme layout</description>
</template> <targets>
<target>lightningCommunity__Theme_Layout</target>
</targets>
</LightningComponentBundle>
How to Build a Custom LWC Page Layout
customPageLayoutExample.js
import { LightningElement } from 'lwc';
/**
* @slot pageHeader
* @slot pageFooter
*/
export default class CustomPageLayoutExample extends LightningElement {}
customPageLayoutExample.html customPageLayoutExample.js-meta.xml
<template> <?xml version="1.0" encoding="UTF-8"?>
<header> <LightningComponentBundle
<slot name="pageHeader"></slot> xmlns="http://soap.sforce.com/2006/04/metadata"
</header> fqn="customThemeLayout">
<footer data-f6-region> <apiVersion>52.0</apiVersion>
<slot name="pageFooter"></slot> <isExposed>true</isExposed>
</footer> <masterLabel>
</template> Custom Page Layout Example
</masterLabel>
<description>A custom page layout</description>
<targets>
<target>lightningCommunity__Page_Layout</target>
</targets>
</LightningComponentBundle>
How to Build a Custom LWC Navigation Menu
Custom
Profile LWC
Custom Navigation Custom

Menu LWC Search LWC
Data Elements of the Menu Item
Name
Type:
Optional Parameters
Demo
Custom Navigation Menu Component
NavigationMenu.js-meta.xml
● NavigationMenuItemsController.cls Apex Class
<apiVersion>52.0</apiVersion>
● Lightning Web Components <isExposed>true</isExposed>
○ searchBar <masterLabel>Navigation Menu</masterLabel>
○ userProfile <description>Custom Navigation Menu</description>
○ navigationMenuItem <targets>
○ navigationMenu <target>lightningCommunity__Page</target>
<target>lightningCommunity__Default</target>
Additional Supporting Apex Class & Components </targets>
<targetConfigs>
● GlobalSearchController..cls Apex Class
<targetConfig targets="lightningCommunity__Default">
● Lightning Web Components
<property
○ searchResults name="menuName"
○ profileDetail type="String"
○ recordList datasource="apex://NavigationLinkSetPickList"
○ recordDetail label="Navigation Menu Name"
description="The name of the Navigation Menu Linkset, which can be configured in
@wire(getNavigationMenuItems, {
Settings > Navigation"
menuName: '$menuName', />
</targetConfig>
publishedState: '$publishedState'
</targetConfigs>
})
NavigationMenu.js-meta.xml
<property
name="menuName"
type="String"
datasource="apex://NavigationLinkSetPickList"
label="Navigation Menu Name"
description="The name of the Navigation Menu Linkset, which can be
configured in Settings > Navigation"
/>
NavigationLinkSetPickList.cls
global override VisualEditor.DynamicPickListRows getValues() {
VisualEditor.DynamicPickListRows picklistValues = new VisualEditor.DynamicPickListRows();
List<Network> network = [SELECT Id from Network WHERE Name = 'BYO LWR'];
List<NavigationLinkSet> navigationLinkSetList = [
SELECT MasterLabel, DeveloperName
FROM NavigationLinkSet WHERE NetworkId = :network[0].Id
navigationMenu.js NavigationMenuItemsController.cls
wire(getNavigationMenuItems, { List<NavigationLinkSet> linkSets = [
menuName: '$menuName',
publishedState: '$publishedState' SELECT Id
}) FROM NavigationLinkSet
wiredMenuItems({error, data}) {
if (data && !this.isLoaded) { WHERE MasterLabel = :menuName AND NetworkId =
this.menuItems = data.map((item, index) => { :networkId
return {
target: item.Target, ];
indx: index, Id linkSetId = linkSets.get(0).Id;
id: item.Id,
label: item.Label, myList = [SELECT toLabel(Label), Target, Type, DefaultListViewId,
parentId: item.ParentId, AccessRestriction, Id,
position: item.Position,
defaultListViewId: item.DefaultListViewId, ParentId,Position,Status,TargetPrefs
type: item.Type, FROM NavigationMenuItem
accessRestriction: item.AccessRestriction
} WHERE NavigationLinkSetId = :linkSetId
}).filter(item => { AND Status = :publishedState ORDER BY ParentId, Position
// Only show "Public" items if guest user
return item.accessRestriction === "None" ];
|| (item.accessRestriction === "LoginRequired" && !isGuestUser); return myList;
navigationMenu.js navigationMenu.js
// assign submenus as children of menu item @wire(getNavigationMenuItems, {

var navMenuTree = this.unflatten(this.menuItems); menuName: '$menuName',
this.menuItems = navMenuTree; publishedState: '$publishedState'
for(let c =0;c<this.menuItems.length;c++){ })
if(this.menuItems[c].children.length){
this.menuItems[c].parentIndx = this.menuItems[c].indx; @wire(CurrentPageReference)
this.menuItems[c].hasChildren = true; setCurrentPageReference(currentPageReference) {
this.menuItems[c].subMenuClass = 'show'+this.menuItems[c].indx+'-sub-menu sub-menu'; const app = currentPageReference &&
this.menuItems[c].arrowClass = 'bx bxs-chevron-down arrow'+this.menuItems[c].indx + ' arrow '; currentPageReference.state &&
} currentPageReference.state.app;
} if (app === 'commeditor') {
this.publishedState = 'Draft';
} else {
this.publishedState = 'Live';
}
}
Summarizing what we learned thus far …
Use Apex to fetch navigation menus for the LWC visual property editor
Invoke Apex method getNavigationMenus to retrieve menu items
Store the returned data in the menuItems object
Iterate over each menuItem and render a navigationMenuItem child component
navigationMenu.html
<template for:each={menuItems} for:item="item">
<template if:true={item.hasChildren}>
<li key={item.id}><c-navigation-menu-item onselectedsubmenu={handleSubMenuEvent} item={item}></c-navigation-menu-item>
navigationMenuItem.js Navigation Menu
if (type === 'SalesforceObject') {
// aka "Salesforce Object" menu item
this.pageReference = {
type: 'standard__objectPage',
attributes: {
objectApiName: target
},
state: {
filterName: defaultListViewId
}
};
} else if (type === 'ExternalLink') {
this.pageReference = {
type: 'standard__webPage',
attributes: {
url: target
}
};
}
Quiz #3
Building Components
Which of the following requires a Which of the following requires a

default slot to work properly? default slot to work properly?
A. LWC Theme Layout A. LWC Theme Layout ✅
B. LWC Page Layout B. LWC Page Layout
C. LWC Component C. LWC Component
D. Both A and B D. Both A and B
Quiz #3
Building Components
How can an ISV component ensure it How can an ISV component ensure it
works in an customer org when works in an customer org when
Locker is disabled? Locker is disabled?
A. Having API version above 50.0 A. Having API version above 50.0
B. Setting isExposed as true B. Setting isExposed as true
C. Adding the Relaxed CSP C. Adding the Relaxed CSP
capability capability ✅
D. None of the above D. None of the above
How to use your custom Navigation Menu LWC 15
have an image
Minutes
placeholder option.

Hands-On Exercise
circle below.
Connecting
Components to
Data
for LWR Experiences
Data Sources
Pro Code No/Low Code

● UI API (ex. getRecord) ● Standard LWC Properties (ex. Boolean)
● Apex ● Unique Property - Content Picker
● Static Resource ● Salesforce Design System - CSS Variables
● Content Asset ● Data Binding
● Connect API (CMS) [Coming Winter]
● Apex Continuation [Coming Winter]
Connecting Components
to Data
How to build a CMS property for an LWC
<property
type="ContentReference"
name="contentId"
label="Content ID"
filter="cms_image"
/>
</targetConfig>
Connecting Components to Data
How to build a CMS Property for LWC
Review the custom LWC sldsHeroCarousel on your own

Data Binding
Review Learn how to effectively use LWR sites

Quiz #4
I want to build an LWC component I want to build an LWC component

that my declarative users can use to that my declarative users can use to
select content which will select content which will
subsequently call the CMS subsequently call the CMS
Workspace for the content. What Workspace for the content. What
data tools do I need to leverage? data tools do I need to leverage?
A. Content Picker A. Content Picker
B. Apex Controller B. Apex Controller
C. UI API C. UI API
D. Both A and B D. Both A and B ✅
E. All of the Above E. All of the Above
Quiz #4
What sources can one connect using What sources can one connect using
data binding? data binding?
A. CRM data from standard objects A. CRM data from standard objects
B. CRM data from custom objects B. CRM data from custom objects
C. CMS data from content types C. CMS data from content types
D. All of the above D. All of the above ✅
Data Binding
10
have an image
Minutes
placeholder option.

Hands-On Exercise
circle below.
Branding
Components
for LWR Experiences
LWR Branding
Build Once and Reuse
LWR Declarative Branding
➔ Leverage the Salesforce

Design System CSS
Variables and our
point-and-click editor to
build swappable design
systems to power your
company’s brand.
➔ Update Color, Text, Spacing,

and Images.
➔ Create Color Palettes you

can apply to the whole site
or targetted sections
Branding Components
● How to update LWC branding

declaratively
● How to create Color Palettes for targeted
section styling
● How to leverage the SLDS and the
corresponding SDS and DXP variables to
brand components & sites
Branding Components
How to leverage DXP variables to brand components & sites
Map navigationMenu.css properties to Theme Panel Properties via

--dxp Styling Hooks
● Change background-color: var(—dxp-g-brand);

● Change font-color: var(—dxp-g-root-contrast);
● Change font-size: var(—dxp-s-html-font-size);
Review Brand Your LWR Site

Branding Components
How to leverage DXP variables to brand components & sites
navigationMenu.css
nav{
position: fixed;
Map navigationMenu.css properties to Theme top: 0;
Panel Properties via --dxp Styling Hooks left: 0;
width: 100%;
● Change background-color: var(—dxp-g-root); height: 100%;
height: 70px;
● Change font-color: var(—dxp-g-root-contrast);
background: var(--dxp-g-root);
● Change font-size: var(—dxp-s-html-font-size); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
z-index: 99;
}
.navbar .links li .sub-menu a{
color: var(--dxp-g-root-contrast);
font-size: var(--dxp-s-html-font-size);
font-weight: 500;
}
Review Brand Your LWR Site
How to leverage DXP variables to Brand
Components & Sites
10
have an image
Minutes
placeholder option.

Hands-On Exercise
circle below.
Quiz #5
Branding Components
What areas do we allow you to What areas do we allow you to

control declaratively in the Builder? control declaratively in the Builder?
A. Color A. Color
B. Text B. Text
C. Spacing C. Spacing
D. Images D. Images
E. All of the Above E. All of the Above ✅
Quiz #5
Branding Components
I want to create components that are I want to create components that are
reusable and easy to configure. How reusable and easy to configure. How
should I build my components? should I build my components?
A. Only use LWC properties for style A. Only use LWC properties for style
configurations configurations
B. Leverage SDS and DXP variables B. Leverage SDS and DXP variables
C. Use SLDS or base components as C. Use SLDS or base components as
much as possible much as possible
D. Both B and C D. Both B and C ✅
Call to Action
Experience Cloud Deliverables For 2021
Microsites & Landing Pages NEW!
Customer acquisition made easy with high-scale consumer

experiences via Lightning Web Runtime (LWR).
OOTB CDN and Lightning Web Runtime
CMS Connector for Email NEW!
Salesforce CMS integration with Marketing Cloud emails

for fast, personalized email creation
OOTB integration with Pardot (GA) and ExactTarget (Summer ‘21)
Mobile-First Experiences NEW!
Mobile-first experiences to help you build mobile web

experiences and mobile apps faster than ever before.
iOS/Android Native Navigation Bar, LWR support for Mobile Publisher and more
Microsites App (LWR)
Winter ‘22 Release (234)
Bundled with CMS Unlimited SKU

Features:
● Out of the box template built on LWR
● Header with navigation with ability to fix to top
● Contact/Subscribe Form that submits data to
Marketing Cloud Data Extensions
● Salesforce Lead Form
● CMS Layout Components (Banner, Tile)
● Base Components (Image, Video, Headline,
Text, Button…)
Leading with LWR vs. Aura
Guiding Principle: Balance Performance, Dev Resources, & Time-to-Market
Lead with LWR Lead with Aura
Public-facing sites w/ high scale & availability ✔

Custom portals and sites w/ CRM ✔
Personalization & Segmentation ✔ ✔
Consumer-focused w/ Interaction Studio CRM-based personalization not in LWR
Self-service Portals, Help Centers, & Search

[Knowledge - Summer ‘22]
[CRM + CMS Search - Summer ‘22]
✔
Knowledge pages not yet in LWR
Global Market Sites (languages other than EN-US) ✔ ✔

[Beta - Spring ‘22]
Mobile Publisher (iOS, Android) [Mobile Publisher - Summer ‘22] ✔

Mobile Publisher not yet in LWR
Portals with heavy business process

[OmniStudio - Summer ‘22]
[LWR Flows - Summer ‘22]
✔
Lightning Flows not yet in LWR
Peer-to-peer forums with heavy collaboration [Roadmap FY??] ✔

Requires custom rewrite of Chatter in LWR
Opportunities - Call to Action
for LWR Experiences
LWR for Custom Portals LWR for Marketing Websites

This is a technology shift. This is both a technology and
solution shift.
The goals here to apply the same great
CRM technologies to build performant, The goals here are to build a
scalable, brandable custom portals. CMS-forward approach to building
performant, scalable, brandable
marketing websites.
❏ Upcoming Enablement |
sfdc.co/experiencecloudpartnerenablement
Resources
❏ Stay on top of all Experience Cloud Enablement |
bit.ly/followrajrao
Accredited Professional
Credential, Partner
Resources, and
Upcoming Enablement
Recommended for:
Salesforce CMS Minimum

Experience
Preparation
Time Developer
Consultant
Designed for individuals who have broad knowledge of the Core Salesforce Platform capabilities,
knowledge, skills, and experience implementing Content Management Systems.
>1 yrs ~15 hrs
Architect
Learning Journey
BECOME ACCREDITED
KNOW THE EXAM SHARPEN YOUR SKILLS PREP AND STUDY
PROFESSIONAL
● Access Partner Learning Camp. Learn at your own pace: Get ready for your exam
● Explore the Exam Guide ● Complete the Build Websites and ● Review Exam Guide once more
(coming soon) Portals with Salesforce CMS ● Explore related resources
● Join the Official: Experience
● Complete the CMS for Marketing
Cloud Partners Partner
Community Chatter Group ● Complete the CMS for B2B Commerce
Exam Overview Related Resources Prerequisite
Here are examples of the concepts you should understand to pass the exam: ● How to join Partner Community ● Salesforce Admin Certification
● Salesforce CMS Basics. ● How to use PLC is Encouraged,
● Salesforce CMS App
but not Required
● Content Creation.
● Access to Partner Community.
● Content Organization & Administration..
● Content Syndication/ Integration.
● Advanced Topics.
Salesforce CMS
Allotted Passing
Total Questions
Time Score
40 70 min 70 %
Exam Outline
Salesforce CMS Basics | 11%
Salesforce CMS App | 14%

Advanced Topics | 8%
Content Creation | 30%

Content Syndication / Integration | 20%
Content Organization &

Administration | 17%
Recommended for:
Developer
MOBILE
Minimum Preparation
Experience Time Architect
Designed for individuals who have the knowledge, skills, and experience with building apps on
Android and iOS Mobile OSs using no-code, low-code, and pro-code methodologies.
>12 mth ~24 hrs
Learning Journey
BECOME ACCREDITED
KNOW THE EXAM SHARPEN YOUR SKILLS PREP AND STUDY
PROFESSIONAL
● Explore the Exam Guide Learn at your own pace: Get ready for your exam
● Join the Official: Platform for ● Complete the Mobile Curriculum in PLC ● Review Exam Guide once more
Partners Partner Community (having 7 courses) ● Explore related resources
Chatter Group
Exam Overview Related Resources Prerequisite
Here are examples of the concepts you should understand to pass the exam: ● Mobile SDK Docs ● None
● Customizing Salesforce Mobile App. ● Mobile Publisher Docs
● Creating branded mobile applications using Mobile Publisher ● Mobile Developer Center
● Building Lightning Web Components for Salesforce Mobile App. ● Mobile Security Docs
● Building Native, Hybrid, HTML5 Mobile App using the Salesforce SDK. ● Mobile App
● Understand how to utilize SmartStore to provide offline capabilities. ● Mobile Ready LWCs
● Understand the Mobile Application Management Add-Ons for Security and
Compliance enhancements. And how to manage Salesforce App Usage.
Partner Learning Camp (PLC)
1
3
2
4
5
6
1. Login to the Partner Community and click on the Learn Tab
2. Click on Start Learning under Partner Learning Camp
3. Click on Browse Catalog from Partner Learning Camp
4. Click on the Curriculum filter (left column) and then type in cms in the search field
5. Enroll in all CMS curriculums to learn and prepare for the CMS Accredited Professional Exam
6. Click on the Home tab to get started on your learning journey
Provide Your
Valuable
Feedback
SCAN ME
bit.ly/lwr_academy_jan2022_fb
Do you have a question?
Post your question in the Q&A section.
Feedback
bit.ly/lwr_academy_jan2022_fb

LWR Academy - January 2022

Uploaded by

Copyright:

Available Formats

You might also like

LWR Academy - January 2022

Uploaded by

Document Information

Original Description:

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

LWR Academy - January 2022

Uploaded by

Copyright:

Available Formats

LWR Academy for

Raj Rao Durgesh Dhoot

How do you ask a question?

Where can you get the presentation?

Will this be available as a recording after

1. Have you build any sites using

Best suited for developers, consultants, architects that have experience:

1. Sign up for a Developer Org

1. Sign up for a New dev org —

3. Click Verify Account button to set your Please place an image of

chance to set your password upon clicking

AI: Personalization, Recommendations, Search

Customer 360 Platform

✓ Prerequisite for high-scale

Salesforce Design System

Lightning Web Security

Lightning Web Components

Salesforce Design System

Lightning Web Runtime

Lightning Data Service

Lightning Web Security

Salesforce CRM (Sales, Service,

Build Your Own (LWR) Template Spring ‘21

Highly performant, developer-driven portals and sites

Summer ’21 Features

Enables fully custom ● Lightning Navigation

What type of components can be What type of components can be

Custom Navigation Menu LWC

Custom Search LWC

Custom Profile LWC

● How to enable Experience Cloud

How to Create a BYO (LWR) Template Spring ‘21

I’m no SKU or licensing expert but here’s my general advice:

○ Start Here: https://sfdc.co/LWRAcademyWorkbook Please place an image of

What is one feature unauthenticated What is one feature unauthenticated

Building Connecting Branding

➔ Components ➔ CMS Picker ➔ Colors

Theme Layouts Page Layouts Components

● How to build an LWC Theme Layout

Custom Navigation Custom

Data Elements of the Menu Item

// assign submenus as children of menu item @wire(getNavigationMenuItems, {

Which of the following requires a Which of the following requires a

Please place an image of

Pro Code No/Low Code

Review the custom LWC sldsHeroCarousel on your own

Review Learn how to eﬀectively use LWR sites

I want to build an LWC component I want to build an LWC component

Please place an image of

LWR Declarative Branding

➔ Leverage the Salesforce

➔ Update Color, Text, Spacing,

➔ Create Color Palettes you

● How to update LWC branding

Map navigationMenu.css properties to Theme Panel Properties via

● Change background-color: var(—dxp-g-brand);

Review Brand Your LWR Site

Please place an image of