# Using SharinPix in Salesforce Community

This article demonstrates how to:

* [Enable the usage of SharinPix in Salesforce Community](#enable-the-usage-of-sharinpix-in-salesforce-community)
* [Add the SharinPix Album component to Community home page](#add-the-sharinpix-album-component-to-a-community-home-page)
* [Add a SharinPix album to Community record page](#add-the-sharinpix-album-to-a-community-record-page)

{% hint style="warning" %}
**Prerequisites:**

Salesforce Communities should be enabled on your organisation.
{% endhint %}

## Enable the usage of SharinPix in Salesforce Community

To enable the usage of SharinPix in Salesforce Community, a **CSP Trusted Site** entry has to be added for SharinPix. To do so, follow the steps below:

1\. Go to **Setup**. Enter **CSP** in the **Quick Find Box**.

2\. Under **Security**, select **CSP Trusted Sites**.

3\. Then, click on **New Trusted Site** as shown below:

![](https://2221230591-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5EvYRrLbUyvRh8o1jmMG%2Fuploads%2FmxnV41ycp4JtYy4uoEge%2Fimage%20\(76\).png?alt=media\&token=8b442ac9-0408-4271-88cc-4c044dd5feed)

You will be directed to the page below:

![](https://2221230591-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5EvYRrLbUyvRh8o1jmMG%2Fuploads%2Fl61C6IJgaLceIh8c7Whn%2Fimage%20\(77\).png?alt=media\&token=1baab14f-53a7-48f5-bd46-31ab28f93421)

4\. For the field **Trusted Site Name** , enter **SharinPix**

5\. For the field **Trusted Site URL** , enter **<https://app.sharinpix.com>**

![](https://2221230591-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5EvYRrLbUyvRh8o1jmMG%2Fuploads%2FbW6OKVTQelUKzzKtLeOc%2Fimage%20\(78\).png?alt=media\&token=e05f8666-7c58-4036-97f9-acc8bc0ec36d)

6\. Then, click on **Save**

7\. Next, repeat steps 3 to 6 to create new trusted sites using the following SharinPix endpoint URL as the **Trusted Site URL**: **<https://p.sharinpix.com>**

## Add the SharinPix Album component to a Community home page

To add a SharinPix Album component to a Community Home Page, follow the steps below:

* Go to **Setup** , then enter **Communities** in the **Quick Find Box**
* Under **Communities**, select **All Communities**
* Click on **Builder** next to the **Community** you intend to modify

![](https://2221230591-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5EvYRrLbUyvRh8o1jmMG%2Fuploads%2F9CDkoons5GzxrOKqXccn%2Fimage%20\(79\).png?alt=media\&token=6f2c02c1-bb77-4f7d-a339-97feb1977aae)

* Once inside the **Builder,** select the **Components** menu from the home page. Then, scroll down to the **Custom Components** section
* Drag and Drop the **SharinPix Album** component onto the desired region

![](https://2221230591-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5EvYRrLbUyvRh8o1jmMG%2Fuploads%2FQ1FyIhaMzk33eByHdLrQ%2Fimage%20\(80\).png?alt=media\&token=f501f157-7565-4a2e-a2e8-8cd4abcc0eb8)

* To display images on the SharinPix Album, you will need to supply a record Id in the **AlbumId** field available in the component's property editor. The SharinPix Album will then display all the images corresponding to that record

![](https://2221230591-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5EvYRrLbUyvRh8o1jmMG%2Fuploads%2FMiiXsFlyjALxGcjCXRUL%2Fimage%20\(81\).png?alt=media\&token=5aa1087f-f796-4e62-ba59-fd72b1dca729)

![](https://2221230591-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5EvYRrLbUyvRh8o1jmMG%2Fuploads%2FHKmZsl9rHAnb1BYLOCxk%2Fimage%20\(82\).png?alt=media\&token=a24b2a52-4451-498b-b79d-d26ee27b8f4e)

Make sure to publish the community in order to make the changes visible to your given audience.

## Add the SharinPix Album to a Community record page

There are two ways of adding a SharinPix album to a Community record page:

1. By either adding the SharinPix Album lightning component to the record page
2. Or by adding a Visualforce page embedding a SharinPix album component to the record page

{% hint style="warning" %}
**Note:**

If you intend to use a Salesforce object on a Community, you should ensure that proper access rights has been given to the object so as to view the records.
{% endhint %}

### Add the SharinPix Album component to a Community record page

To add the SharinPix Album to the Community record page:

* Edit the record page in **Builder** mode
* From **Components**, find the **SharinPix Album** component under the **Custom Components**
* Drag and drop the **SharinPix Album** component onto the desired region on the record page

The result should be as follows:

![](https://2221230591-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5EvYRrLbUyvRh8o1jmMG%2Fuploads%2Fq9ACtfRz9nSaSS03HvMZ%2Fimage%20\(83\).png?alt=media\&token=46119b41-e070-40df-b121-df37a1119839)

### Add a Visualforce page embedding a SharinPix album to the record page

It is possible to add a Visualforce page containing a SharinPix album on a Community record page. To do so:

* Implement a Visualforce page embedding the SharinPix album. You can use the code snippet below for this implementation:

```html
<apex:page standardController="Account">   
    <sharinpix:SharinPix height="500px" 
		parameters="{
        	'Id': '{!CASESAFEID($CurrentPage.parameters.Id)}', 
            'abilities':{
            	'{!CASESAFEID($CurrentPage.parameters.Id)}':{
                'Access': {
                	'image_upload':true,
                    'image_list':true,
                    'see':true,
                    'image_delete':true
                    }
				}
			}
		}"
	/> 
</apex:page>
```

* Once your Visualforce page is ready, go ahead and edit the desired record page in **Builder** mode
* From **Components** , drag and drop the **Visualforce Page** found under the **Content** section onto the desired region on the record page
* In the component's property editor, make sure that the field **Record ID** has **{!recordId}** as value

![](https://2221230591-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5EvYRrLbUyvRh8o1jmMG%2Fuploads%2FexdZ1aYMuRyXNchGAFgb%2Fimage%20\(84\).png?alt=media\&token=e40cbe16-af1e-407d-8b65-c3139d4912fa)

The result should be as follows:

![](https://2221230591-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5EvYRrLbUyvRh8o1jmMG%2Fuploads%2FQLen0q0iOuIOR0A8jMGa%2Fimage%20\(85\).png?alt=media\&token=136d41ed-89d9-4314-9fb2-8d760d99b687)

{% hint style="info" %}
**Information:**

If a Visualforce page embedding a SharinPix album is already present on an object's page layout, the Visualforce page will also be visible in the **Details** section of the corresponding records inside a Salesforce Community.

The screenshot below depicts an Account record's **Details** section with a Visualforce page embedding the SharinPix Album component:
{% endhint %}

![](https://2221230591-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5EvYRrLbUyvRh8o1jmMG%2Fuploads%2F9M5zIziL8C9oWWEtSMbY%2Fimage%20\(86\).png?alt=media\&token=76e43e2b-821f-43b9-a84e-c84aa52f2962)

![](https://2221230591-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5EvYRrLbUyvRh8o1jmMG%2Fuploads%2FuJCsx1IrhtwIjTcSjrAh%2Fimage%20\(87\).png?alt=media\&token=ffc4c851-cee1-4a71-85b4-d91cfb802511)

{% hint style="success" %}
**Tip:**

Community users do not have all access rights to SharinPix by default.

If you encounter issues regarding Community users not having proper access to the SharinPix Image Sync or SharinPix components, please refer to the following article:

[SharinPix Community users access rights](https://docs.sharinpix.com/documentation/access-and-security/sharinpix-community-users-access-rights)
{% endhint %}