🛠️ How to Replace the Salesforce Logo with Your Company Logo on the Portal Reset Password Page

---

If you’re struggling to replace the default Salesforce logo on your Experience Cloud (Community/Portal/B2B LWR) reset password page with your own branding, you’re in the right place.

This guide will walk you through the process step-by-step using VS Code and Salesforce DX.

---

✅ Step 1: Retrieve Metadata from Salesforce Orgs

First, retrieve the NetworkBranding metadata from your Salesforce org.

Create or update your package.xml with the following content:

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<Package xmlns="http://soap.sforce.com/2006/04/metadata">
    <types>
        <members>*</members>
        <name>NetworkBranding</name>
    </types>
    <version>63.0</version>
</Package>

Run the retrieve command from the terminal:

---

📁 Step 2: Replace the Branding Image

Once the metadata is retrieved:

1. In VS Code, right-click on the folder representing your portal (e.g., TestPortal) and choose “Reveal in File Explorer” or “Reveal in Finder”.
2. Inside, you’ll see two files:
   • TestPortal.xml
   • TestPortal.networkBranding
3. Copy your logo (e.g., logo.png) to this folder.
4. Delete the file named TestPortal.networkBranding.
5. Rename your pasted logo file to exactly: TestPortal.networkBranding
   (keep the original .networkBranding extension).

---

✏️ Step 3: Update Branding XML

Open the XML file (e.g., TestPortal.xml) and edit the branding settings like so:

<?xml version="1.0" encoding="UTF-8"?>
<NetworkBranding xmlns="http://soap.sforce.com/2006/04/metadata">
    <loginFooterText>Your Company Name</loginFooterText>
    <loginLogo>TestPortal.png</loginLogo>
    <loginLogoName>logo</loginLogoName>
    <loginPrimaryColor>#1797C0</loginPrimaryColor>
    <loginQuaternaryColor>#FFFFFF</loginQuaternaryColor>
    <network>Your Community Name</network>
    <primaryColor>#1797C0</primaryColor>
    <primaryComplementColor>#FFFFFF</primaryComplementColor>
    <quaternaryColor>#FFFFFF</quaternaryColor>
    <quaternaryComplementColor>#222222</quaternaryComplementColor>
    <secondaryColor>#51606E</secondaryColor>
    <tertiaryColor>#DDE4E9</tertiaryColor>
    <tertiaryComplementColor>#222222</tertiaryComplementColor>
    <zeronaryColor>#51606E</zeronaryColor>
    <zeronaryComplementColor>#FFFFFF</zeronaryComplementColor>
</NetworkBranding>

Make sure the <loginLogo> and <loginLogoName> match your logo file name.

---

🚀 Step 4: Deploy the Changes

Use the deploy command to push your updated branding to Salesforce:

---