Launching ECC screen into C4C through HTML Mashup-Step by Step Process

In CRM, we have transaction launcher functionality to launch any ECC screen in to CRM web UI. So I thought, why can’t we achieve the same functionality in C4C. To achieve this, we gone through some research and found out a way to launch the ECC screens through HTML Mashup.

This document covers the step by step process of launching an ECC (My demo system is connected to ISU on premise system, so we launched an ISU screen) screen into C4C.

Prerequisite:

To launch any ECC screen into C4C, first we need to know the target system’s Port number and Host Name details to define the URL for the HTML mashup.

Click on Go to- > Service

Capture the port and hostname information.

Step by Step Process:

Step 1: In the Administrator work center, go to Mashup Authoring:

Path: Administrator->Business Flexibility->Mashup Authoring

Step 2: Choose New->Html Mashup

Step 3: The Port Binding decides on which screens the Mashup can be made visible. In my example I want to launch the Mashup in the Utilities tab. If you want to launch in any custom tab, then you need to define your own port binding. In my case, i select “without post binding” to launch in utilities tab.

Step 4: Choose a meaningful name for the Mashup, in my case we launched the ISU T-code ES60 for creating a premise. We name it as “ISU Transaction ES60”

In Configuration Information, set the Radio Button to HTML Code.

In HTML code editor, we written a small code for adding a button for launching the ISU screen.

We have to add the T-code we are trying to launch and the URL for ISU screen there.

Sample URL:

https://<Server>:<Port>/sap/bc/gui/sap/its/webgui?sap-Client=<Client> +Par;

We need to replace the server, Port and Client information in the sample URL with parameter information (T-Code you are launching & any input parameters to ISU screen etc…)

Step 5: Save the created Mashup and Activate it.

Step 6: To be able to use the Mashup, it must be added to the required screen. If it should be visible for all users, then it must be done through adaptation.

Go to the screen where you want to launch the Mashup then click on Adapt menu. In my example it is the tab “Utilities”.Under Utilities I want to launch in Premise tab.

So go to Premise tab and lick on the Adapt button -> Edit Master Layout

Click on Mashups and Web Services pane. Select the visible checkbox next to the mashup you want to have visible. Then Click on Apply, to get the Mashup available for all users.

If you do not want to make the Mashup visible to all users who have access to a screen, then individual users can add the Mashup through Personalization.

By executing these steps, I made the html code Mashup visible on the Utilities tab.

Click on the button “Create Premise in ISU” – it logged in to ISU T-code ES60

Creating a Premise in ISU: Click on enter and provide a connection object and fill some mandatory fields->Save the record.A new premise successfully created in ISU system.

You can check the created premise in ISU system as well by logging into ISU system and open teh transaction ES62.

I can see the newly created Premise in ISU system.

with the instructions above , you can launch any ECC screens into C4C system through HTML mashup and we can pass parameters as well while launching the screen into C4C.