Dreamforce 2016: Build Your Donor Community: Integrating NPSP to Your Online Presence

Download Dreamforce 2016: Build Your Donor Community: Integrating NPSP to Your Online Presence

Post on 12-Apr-2017

163 views

Category:

Technology

1 download

TRANSCRIPT

Salesforce - Corporate Presentation Template

Build Your Donor CommunityIntegrating NPSP to Your Online PresenceChris EalesChief ArchitectBrightGenchriseales@brightgen.com@theEalesie

#DF16

#DF16Chris EalesChief Architect, BrightGen

#DF16

#DF16

IntroductionFrom hereFrom here, or hereFrom here, or here, to here

#DF16Power of Community BuilderTools used in this demo

Non-Profit Success Pack

Salesforce Community BuilderNapali Template

BrightGiving ComponentsBrightGiving_CampaignDonation Lightning ComponentOpportunity Online Contact Custom FieldsCreate Contact Process Builder Flows

Asperato Payment Gateway Platform

Online donations in twenty minutes

#DF16DemoLets build our community

#DF16

#DF16Questions

#DF16

#DF16

thank y u

#DF16

#DF16Hands on

#DF16

#DF16Hands onBuild your own communityHands on steps Login to Developer Org

Login to Developer Org at: https://login.salesforce.comUsername: handson@communitydemo.orgPassword: CommunitiesRock

#DF16

Hands onBuild your own communityHands on steps Campaign Configuration

Create a New Campaign LayoutSetup >> Search Campaign >> Select Page Layouts Select Edit against an existing layout [ Sample Online Layout ] >> Select Save As >> Provide a Page Layout Name remember this as you will need it laterModify layout by adding / removing fields you want visible in the Community and Save the layout

#DF16

Hands onBuild your own communityHands on steps Campaign Configuration

Create a New Campaign List ViewAccess Campaigns Tab and create a new List ViewGive the new view a nameSelect filter criteria to restrict to the Campaigns want visible in the Community [ parentId = 7015800000010Qh ]Select the fields you want visible in the Community [ Campaign Name, Start Date, End Date, Total Value Won Opportunities ]Set Visibility to all users

#DF16

Hands onBuild your own communityHands on steps Community Setup

Activate a CommunitySetup >> Search Communities >> Select All CommunitiesClick New Community buttonChoose Napili TemplateProvide Community Name and URL suffix Note down the URL Suffix as you will need this later to view your communityClick Create Community

#DF16

Hands onBuild your own communityHands on steps Community Setup

Community Management SettingsSelect Administration >> Preferences Menu and within the General sectionAllow public access to ChatterClick Save

#DF16

Hands onBuild your own communityHands on steps Community Setup

Force.com Site ConfigurationNavigate to the Force.com Site Setup from the Community Management drop down menuClick the Public Access Settings button

#DF16

Hands onBuild your own communityHands on steps Community Setup

Force.com Public Access SettingsNavigate to the Page Layouts sectionSet Campaign Page Layout to be the layout you created earlierNavigate to the Record Type Settings sectionUpdate Opportunities Record Type so that only Online Donation is availableForce.com Site Setup from the Community Management drop down menu

#DF16

Hands onBuild your own communityHands on steps Community Setup

Force.com Public Access SettingsEdit the profile and navigate to Object Permissions and setAccounts / Contacts / Opportunities Read and CreateCampaigns ReadPayments Read, Create and EditSave the changes

#DF16

Hands onBuild your own communityHands on steps Community Setup

Community Builder - Edit Navigation BarFrom Setup search Communities >> Select All Communities >> Select Builder against your new CommunityOnce in the Community Builder select Page Editor icon from the left navigation menuSelect Navigation Bar within the Page Editor sectionSelect Edit Navigation Menu from within the Property Editor section

#DF16

Hands onBuild your own communityHands on steps Community Setup

Community Builder - Edit Navigation MenuClick Add Menu Item button and fill out the formName - Our CampaignsType - Salesforce ObjectObject Type - CampaignDefault List View - Select the list view created earlierPublicly available - TruePublish ChangesClick Publish Changes buttonSelect OK in Publish Changes Now dialog box

#DF16

Hands onBuild your own communityHands on steps Community Setup

Community Builder - New Campaign PageSelect Page Editor icon from the left navigation menuClick New Page IconSelect Create Object PagesSelect Campaign object in the New Object Pages dialog boxClick Create buttonSelect Campaign Detail from Object Pages ListClick Edit button

#DF16

Hands onBuild your own communityHands on steps Community Setup

