Customize Your Site

Make It Look Good

Much like a beach-goer needs some trendy shades and a cool sun hat, the Ursa Major Solar partner site needs an Ursa Major Solar look. In this step, add a company logo, adjust the layout, and create a new audience variable. 

  1. Download this image for use in this project.
  2. From Service Setup, enter All Site in the Quick Find box and select All Sites.
  3. Click Builder to the left of Ursa Major Solar Partner Site.
    Note: If necessary, click the x to close the Welcome to Experience Builder pop-up.
  4. Click the Theme icon Theme icon then click Colors to expand the colors menu.
  5. Click the color circle to the right of Action Color.
  6. Delete the current rgb value and replace it with rgb(47, 151, 55).
  7. Click < to the left of Colors to collapse the Colors menu.
  8. Click Images to expand the images menu.
  9. Click Upload Image Upload an image icon under Company Logo.
  10. Click Upload Image.
  11. Select the PartnerLogo.png file you just downloaded, and click Open.
  12. Click Preview to see your changes.
  13. Click Back to Builder.

Customize the Page Layout

Continue the customizing by adjusting the layout of the Home Page.

  1. In Experience Builder, click the Business Summary tab to select the Tabs component (under the geometric purple and blue image).
  2. From the Tabs menu on the right, click the next to Business Summary to remove this tab.
  3. Click Delete.
  4. Click to close the Tabs menu.
  5. Scroll down and select the My Opportunities component.
  6. From the Record List menu, select All Opportunities under Filter Name.
  7. Click X to close the Record List.
  8. Click and drag the All Opportunities component to the bottom of the News & Updates component.
    Note: A green box appears around the News & Updates component to assist in component placement.
  9. Click Preview to see your page layout changes.
    Preview of partner community
  10. Click Back to Builder.

Add a Lightning Component

Next, create a new Lightning Component that will be applied to a specific segment of members.

  1. In Builder, click the Components icon Components icon.
  2. Search Rich Content Editor.
  3. Click and drag the Rich Content Editor component to the top of the Quick Create button to place the Content Editor component above the Quick Create button.
    Note: A green box will appear around the Sidebar component to assist in component placement.
  4. From the Rich Content Editor menu, click Edit Content.
  5. Delete the existing text and replace with Alert: High winds are expected for your area. Please notify your customers to ensure their solar panels are firmly secured.
  6. Click Preview to see your new component.
    Preview of partner community with Lightning Component.
  7. Click Back to Builder.

Create New Audiences

Audiences are sets of criteria used to define site member segments. The Audience features keeps members engaged by offering them personalized, relevant content. Audiences can be assigned to specific components, pages, and more. 

  1. Click the Alert: High winds... component that was just added.
  2. From the Rich Content Editor menu, click the down arrow to the right of the menu title.
  3. Click Assign.
    Assign button for the text component.
  4. Click New Audience.
  5. Enter San Diego as the Audience Name.
  6. In the Audience Criteria section, ensure All Conditions Are Met is selected.
  7. Click in the Select Criteria Type… text box and select User, then select City.
    San Diego
    Note: Press Enter after keying in the city name

    New audience set up for San Diego audience.
  8. Click Save (not Save & Assign, there’s more work to do).
  9. Click Assign.
  10. Click New Audience.
  11. Enter sForce as the Audience Name.
  12. In the Audience Criteria section, ensure All Conditions Are Met is selected.
  13. Click in the Select Criteria Type… text box and select User, then select Company Name.
    Note: Press Enter after keying in the company name
  14. Click Save (not Save & Assign).
    Note: This audience will be assigned later in this project.
  15. Click Done.
    Note: If not already selected, click to select the the high wind alert component. It should now be highlighted in purple. This signifies that the component is only visible to specific audiences.
    Screenshot of high wind component highlighted in purple.
  16. Click Publish.
  17. On the Publish confirmation screen, click Publish, then Got It.

See the Audience Feature in Action

Time to test the adjustments. Do the new sunglasses and sun hat look good? 

  1. Click the Settings icon Community settings iconfrom the menu on the left.
  2. From the General menu, click the Published URL under Published Status to see the new published site. You will not see the high winds alert text component as “San Diego” has not been designated as your (admin) mailing address city.
    Note: If you see a Salesforce login screen, click Are you an employee? Login here and you will be directed to the published site. The login screen will not appear again when accessing this published site.
  3. Click the down arrow next to your name.
    Arrow next to your name highlighted.
  4. Select My Profile.
  5. Click Edit.
  6. Update the City listed in your profile to San Diego.
  7. Click Save.
  8. Click the Home tab.
    Note: The high winds alert message should now be visible. If not, refresh the pageScreenshot of high winds alert appearing.

You’ve been busy! You added some branding to the Ursa Major Solar site, adjusted the page layout, and successfully created a new Lightning Component that only appears for users in the San Diego service area. In the next step, continue using the Audience feature to add a page variation to your site.