Hey everyone,
in previous blogposts I took you through SAP Mobile Start related topics like:
- Adding tiles for native apps to SAP Mobile Start content - Blogpost
- Monitoring key business information directly from device home screen using widgets -Blogpost
I would like to now describe how news feeds can be added to the content; as a tile within SAP Mobile Start app and as a widget on the home screen. The setup can be done using the Site Manager provided by SAP Build Work Zone, standard edition. I will take the example of the SAP company news feed.
To display your favorite news feed, SAP Mobile Start will require an URL that points to the news feed, provided in the RSS 2.0 format. Make sure you meet this prerequisite before you start following the steps below.
1. Create new app and maintain Configurations-tab in Site Manager
First, log into the SAP Build Work Zone, standard edition's Site Manager and create a new application.
You will start the configuration on the Properties-tab.
Here, provide a Title and Description. Next, as System select No System and as the App UI Technology make sure to use URL. Below that, you will need to provide a URL which is only used as fallback if the tile is also used on Desktop. In this case it's also recommended to change the Open App property to In a new tab.
2. Maintain Navigation-tab
Within the Navigation-tab it’s mandatory to provide a semantic object and action for the intent navigation. Fill some values for the Semantic Object and Action, for example the app name and an action like “start” or “launch”, respectively. Note that specific values for the intent-based navigation is only required for SAP Fiori / custom Fiori apps that make use of it.
3. Maintain Visualization-tab
The most important information in regards to the feed tile needs to be entered in the Visualization-tab.
Optionally provide Title, Subtitle and Information for the visuals if you also want to use the tile on the desktop site. If not, you can de-select the Desktop as Supported Device.
To make it useable as a feed tile within SAP Mobile Start you need to provide specific parameters for the native app. To achieve the minimal setup only two parameters are:
mobilestart.type = news (defines custom display type)
mobilestart.feedUrl = <your RSS 2.0 feed URL> (parameter to access RSS feed root)
It should look like this:
Now save the tile and make it available in the Site by following the next step.
4. Make your feed tile available on a site / within SAP Mobile Start
To access your feed tile via SAP Mobile Start you need to make sure to add it to the respective site on the SAP Launchpad Service first. These steps will be necessary:
On Site Manager:
- Assign the app to a role & group
- Make sure the role used above is assigned to a site
In BTP Cockpit:
- Make sure the users accessing the site are assigned to the respective role collection
On Launchpad Site:
- Make sure the tile is shown/not shown based on your selection on visualization-tab
(Note: On Desktop it will only show as a standard tile that leads you to the provided URL)
If everything is setup, retrieve the register-QR code from the Site Settings and scan it using the SAP Mobile Start app. Follow the onboarding process and see if your feed -tile is visible within your content like this:
Different RSS 2.0 feeds may have different structures and names for their properties. Hence some parts of the content may not be visible if a different RSS 2.0 feed to SAP news is used; for e.g. some of the UI Elements, like item headlines or publishing dates might not show.
You will need to configure additional parameters if this is the case, the next section will explain the steps.
5. Use additional Parameters to adapt to different RSS 2.0 feed structures
SAP Mobile Start provides the possibility to add some additional parameters, in order to adapt the tile’s content to various feed structures. The table below shows the different UI Elements of the feed tile and the default properties they consume from an RSS 2.0 feed.
Here’s a screenshot with the highlighted UI Elements of the feed tile, mentioned in the table above. As you might notice the respective content for “Footnote 2 author” is still missing in our sample setup.
To get a better understanding let’s connect this to an actual RSS 2.0 feed. See the following example snippet from SAP News (https://news.sap.com/feed/) with highlighted default properties for the related UI Elements.
As you can see, each UI Element on the feed tile is retrieving its content from a defined location (XML-Tag) in the RSS 2.0 feed. Sometimes though, the default properties for SAP Mobile Start varies from the ones in the RSS 2.0 feed.
Example:
You maybe have noticed that the “Footnote 2” is not showing on our sample news tile after the basic set up. This is due to a variation of the property name.
- The default property for the Item Author for SAP Mobile Start is: channel/item/author
- But in the RSS 2.0 feed from SAP News the naming is slightly different, instead of author the corresponding XML-tag is named: dc:creator
To fix that we need to make use of an additional parameter in the Visualization-tab and redefine the name for the property. In this case it’s the parameter for the author:
- feedItemAuthor
In the Site Manager we can add that parameter and provide the right name of the property (XML-Tag): dc:creator
After the parameter got added to you application in the Visualization-tab you need to save it. Back in SAP Mobile Start you can pull down on the screen to refresh the content. After that the feed tile should be updated and look like this:
Now each of the news items are displaying the Author. Make sure to also check on the link-property by tapping one of the news items and see if the navigation works.
6. Add feed tile as widget to the home screen
SAP Mobile Start offers the ability to add News Widgets for feed tiles or Business Info Widgets for dynamic tiles. For additional info on the Business Info Widgets there is already a Blog here.
Pre-requisites:
- Widgets need to be enabled via the GlobalWidget feature flag. (Step 0 here)
- have a working feed tile in the SAP Mobile Start app.
You can make use of the general iOS widget functionality to add a News Widget to the home screen:
- Long press on home screen to enter edit mode
- You should now see a “+” icon at the top-left . Click on it to get into the widget selection. (Note: on iPad widgets can only be added to the widget section on the very left home screen)
- Search for “Start” and select the right entry to see the different widget options.
(Note: You don’t see the entry in the widget selection if no site is registered within the app)
- Swipe to the right to see a collection of available News Widgets. Select one and press “Add Widget”. It should now appear on the home screen.
- If multiple feed tiles are configured in the site to which SAP Mobile Start connects, you will need to select the one you want to use in the widget. To do that long press the widget to get a pop-up menu and select “edit widget”.
- After that you can choose the source for the widget from all the feed tiles that are available on the onboarded site
Now the widget should be properly set up and the latest news should appear on the home screen. Tapping the widget will navigate to SAP Mobile Start app. If a news item is tapped, the right article from the chosen news site will open within the app.
7. Wrap up
If you followed the steps you should now be able to:
- Configure a feed tile in the Site Manager
- Add it to a site and access it in SAP Mobile Start
- Adjust additional parameters based on RSS 2.0 feed structure
- Make use of iOS widgets to follow news directly from the home screen
Please let me know in the comments if you have any feedback! I hope the feed tiles and widgets of SAP Mobile Start will help you to stay up-to-date with what’s going on around.
Stay up to date with latest news and post your questions or feedback about SAP Mobile Start in the Q&A area. Start by visiting your SAP Mobile Experience community page and click “follow”. We’ll be publishing more informative blog posts.
Want to be notified? Check your #communications to ensure you have your settings activated.
- SAP Managed Tags:
1 Comment
