Build Fast, Efficient Experiences with the LWC-Based Template (Developer Preview)

Where: This developer preview applies to communities accessed through Lightning Experience and Salesforce Classic in Developer editions.

Note

The Build Your Own (LWC) template is available as a developer preview in Developer orgs. Build Your Own (LWC) isn’t generally available unless or until Salesforce announces its general availability in documentation or in press releases or public statements. All commands, parameters, and other features are subject to change or deprecation at any time, with or without notice. Don't implement functionality developed with these commands or tools. You can provide feedback and suggestions for the template in the Lightning Web Runtime Communities group in the Trailblazer Community.

Why: The Build Your Own (LWC) template is based exclusively on the Lightning Web Components programming model and delivers unparalleled performance and page load speeds. Since the previous release, we made several enhancements, including:

• Flexible layouts for pages so you can adjust the spacing between columns in the same way as in Aura communities.
• New Tile Menu and Rich Content Editor components.
• Several limitations removed so that @salesforce modules can provide more consistent behavior between Aura and LWC communities. Referential integrity is supported—for example, you no longer must republish the community when a content asset name changes. Also, the following @salesforce modules are now supported:
  • @salesforce/community
  • @salesforce/messageChannel (Beta)

Tip

Build Your Own (LWC) is a minimal template that provides few components and only the most essential pages. So the template is best suited to developers who are comfortable developing Lightning web components and working with Salesforce DX, User Interface API, and Apex.

How: To start using the template, from Setup, enter Communities Settings in the Quick Find box, and then select Communities Settings. Select Enable the Build Your Own (LWC) template, and save your changes.

After you enable the template, it appears in the community creation wizard.

Important

For previous developer preview participants, you must reenable SLDS styling in the head markup of your community. Otherwise, the Rich Content Editor and flexible layouts enhancements don’t show correctly.

In Experience Builder, click Settings | Advanced | Edit Head Markup, and change all double-bracket expressions to single-bracket expressions.

For example, replace:

<link rel="stylesheet" href="{{ basePath }}/assets/styles/styles.css?{{ versionKey }}" />

With:

<link rel="stylesheet" href="{basePath}/assets/styles/styles.css?{versionKey}" />