Explore critical topics shaping today’s SAP landscape—from digital transformation and cloud migration to cybersecurity and business intelligence. Each topic is curated to provide in-depth insights, best practices, and the latest trends that help SAP professionals lead with confidence.
Discover how SAP strategies and implementations vary across global markets. Our regional content brings localized insights, regulations, and case studies to help you navigate the unique demands of your geography.
Get industry-specific insights into how SAP is transforming sectors like manufacturing, retail, energy, and healthcare. From supply chain optimization to real-time analytics, discover what’s working in your vertical.
Dive into the most talked-about themes shaping the SAP ecosystem right now. From cross-industry innovations to region-spanning initiatives, explore curated collections that spotlight what’s trending and driving transformation across the SAP community.
Explore critical topics shaping today’s SAP landscape—from digital transformation and cloud migration to cybersecurity and business intelligence. Each topic is curated to provide in-depth insights, best practices, and the latest trends that help SAP professionals lead with confidence.
Discover how SAP strategies and implementations vary across global markets. Our regional content brings localized insights, regulations, and case studies to help you navigate the unique demands of your geography.
Get industry-specific insights into how SAP is transforming sectors like manufacturing, retail, energy, and healthcare. From supply chain optimization to real-time analytics, discover what’s working in your vertical.
Dive into the most talked-about themes shaping the SAP ecosystem right now. From cross-industry innovations to region-spanning initiatives, explore curated collections that spotlight what’s trending and driving transformation across the SAP community.
Adding a toggle switch in SAP Analytics Cloud allows users to effortlessly switch between light and dark themes, enhancing personalization and user experience.
The process involves adding a switch, incorporating a script, and locating the required theme IDs using the browser's console for proper functionality.
By following a straightforward step-by-step guide, users can implement this feature to enrich their SAP Analytics Cloud stories and improve overall user engagement.
This article provides a step-by-step guide on how to add a toggle switch in SAP Analytics Cloud for users to easily switch between light and dark themes, enhancing personalization and user experience.
Manually switching themes in a story is common in SAP Analytics Cloud, but did you know you can add a toggle switch to seamlessly switch between themes, such as light and dark modes? This feature allows users to personalize their stories to better suit their preferences.
Step-by-Step Guide to Adding a Theme Toggle Switch
Step 1: Add a Switch to Your Story To start, add a toggle switch to your story. This will act as the trigger for switching between themes.
Step 2: Add the Script Add the following (or similar) script to the switch. Don’t worry about filling in the variables yet—we’ll guide you through finding the correct theme IDs:
Step 3: Locate Your Theme IDs The script for this functionality is very simple, but theme IDs are not as easily accessible as story IDs in SAP Analytics Cloud, so you’ll need to use the browser’s console “Network” tab to locate them.
Locate Your Themes
Open the folder containing your themes in your SAP Analytics Cloud tenant.
Open your browser’s developer tools (usually accessible via F12 or right-click > Inspect).
Navigate to the Network tab.
Every time you click on the page, the Network tab will populate with new information. By clicking on one of the themes in the folder, you will see your Network tab update.
This process may seem overwhelming at first, but there’s no need to manually sift through every item to find your theme ID. After opening your theme and allowing the Network tab to populate, simply click on the last item in the list. This will highlight the most recently loaded entry, which we’ll use as a reference point.
Step 4: Confirm Theme Selection in the Network Tab After selecting this item and seeing that it is highlighted in the console, close your theme preferences window on the webpage. If closing the window adds anymore items to your Network tab, make sure you click the most recent one so that you still have a place holder:
Step 5:Reopen the Theme to Refresh the Network Tab
Reopen your theme on your webpage. This should populate the Network tab with significantly fewer new items, as shown below:
Step 6: Select the Content Library Entry
Find the entry that starts with “contentlib” in the Network tab.
Scroll to the top of its contents to locate the resourceID field.
Confirm the ID by checking the resource type and theme name.
After finding your first theme ID, you need to go through the same process for your second theme.
Step 7: Update the Script
Now that we have both theme IDs, let’s return to the script for the switch. Make sure to populate the variables with your chosen theme IDs.
Step 8: Test the Script
With the script updated, you can now use the toggle to switch between themes directly in your story. Feel free to add whatever text you would like next to the switch to help users:
Light mode:
Dark Mode:
With just a few simple steps, you can easily add a toggle switch to your SAP Analytics Cloud stories, allowing users to seamlessly switch between light and dark modes. This feature not only enhances the user experience but also adds a personalized touch to your stories. Try it out today and let us know how it improves your SAP Analytics Cloud journey!
