This guide will walk you through the process of configuring a "Related Jira Issues" view on Salesforce.
The resulting Visualforce section will only show issues associated using the Remote System Reference method.
Does the Related JIRA Issues section appear blank?
There is an issue regarding newer browsers which may render the Related Jira Issues section blank.
If you encounter this problem, consult this Knowledge Base article: Related Jira Issues May Appear Blank.
Introduction to Visualforce pages
In some situations it would be useful to view the associated Jira issues for a particular Salesforce object from inside Salesforce itself. Using a concept in Salesforce called Visualforce pages, we can add a new section onto the object's page layout that displays these associated Jira issues. The high level steps are:
Creating a Visualforce section.
Adding the Visualforce section to the Object's Page Layout page.
To avoid issues with empty Salesforce-Jira Search Results:
Please make sure cookies are enabled.
Please make sure that you are logged in to Jira with the Remember my log in on this computer option checked on the log in page.
Visualforce pages require some markup to be added and as such they can be flexible. For our purposes we will keep it simple. The markup we will use follows the format:
<apex:page standardController="<SALESFORCE_OBJECT_NAME>"> <apex:iframe id="JiraWindow" src="<Jira_FETCH_URL>"></apex:iframe> </apex:page>
The Jira_FETCH_URL mentioned above can be found by copying the URL from the "Fetch" Endpoint and replacing the bolded section of the URL with the correct syntax for your object.
For example, a Salesforce Case reference will look something like:
<apex:page standardController="Case">
<apex:iframe id="JiraWindow" src="http://my.Jira.com/plugins/servlet/customware/connector/issue/2/Case/fetch.action?id={!Case.Id}"></apex:iframe>
</apex:page>
Creating a new Visualforce page
Lightning Experience
You will need to get the correct Jira URL first by copying the URL from the "Fetch" Endpoint and replacing the bolded section of the URL with the correct syntax for your object.
Go to > Setup.
Search for "Visualforce Pages" then click on the Visualforce Pages menu item.
Click the New button to create a new Visualforce page for Jira issues.
A form will appear for you to enter details of the new Visualforce page.
You can name it anything you wish. Add in the Visualforce markup from above
For example:
<apex:page standardController="<SALESFORCE_OBJECT_NAME>"> <apex:iframe id="JiraWindow" src="<Jira_FETCH_URL>"></apex:iframe> </apex:page>
A form will appear for you to enter details of the new Visualforce page.
You can name it anything you wish. Add in the Visualforce markup from above
For example:Click Save.
Adding a Related Issues Section to the Layout
Now search for "Object Manager" then click on the Object Manager menu item.
Choose the object that you want to create a button in.
In our example, we will use Case.
Now look for Case Page Layouts and click it.
A list of page layouts for the object will be listed.
In this example, we want to modify the default Case page layout, which is called Case Layout.
Go to the pull down menu and choose Edit.
An interactive editor will appear for the object page layout.
At the top will be a section of the items you can add to your layout, at the bottom is the page layout where you can drag and drop the item to.
We want to add our new section for displaying Jira issues at the bottom of the Case Detail area.
The Fields area should already be open in the top area.
If not, click on it.
Drag and drop the Section item from the top section down to the bottom of the Case Detail area.
A green tick will appear if you have dragged it to a permitted area, a cross if you haven't.
You may need to hold and scroll the page down a bit to get to the end of the Case Detail area.
Once you have let go, you will see a Section Properties pop-up:
Give the section a name (we have called it "Related Jira Issues") and select 1-Column for the Layout.
Click OK.
We now have to move the Visualforce page for the related issues into this section.
Back in the top section, click Visualforce Pages.
In our example you can see the Visualforce page we created in the previous section, JiraIssues.
Drag and drop this on top of the section we just created.
Again, you may need to hold and scroll down the page to get to it.
After dropping, the Related Jira Issues section will look like the following with your Visualforce page name:
Click Save.
To verify the section was added successfully, go to a Salesforce object page of an object you know has Jira issues linked.
There should now be a Related Jira Issues window under the Case Details and the linked issues listed inside.
Salesforce Classic
You will need to get the correct Jira URL first by copying the URL from the "Fetch" Endpoint and replacing the bolded section of the URL with the correct syntax for your object.
Go to Salesforce and log in as an administrator and click on Setup.
Expand the Develop menu under the Build section of the left hand menu.
Find the Visualforce Pages link under this and click.
Click the New button to create a new Visualforce page for Jira issues.
A form will appear for you to enter details of the new Visualforce page.
You can name it anything you wish. Add in the Visualforce markup from above
For example:<apex:page standardController="<SALESFORCE_OBJECT_NAME>"> <apex:iframe id="JiraWindow" src="<Jira_FETCH_URL>"></apex:iframe> </apex:page>
Click Save.
Adding a Related Issues Section to the Layout
Now expand the Customize menu under the Build section of the left hand menu.
Expand the object that you want to add the related issues section to.
In this example, we are using Cases.
Find the Page Layouts link and click on it.
A listing of page layouts will be shown. In this example, we want to modify the default Case page layout, which is called "Case Layout".
Click on the Edit link under the Actions column of the layout.
An interactive editor will appear for the object page layout.
At the top will be a section of the items you can add to your layout, at the bottom is the page layout where you can drag and drop the item to.
We want to add our new section for displaying Jira issues at the bottom of the Case Detail area.
The Fields area should already be open in the top area.
If not, click on it.Drag and drop the Section item from the top section down to the bottom of the Case Detail area.
A green tick will appear if you have dragged it to a permitted area, a cross if you haven't.
You may need to hold and scroll the page down a bit to get to the end of the Case Detail area.
Once you have let go, you will see a Section Properties pop-up:Give the section a name (we have called it "Related Jira Issues") and select 1-Column for the Layout.
Click OK.
We now have to move the Visualforce page for the related issues into this section.
Back in the top section, click Visualforce Pages.In our example you can see the Visualforce page we created in the previous section, JiraIssues.
Drag and drop this on top of the section we just created.
Again, you may need to hold and scroll down the page to get to it.
After dropping, the Related Jira Issues section will look like the following with your Visualforce page name:Click Save.
To verify the section was added successfully, go to a Salesforce object page of an object you know has Jira issues linked.
There should now be a Related Jira Issues window under the Case Details and the linked issues listed inside.