Community Builder - Edit Campaign Page LayoutSelect Change Layout from Property EditorSelect 2 columns with a 2:1 ratio in the Change Layout dialog boxClick change button

#DF16

Hands onBuild your own communityHands on steps Community Setup

Community Builder - Edit Campaign Details SectionSelect Record Information Tabs from the Page Editor sectionNote the page layout matches that set for your logged in user, not what we have assigned to the Public profileUpdate the Record Information Tabs properties in the Property Editornote changes are automatically applied and savedSet Tab 2 Type to NoneSet Tab 3 Type to None

#DF16

Hands onBuild your own communityHands on steps Community Setup

Community Builder - Add BrightGiving Campaign Payment Lightning ComponentScroll the Lightning Component section down to Custom ComponentsScroll the Page Editor section to the empty Sidebar regionDrag the BrightGiving_CampaignDonations lightning component into the empty Sidebar region

#DF16

Hands onBuild your own communityHands on steps Community Setup

Community Builder - Branding - LogoSelect Branding Editor icon from the left navigation menuSelect Company Logo component within the Branding Editor section to upload a logoSelect a local image to use as the company logo

#DF16

Hands onBuild your own communityHands on steps Community Setup

Community Builder - Branding - Color SchemeSelect Upload an image to generate a new palette from the Branding Editor sectionClick Use Company Logo button to Generate a PaletteUpdate Action Color to match Link Color

#DF16

Hands onBuild your own communityHands on steps Community Setup

