LWC Community Redirect to Home Not Working?
Question:
I am modifying an LWC component in a Salesforce Experience Cloud (Community) site to redirect users to the Home page when they click on a logo. The component’s HTML and JavaScript code are as follows:
CommunitySiteLogo.html
<template>
<img src={imgLogo} alt="" onclick={navigateToHomePage}>
</template>CommunitySiteLogo.js
import { LightningElement } from "lwc";
import { NavigationMixin } from 'lightning/navigation';
export default class CommunitySiteLogo extends NavigationMixin(LightningElement) {
imgLogo;
connectedCallback() {
const root = document.querySelector('html');
const logoPath = getComputedStyle(root).getPropertyValue('--dxp-s-site-logo-path');
this.imgLogo = logoPath;
}
navigateToHomePage(){
this[NavigationMixin.Navigate]({
type: 'comm__namedPage',
attributes: {
pagename: 'Home'
}
})
}
}When clicking the logo, the redirection does not work, and I encounter an error. What am I doing wrong?
Answer:
If your LWC component in a Salesforce Experience Cloud (Community) site fails to redirect users to the Home page, the issue may be with the navigation attributes. Ensure you use comm__namedPage with name: 'Home' instead of pagename, as incorrect attributes can cause errors. This fix allows proper redirection within the community, ensuring a smooth user experience. The issue is caused by using "pagename" instead of "name" in the attributes object.
Looking for premier Salesforce training in Pune? Join CRS Info Solutions for expert-led courses with real-world projects and a free demo session to elevate your skills!
The correct way to navigate to a named page in a community is:
navigateToHomePage() {
this[NavigationMixin.Navigate]({
type: 'comm__namedPage',
attributes: {
name: 'Home'
},
});
}Explanation:
The navigateToHomePage function uses Salesforce’s NavigationMixin to navigate to a named page within an Experience Cloud (Community) site. The type: 'comm__namedPage' ensures that the navigation targets a specific community page, and the attributes object specifies the destination using name: 'Home', which must match the exact API name of the Home page. This corrects the original issue, where pagename was mistakenly used instead of name, ensuring that the redirection works as expected.
Kickstart Your Salesforce Career with Expert Training in Pune
Ready to advance your career in Salesforce? CRS Info Solutions in Pune offers top-tier Salesforce training, designed to provide you with the skills necessary for success in the Salesforce ecosystem. Our courses cover Salesforce Administration, Development, and AI, blending expert instruction with hands-on project work.
Whether you’re a beginner or looking to enhance your expertise, Salesforce training in Pune our program, led by experienced professionals, prepares you to tackle real-world challenges. We emphasize practical learning, personalized mentorship, and offer key resources, including study materials, certification coaching, and interview preparation.
Start your Salesforce career journey today—register for a free demo session and take your first step toward becoming a Salesforce expert!!!
Related Links:
