Unlocking Extensibility in SAP SSCv2: Powerful Custom Buttons

Add Custom Button In SSCv2

As businesses transition to SAP Sales & Service Cloud v2 (SSCv2), one of the most powerful – yet often overlooked – features is the ability to create Custom Buttons directly in the user interface. These buttons allow administrators to extend the standard UI with business‑specific actions without modifying the underlying codebase.

In this article, we’ll walk through what Custom Buttons are, how they work, what they can trigger, and why they are a game changer for process automation and productivity in SSCv2.

What Are Custom Buttons in SSCv2?

We have multiple options to extend SSCv2, as described in our Side-By-Side Extension blog article. Custom Buttons are UI actions that you can insert into predefined UI sections within SSCv2. They appear to end users like native system buttons but are completely customizable in terms of:

  • Label
  • Icon
  • Placement
  • Associated action (event)
  • Parameters passed during execution

They enable you to perform operations such as:

  • Opening Quick Create screens
  • Launching navigation flows
  • Triggering APIs or automation
  • Calling external systems
  • Opening mashups
  • Passing context data to RAP/CAP or 3rd‑party applications

All of this is achieved without development, purely through Adaptation Mode.

Where Can Custom Buttons Be Used?

Custom Buttons are available throughout the SSCv2 UI framework. Examples include:

  • Case Overview pages
  • Sales Order and Sales Quote pages
  • Service Orders
  • Entity object pages
  • Custom-developed pages (Extension Center)

You can place them:

  • In action groups
  • As stand‑alone actions
  • In header sections
  • In detail sections

The feature is flexible and aligns with the UX of native SSCv2 buttons.

How Do Custom Buttons Work?

Each Custom Button has two major parts:

1. The Button (UI Element)

This is what the user clicks.
You define:

  • Label
  • Icon
  • Placement
  • Visibility conditions
  • Styling (inherits SSCv2 Fiori Horizon look)

2. The Event (Action Handler)

This determines what actually happens when the button is pressed.

An event is a backend or navigation action such as:

  • Opening a Quick Create form
  • Navigating to another page
  • Triggering an OData V4 action
  • Calling a CAP service
  • Invoking an external URL
  • Triggering a mashup
  • Starting a workflow
  • Publishing data to a webhook

The button and event are linked during configuration.

How to Creating a Custom Button: Step-by-Step Guide

Creating a Custom Button involves three main steps. The first step is the creation of the button itself. This is primarily a configuration task and requires little to no development experience. The second step focuses on creating and embedding a Mashup that listens to and handles the event triggered by the button. The third and final step is the implementation of the Mashup Callback. While the first step is mainly customization, the second and third steps require development experience. In the following three sections, we outline each step in detail.

A) Creating a Custom Button in SSCv2

Based on the SAP Help pages for Sales and Service Cloud v2 (SSCv2) the steps to create a custom button can be summarised as described below.

1. Start Adaptation Mode

Go to: User Menu → Start Adaptation

The page displays an editable border to indicate that you are in design mode.

2. Choose Where to Place the Button

Hover over a section until editing icons appear.
Click Edit to open the Section Items window.

Select:

  • Existing button groups (to insert inside them), or
  • The section itself (to add a stand‑alone action)

3. Create the Button

Click Add → Add Buttons.

Provide:

  • Button Name
  • Event Name (describes what the button triggers)

Important to mention is, that you must also create an Event Handler, and this handler must use the same event name. A button only triggers the event name. The event handler defines what the event actually does. If you don’t create the event handler (as outlined in step B) and C below), the button will not do anything.

The process of adding a Custom Button
The way you create a new button in SSCv2 is fairly simple

4. Add Parameters (Optional)

Parameters pass data to the event handler, such as:

  • Case ID
  • Customer ID
  • Product ID
  • Address
  • Config ID
  • Logged-in user
  • Any field in context

An exemplary use case, can be to capture the customer ID from a Case Overview page and send it to a CAP or RAP endpoint that creates a Sales Order automatically.

5. Save and Test

After clicking Apply, refresh the page and test your new button. End users will now see it immediately (respecting role-based visibility). Don’t forget that in some cases you do not see a new button entirely, but see the new button as part of a set of button actions, as shown below.

New added custom button in SSCv2
Once a new button was added it might appear in a set of buttons

B) Create and embed a Mashup that listens/handles the event

