Extract Parameters from URL to display Album

It is possible to extract the SharinPix URL which is assigned as a parameter. 

Structure of the SharinPix URL 

https://app.sharinpix.com/pagelayout/album_id?token=token_value
Click to copy

From the above sample,

  • The whole SharinPix URL is passed as a parameter url.
  • Within the SharinPix URL,
    • album_id represents the actual value of the album Id.
    • token_value represents the actual token value.

Get Parameters inside a Visualforce Page

  • The code snippet below shows how it is possible to use a merge-field to extract the url parameter inside a Visualforce Page. 
{!$CurrentPage.parameters.url}
  • The code snippet below shows that the extracted url parameter value can be assigned to the src attribute of an iframe html element  for displaying the SharinPix Album.
<apex:page >
    <iframe src="{!$CurrentPage.parameters.url}&annotate={! $CurrentPage.Parameters.annotation}" width="100%" height="500px">
    </iframe>
</apex:page>

Get Parameters inside Lightning Component

  • To extract the value of the parameter url inside the markup of a Lightning Component, you will need to define an aura:attribute  and assign its name attribute with the name of the parameter (in this case, the parameter is url). The type of the aura:attribute  is String.
<aura:attribute name="url" type="String"></aura:attribute>
  • To use the value of the extracted value, you will need to use the merge-field as shown below.
{! v.url }
  • The sample code below shows how the extracted value is used to display the SharinPix Album inside the markup of a Lightning Component.
<aura:application >
	<aura:attribute name="token" type="String"></aura:attribute>
    <iframe src="{! v.token }" width="100%" height="500px"></iframe>
</aura:application>

Retrieve SharinPix Parameters from a personalized URL

In the following example it will be shown how it is possible to launch SharinPix with the use of a personalized URL. To achieve the latter objective,  we will accomplish the following steps:

  • Obtain a SharinPix URL
  • Create a Visualforce Page that will display the SharinPix Album.
  • Create a custom link that will open the Visualforce Page in a new tab.

Obtain a SharinPix URL

  • The SharinPix URL should be in the following form:
https://app.sharinpix.com/pagelayout/album_id?token=token_value

Create a Visualforce Page for SharinPix Album

The following code corresponds to the Visualforce Page that will be implemented. (In this case, this Visualforce Page is named SharinPixParamsDemo).

<apex:page >
    <iframe src="{! $CurrentPage.Parameters.url }&fullscreen={! $CurrentPage.Parameters.fullscreen }" width="100%" height="500px" style="border: 0;"></iframe>
</apex:page>

The syntax {! $CurrentPage.Parameters.fullscreen }and {! $CurrentPage.Parameters.url } are used to extract the fullscreen and url parameter values respectively. 

  • Head over to an Object of your choice and create a new custom link.
  • Its Display Type is Detail Page Link.
  • Its Behaviour is Display in new window.
  •  Its Content Source is URL.
  • In the content editor of the custom link, insert the following URL:

/apex/SharinPixParamsDemo?fullscreen=true&url=https://app.sharinpix.com/pagelayout/album_id?token=token_value&

The above URL starts with /apex/SharinPixParamsDemo which indicates that it will access a Visualforce Page named SharinPixParamsDemo(as implemented previously) found in the current Salesforce organization. The url parameter value takes the SharinPix URL to display the SharinPix Album. The fullscreen parameter value is an arbitrary value (In this case, it is "true").

Personalize your own URL: The parameter fullscreen that takes as value true is only meant for illustrative purposes only. You can supply any parameters with the corresponding values of your own choice and use them in the Visualforce Page.

  • Next step: Add the custom link to the page-layout of the object.
  • Upon clicking on the custom link, the Visualforce Page displays the SharinPix Album and is able to read the parameter value for both url and fullscreen.