< Back to List
Fix <apex:slds/> error in Lightning Community Builder preview
It seems a bug of Salesforce that the <apex:slds/> cannot get correct CSS in Lightning Community Builder preview window.
Create a Visualforce page with <apex:slds/> to use Lightning Design System. Remeber to check the option "Available for Lightning Experience, Lightning Communities, and the mobile app". Sample code:
<button class="slds-button slds-button_brand">Button</button>
</apex:page>Create a new Community with "Customer Account Portal" template. Click the "Builder" in "My Workspaces" to open "Community Builder".Drag "Visualforce Page" from the "Components" toolbox to the page content. Select the test page that created in step 1 to display. The page is displayed in preview, but the SLDS css is not applied. In web browser console there are some errors like: GET https://*.ap6.force.com/sfsites/c/slds/css/p0AH6DGyOYR6OPvocxLUHg/min/scoped/one:oneNamespace,force:sldsTokens,force:base,force:formFactorLarge/slds.css net::ERR_ABORTEDIf you publish the community and view it, it is ok. Only the preview UI is broken.
We want this fix, because our product is a Visualforce component based on SLDS, and the customers want to use it in Conmunity Builder. But this problem caused the UI confused and customer feels bad.
The Landmark © One Market St.,
San Francisco, CA 94105
If you can't find what you're looking for,
contact Salesforce Customer Support.
Powered by Community Cloud.
Learn More >
Help us to keep IdeaExchange clean by pointing out overlapping ideas. We'll investigate your suggestion and merge the ideas if it makes sense.
Thanks for your merge suggestion. We will review it shortly and merge the ideas if applicable.
Salesforce takes abuse situations very seriously. Examples of abuse include but are not limited to posting of offensive language or fraudulent statements. To help us process your request as quickly as possible, please fill out the form below describing the situation. For privacy and security reasons, the final outcome of an abuse case may not be revealed to the person who reported it.
Thank you for your feedback. We take abuse seriously and will investigate this issue and take appropriate action.