function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Max PaqMax Paq 

What is the best way to implement a lightning component in a community

Hello everyone,

I need to have my lightning components work in a Salesforce community, both on the desktop and SF1 app and I was wondering if anyone had any insight on what was the best way to implement this. My community is a Salesforce Tab+visualforce page community. In this community type, does all lightning components need to be in a Visualforce page?


 
Best Answer chosen by Max Paq
James LoghryJames Loghry
You simply need to add implements="forceCommunity:availableForAllPageTypes" to your apex:component tag.  This attribute lets community builder know that you'd like to add this lightning component to your communities template(s).

You may need to do special work to get styles, static resources, and svg icons to work if needed, but other than that they work well with communities.

All Answers

James LoghryJames Loghry
You simply need to add implements="forceCommunity:availableForAllPageTypes" to your apex:component tag.  This attribute lets community builder know that you'd like to add this lightning component to your communities template(s).

You may need to do special work to get styles, static resources, and svg icons to work if needed, but other than that they work well with communities.
This was selected as the best answer
Max PaqMax Paq

Thanks James, I tried that but does this work for Salesforce tab+Visualforce communities? After I create my component and use the  
implements="forceCommunity:availableForAllPageTypes tag I cannot use this component in the app builder, and I do not know where to add it to my community.

And do you mean aura:component tag?

James LoghryJames Loghry
Yes,I meant the the aura:component tag.

The app builder and community builder both need different interfaces.  Same with simply adding the component into SF1 itself.  In order to cover the whole gammet, try the following:

implements="flexipage:availableForAllPageTypes,force:appHostable,forceCommunity:availableForAllPageTypes"

 
Max PaqMax Paq
Thanks James,

I was able to use your suggestion to put the component in the SF1 app version of my community.

Right now it seems like I cannot use the same tab/page to work in the desktop and mobile version of my community. I guess I will just maintain a VF page for the desktop and use the lightning page for SF1.

You keep answering all my lightning components questions. DO you happen to blog about this stuff?