Community Builder - Branding - Custom CSSSelect Edit Custom CSS from the Branding Editor sectionAdd the following CSS (using your preferred color schemes) and click Save button/* Control the background color of the Header Panel */.default-bg-overlay { background: white none repeat scroll 0 0 !important;}/* Control the background color of the Navigation Bar */.siteforceNapiliBody .cNavBarCon { background-color: #696969;}

#DF16

Hands onBuild your own communityHands on steps - Publish and Preview

Community - PublishSelect the Publish Button from with the Community BuilderSelect Got It from the Publish Your Community dialog boxCommunity - PreviewOpen a new browser and access your newly created communityhttps://brightgiving-df17-demo-developer-edition.eu6.force.com/livedemoNote: replace live demo with the URL suffix used during the initial community setupBrowse to a campaign and complete donation form

#DF16

Hands onBuild your own communitySee Results

Salesforce New OpportunityReturn to the Salesforce Developer OrgSearch Campaign you donated toBrowse the Campaign detail recordSee your new Donations in the Opportunities related list

#DF16

LayoutsThe following slides are the basic, default layout options built into the template

#DF16

#DF16Basic LayoutFirst level text is set at 20 point Arial and does not have a bulletSecond line bullets are 18 point ArialThird level text is set at 16 point ArialLimit the number of bullets on a slideFourth level textHow to Create a Paragraph HeadingUse the same Basic Layout and remove second line bullet from sentenceSpacing of ParagraphsThe spacing between paragraphs is automatically set

Subtitle placeholder 24 points

#DF162-Column Gray LayoutEither of these placeholders can hold text, table, charts, smart art, or media.Either of these placeholders can hold text, table, charts, smart art, or media.

Subtitle placeholder

#DF163-Column GrayThese three placeholders can hold text, table, charts, smart art, or media.These three placeholders can hold text, table, charts, smart art, or media.These three placeholders can hold text, table, charts, smart art, or media.

Subtitle placeholder

#DF16Lorem ipsum dolor sit amet, consecteturCras egestas mauris ut faucibs cursusPellentesque et risus ac turpis maximusLorem ipsum dolor sit amet, consecteturCras egestas mauris ut faucibus cursusPellentesque et risus ac turpis maximusLorem ipsum dolor sit amet, consecteturCras egestas mauris ut faucibus cursusPellentesque et risus ac turpis maximusContentContentContentSubtext placeholderSubtext placeholderSubtext placeholder3-Column With TitlesSubtitle placeholder

#DF16ContentLorem ipsum dolor sit amet, consecteturCras egestas mauris ut faucibus cursusPellentesque et risus ac turpis maximusLorem ipsum dolor sit amet, consecteturCras egestas mauris ut faucibus cursusPellentesque et risus ac turpis maximusLorem ipsum dolor sit amet, consecteturCras egestas mauris ut faucibus cursusPellentesque et risus ac turpis maximusContentContentContentLorem ipsum dolor sit amet, consecteturCras egestas mauris ut faucibus cursusPellentesque et risus ac turpis maximusSplit 4-Column Layout

#DF16

#DF16Vertical Split LayoutSubtitle placeholderLorem ipsum dolor sit amet, consecteturCras egestas mauris ut faucibus cursusPellentesque et risus ac turpis maximus

#DF16

Photo Content LayoutSubtitle placeholderLorem ipsum dolor sit amet, consecteturCras egestas mauris ut faucibus cursusPellentesque et risus ac turpis maximus

#DF16

Third Split LayoutText, images, charts, tables can be put in this placeholder.Subtitle placeholder

#DF16Use the stage for highlighting devicesStage Content Panel LayoutPlaceholder text

#DF16

#DF16

Third Split 2 LayoutText, images, charts, tables can be put in this placeholder.Subtitle placeholder

#DF16

I believe that this is a quote for everyone.Person, Organization

Story Slide with QuoteBullets are set in 20 point Arial

Industry: Text Segment: Text

#DF16

#DF16Basic Dark LayoutThis slide is made for easy layout of text, charts, tables, images, and other mediaFirst level text is set at 20 point ArialSecond line bullets are 18 point ArialThird level text is set at 16 point ArialLimit the number of bullets on a slideFourth level textFifth level text for text sourcingExample of subtly highlighted textExample of boldly highlighted textSubtitle placeholder

#DF16

#DF16Segue/DividerSubtitle placeholder

#DF16

#DF16Example of a TableTable title or slide subtitle

Intro heading textKey takeaway text here, table title text hereSome additional detail text. If this table is presented in large room, do not use this chart, because it will be too smallto read. If this is going to be presented online or other personal presentation space, this text is as small as it should go.Column title, can be multi-lineColumn title, can be multi-lineColumn title, can be multi-lineRow titleLorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse congue turpis maximus dignissim posuere.Quisque sit amet justo ultrices, finibus massa eu, vehicula dui.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse congue turpis maximus dignissim posuere.Quisque sit amet justo ultrices, finibus massa eu, vehicula dui.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse congue turpis maximus dignissim posuere.Quisque sit amet justo ultrices, finibus massa eu, vehicula dui.Row titleLorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse congue turpis maximus dignissim posuere.Quisque sit amet justo ultrices, finibus massa eu, vehicula dui.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse congue turpis maximus dignissim posuere.Quisque sit amet justo ultrices, finibus massa eu, vehicula dui.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse congue turpis maximus dignissim posuere.Quisque sit amet justo ultrices, finibus massa eu, vehicula dui.

#DF16Example of a TableTable title or slide subtitleColumn titleColumn titleColumn titleRow titleLorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse congue turpis maximus dignissim posuere.Quisque sit amet justo ultrices, finibus massa eu, vehicula dui.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse congue turpis maximus dignissim posuere.Quisque sit amet justo ultrices, finibus massa eu, vehicula dui.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse congue turpis maximus dignissim posuere.Quisque sit amet justo ultrices, finibus massa eu, vehicula dui.Row titleLorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse congue turpis maximus dignissim posuere.Quisque sit amet justo ultrices, finibus massa eu, vehicula dui.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse congue turpis maximus dignissim posuere.Quisque sit amet justo ultrices, finibus massa eu, vehicula dui.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Suspendisse congue turpis maximus dignissim posuere.Quisque sit amet justo ultrices, finibus massa eu, vehicula dui.

#DF16Column titleColumn titleColumn titleRow titleLorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Row titleLorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Row titleLorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Row titleLorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Row titleLorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Example of a TableTable title or slide subtitle

#DF16Example of a TableColumn titleColumn titleColumn titleRow title$00.00$00.00$00.00Row title$00.00$00.00$00.00Row title$00.00$00.00$00.00Row title$00.00$00.00$00.00Row title$00.00$00.00$00.00

Table title or slide subtitleSource: placeholder

#DF16

#DF16

Graphic Assets

#DF16

#DF16Mobile Phones and WatchesDevices are to scale in relationship to one another, use this slide as a reference

iPadAir Vertical 2iPhone6Galaxy 6 Apple Watch

iPadAir Horizontal 2LG3

#DF16Computers

Macbook Pro Retina Display(Browser bar is removable)Thunderbolt Monitor for Desktop(Browser bar is removable)

#DF16

Salesforce.org LogoVertical stacked (Primary)

#DF16In colorSalesforce Brand Extension Logos

#DF16Salesforce Brand Extension LogosIn white

#DF16

#DF16In colorAdditional Logos

#DF16Additional LogosIn white

#DF16

#DF16

Salesforce1 Logos

#DF16The Power of Community BuilderFrom here to there

#DF16