To actually “do something”, you typically embed a Mashup (HTML or UI5 app) on the same floorplan (tab/section), or you use an existing mashup that’s already present. SAP’s mashup callback concept is the supported way to initiate operations/events from embedded web apps (read more about this on SAP Help).

C) Handle the button click via Mashup Callback (postMessage)

When the user clicks the custom button, SSCv2 triggers the event and the mashup can react and send a message back to SSCv2 using the required JSON structure. In an SAP Community article it’s outlined that UI Events are based on window.postMessage() / window.parent.postMessage(), and that the event name and parameter names must match exactly what you configured in the button. For above example to open the Create Service Order view, the HTML mashup could look as follows:

<!DOCTYPE html><html><head><meta charset="UTF-8" />
<title>Create Sales Order Mashup</title><script>
// --------------------------------------------
// Event handler for messages coming from SSCv2
// --------------------------------------------
function handleEvent(data) {

    // 1. Ensure this is the correct event
    if (data.eventName !== "OnCreateSalesOrder") {
        return; // Ignore other events
    }

    // 2. Extract the ShipToID parameter
    const shipToId = data.parameters?.ShipToID;

    if (!shipToId) {
        console.error("ShipToID parameter missing in event payload.");
        return;
    }

    // ---------------------------------
    // 3. Build URL for Quick Create SO
    // ---------------------------------
    const quickCreateUrl =
        "/sales-order/create?shipToParty=" + encodeURIComponent(shipToId);

    console.log("Navigating to:", quickCreateUrl);

    // -------------------------------------
    // 4. Trigger navigation via postMessage
    // -------------------------------------
    window.parent.postMessage(
        {
            intent: "navigate",
            target: quickCreateUrl
        },
        "*"
    );
}

// --------------------------------------------------
// Listen for all messages sent to the mashup iframe
// --------------------------------------------------
window.addEventListener("message", function (event) {
    if (event.data && event.data.eventName) {
        handleEvent(event.data);
    }
});
</script></head><body><!--
  This file does not need visible UI content.
  It acts purely as an event-driven navigation helper.
--><p style="font-family:Arial; font-size:12px; color:#888;">
  Mashup loaded – waiting for event <strong>OnCreateSalesOrder</strong>…
</p></body></html>

What Events Can Custom Buttons Trigger?

SSCv2 provides a flexible event framework. Custom Buttons can trigger either Navigation Events, Search Actions, or Custom events. Each of these we’ll describe below.

Navigation Events

You can initiate navigation to views such as detaillistquickview, and quickcreate from a mashup.

Search Events

SAP also documents initiating search actions via mashup callback/event handling (SAP Help). To initiate a search event, the external application must use the window.postMessage() method to send data to SAP Sales Cloud and SAP Service Cloud Version 2. This data must include specific parameters required for the navigation to work.

Custom Events (app-specific handling)

You can define your own event names and use them as a contract between SSCv2 configuration and your mashup logic (Important: name match is key). Similar to the previous section, you’d have to make use of window.postMessage().

Use Case Examples

With these examples in mind, we can create multiple scenarios in which Custom Buttons can trigger new process flows. Below you’ll find a few examples, that we came across and can think of.

  • Create Sales Order From Case: A button “Create Sales Order” reads Case data, opens Quick Create, and pre-populates fields.
  • Trigger CAP Logic: A button “Approve Request” triggers a CAP Action that processes custom business logic.
  • Open External CPQ System: A button “Configure in CPQ” opens a CPQ solution with context parameters.
  • Notify Partner via Webhook: A button “Send to Partner” calls a webhook URL including customer and product IDs.

Why Custom Buttons Matter in SSCv2

Custom Buttons represent one of the most useful enhancements in SSCv2 that integrate very well in the standard. Extending your SSCv2 with the help of Custom Buttons is extremely useful for following reasons:

  • Seamless integration with SAP BTP, as you can trigger one specific screen of your mashup service that lives in BTP,
  • It’s a centralised extensibility without hefty front-end development efforts, and
  • it’s a clean, upgrade-stable way of extended SSCv2.

Conclusion

Custom Buttons in SSCv2 are a powerful extensibility tool that enable organizations to tailor the user interface to match their business processes. Whether you want to open Quick Create screens, trigger backend automation, call external systems, or orchestrate workflows — Custom Buttons offer a clean and upgrade-safe way to extend the platform. As SSCv2 continues to evolve, this feature will remain one of the most valuable tools for building a process-centric, integrated, and efficient sales and service experience.

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top