1 5 6 7 8 9 25 Previous Next

SAP Enterprise Portal

374 Posts

What is it all about?

Recently we were requested to develop a very unusual consumption experience for exploring Fiori business content, enriched with context aware services (you can find here more information about it). While this is still in development, we thought some of you would be interested in learning about some of our considerations in selecting the technology for the UI.

Nir and I are developers in the SAP Portal group, in SAP Labs Israel, and we just love to bring Web UI to the extreme.

So what was on our plate? Complex shapes, dynamic graphics, multiple layers, complex and simultaneous animations, and, needless to say, mobile-friendly and absolutely smooth performance.

We also wanted: minimal learning curve, usage of a technology which is common in the industry, accessibility & text extraction, ability to embed external HTML content.

The good part: we were free to support a limited product-availability matrix, with only the most up-to-date Webkit browsers on PC and the retina iPad.

After a long investigation and numerous POC’s, we decided to go with CSS Transformations over HTML DOM elements with a pinch of Canvas. We were surprised to find out that the technology we had known for so long would fit us best, and while on this quest we learned to improve our skills using it.

Here are the technologies we investigated in order to find which best suit our requirements:

  • HTML5 Canvas
  • SVG
  • CSS Transform

 

magnet3.png

First Option: HTML5 Canvas

According to the HTML5 specification, the CANVAS element is:

“a resolution-dependent bitmap canvas, which can be used for rendering graphs, game graphics, art, or other visual images on the fly.”

The HTML5 Canvas element is an HTML tag similar to the <div>, <a>, or <table> tag, with the exception that its contents are rendered with JavaScript.

In order to leverage the HTML5 Canvas, we need to place the <canvas> tag somewhere inside the HTML document, access the <canvas> tag with JavaScript, create a context, and then utilize the HTML5 Canvas API to draw visualizations.

The canvas element is the actual DOM node that is embedded in the HTML page.

The canvas context is an object with properties and methods that you can use to render graphics inside the canvas element. The context can be 2D or webgl (3D).

For example, let’s draw a rectangle with HTML5 Canvas:

<body>
     <canvas id="myCanvas" width="578" height="200"></canvas>
     <script>
          var canvas = document.getElementById('myCanvas');
          var context = canvas.getContext('2d');
          
          context.beginPath();
          context.rect(188, 50, 200, 100);
          context.fillStyle = 'yellow';
          context.fill();
          context.lineWidth = 7;
          context.strokeStyle = 'black';
          context.stroke();
     </script>
</body>

 

The result:

canvas.png

HTML5 Canvas Advantages:

  1. High-performance 2D surface for drawing anything you want
  2. You can save the resulting image as a .png or .jpg
  3. Best-suited for generating raster graphics (for example in games, fractals, etc.), editing of images, and operations requiring pixel-level manipulation

 

HTML5 Canvas Disadvantages:

  1. Poor text rendering capabilities. Might not be the best choice for cases where accessibility is crucial

  2. Events are binding to <canvas> tag and not on specific Web element, so in order to handle events for a specific Web element, you may need to do a lot of hard work or to rely on a Javascript library like KineticJS

  3. Poor debug tools

 

 

Second Option: SVG

SVG literally means Scalable Vector Graphics. It is a language for describing two-dimensional graphics in XML.

SVG allows for three types of graphic objects: vector graphic shapes (e.g., paths consisting of straight lines and curves), images, and text.

Graphical objects can be grouped, styled, transformed and composited into previously rendered objects. SVG also supports embedded or external CSS rules.

Example of SVG shapes:

 

<line x1="0" y1="0" x2="200" y2="200" stroke-width="1" stroke="#000"/>
<rect x="250" y="250" width="200" height="200" fill="rgb(234,234,234)" 
     stroke-width="1" stroke="rgb(0,0,0)"/>


SVG Advantages:

  1. Vector graphics: people are now using high-resolution iPads and monitors
  2. Accessibility: Humans and machines can understand SVG code even if they can’t render it
  3. DOM Handling: SVGs have a DOM so it’s easy to attach event handlers and manipulate elements like you would for other HTML elements. To move an item, you simply change its coordinates

 

SVG Disadvantages:

  1. Slow rendering when document complexity increases; frequent use of the DOM impacts performance
  2. Steep learning curve
  3. Longer application loading, especially with detailed graphics

 

Third Option: CSS Transform

 

Modern browsers (Safari, Chrome, Opera, Firefox, IE9+) provide Web developers with CSS animations capabilities.

The effect of CSS Transform is to modify the appearance of an element in the browser by translation, rotation, scaling or other means.

While CSS Transformation in itself is a powerful tool, the ability to animate the transformations using webkit-transition makes it even better, so you can define animation properties like duration, delay, easing etc.

For example:

 

.element { 
     -webkit-transition-property:width;
     -webkit-transition-duration:1s;
     -webkit-transition-timing-function:linear;
     -webkit-transition-delay:2s;
}

 

In addition, you can combine multiple transform animations to a single element by listing them one after the other, so you can create complex animations easily.

 

You can predefine animation for an element and control the timing by @-webkit-keyframes. A keyframe defines the style that is applied for that moment within the animation. The animation engine smoothly interpolate styles between the keyframes.

 

Here is an example of a keyframe animation that changes the element size:

 

@-webkit-keyframes item-animation { 
     0% {
           -webkit-transform: scale(0.2, 0.2);
       }
     45% { 
          -webkit-transform: scale(1.1, 1.1);
     }
     100% {
          -webkit-transform: scale(1, 1);
     }
}

 

In the same CSS file you can attach the keyframe animation to an element:

.element {
     -webkit-animation: item-animation 0.5s; 
     -webkit-animation-fill-mode: both;
}

 

Furthermore, from a performance perspective, it is better to use CSS Transform in comparison to changing an object position and size by plain CSS properties (top, left, width, height).

Changing CSS properties by Javascript causes the browser to paint each frame, which result in a flickering transition. The CSS Transform version gets the screen element elevated onto its own layer on the GPU (called a RenderLayer). Now that it sits on its own layer, any 2D transform, 3D transform, or opacity changes, can happen purely on the GPU, which will stay extremely fast and still get us quick frame rates.

 

CSS Transform Advantages:

  1. Performance – uses GPU and not CPU
  2. CSS is a common technology, which doesn’t require much learning, and is easy to use – just a few more CSS properties and values
  3. Animations are made on the HTML DOM objects

 

CSS Transform Disadvantages:

  1. Bitmap graphics only - we have to take into consideration different screen resolutions
  2. Dynamic animations are made using Javascript and are slower (for example, items which should be moved to a calculated location)
  3. Creation of complex shapes are limited - we can draw circles, but more complex shapes might require images

 

Which one to pick?

It is quite hard to declare one technology as the optimal one, since the decision, like always, depends on your needs.

After investigating each technology and doing some POCs, we found out which of our requirements are answered by each UI technology:

Requirement

HTML5 Canvas

SVG

CSS Transform

Draw complex shapes

V

V

Sufficient (for required implementation)

Dynamic graphics

V

V

V

Complex animations

V

V

V

Good performance

V

Partially (CPU costly)

V

Mobile-friendly

V

V

V

Minimal learning curve

X

X

V

Common in industry

Partially

Partially

V

Accessibility & text extraction

X

V

V

Embed external HTML content

X

Partially (foreignObject)

V

 

The ability to embed HTML content is an important requirement since we must make sure our solution will support integration with other UI libraries like UI5.

In addition to technical pros and cons for each UI technology, we also took into consideration our team’s wide experience in using HTML and CSS, which could help us provide a good solution in minimal time and learning curve.

In conclusion, our main choice is CSS Transform for animations, complex Web elements with embedded HTML, and simple event-handling for each element.

Additionally, we chose to use HTML5 Canvas for animations of non-Web elements like background scenery elements.

 

Hope you enjoyed this post,

Nir and Yotam.

 

Sources:

http://www.paulirish.com/2012/why-moving-elements-with-translate-is-better-than-posabs-topleft/

http://dev.opera.com/articles/view/svg-or-canvas-choosing-between-the-two/

http://msdn.microsoft.com/en-us/hh534406.aspx

http://creativejs.com/resources/requestanimationframe/

http://www.paulirish.com/2011/requestanimationframe-for-smart-animating/

http://www.w3schools.com/cssref/css3_pr_transform.asp

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Using_CSS_transforms

https://developer.mozilla.org/en-US/docs/Web/CSS/transform

http://www.the-art-of-web.com/css/css-animation/#.Ulvx7FBkPzg

http://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp

https://developer.mozilla.org/en-US/docs/Web/CSS/@keyframes

 


For making your sites easily accessible on mobile and attractive to mobile users, the Mobile Portal offers you a role based aggregation layer to integrate both your web and native applications with unstructured content from various sources. There are already lots of blogs out there on SCN describing SAP Mobile Portal capabilities and how to best use them. I recommend reading


For this blog, I built a very small example including a PSM Page. My portal was already configured for mobile (HTML5 support, filtering enabled, device groups configured), so I just did the following steps:

  1. In the Master Rule collection, I checked which Smartphone Desktop was assigned to Device Group Smartphone – it was the Default Smartphone Portal Desktop.
    1-Rules.png
  2. Then I checked in this Portal Desktop which filterID was assigned. Result: the default com.sap.portal.smartphone.
    2-Desktop.png
  3. Next I created a copy of the Every User Mobile Role which comes with the standard delivery and made sure that the Filter IDs assigned to the Launcher and other pages contained com.sap.portal.smartphone.
    3-Role.png
  4. Now, the next step is adding some PSM pages to this role. This is really easy, as it is done using the Navigation Manager (before SP3: Navigation Assistant).  You just need to select a folder in a portal role on the left side and a node in the PSM project structure on the right side and click Add.
    As an example, I built a simple structure with PSM and published it:
    4-MS.png
  5. There are two possible locations where PSM pages can be added to a portal role:

    a. In the launcher: In Navigation Manager, you simply select the launcher folder in the mobile role on the right side and the top page of the PSM page structure on the left side and click Add Link. In the pop-up window, the Mobile checkbox needs to be checked, which in most cases is already done by the system. All other settings can just be used as they are, if you do not want to restrict the depth of the page sturcture. Mobile links always need to be static.

    The PSM pages are added as folder structure below the launcher. They inherit the filter ID from the launcher and mobile users can easily navigate through them to find the relevant content.
    5-Add_launcher.png

    b. In Portal Explorer:  The Portal Explorer gives users access to all items in their mobile roles that are entry points but not assigned to a mobile perspective like launcher or home page.  Therefore, you just need to add the PSM pages to any folder except launcher, e.g. to the role itself, using Navigation Manager; then it will be accessible from the Portal Explorer in the Toolbox.

    To define the types of devices on which the pages should be visible, you have to enter a filterID, when creating the link.

        6-Add PEx.png 

 

Now I am done. That is how the page structure looks like in the Portal role:

6-Role Ende.png

 

And in the smartphone:

Launcher_s.jpg   PortEx_s.jpg  

 

You can now click to open the Travel Information page or navigate to the sub-pages.

 

 

By the way, for sharing documents on mobile, SAP Portal Content Management by OpenText offers mobile UIs both for tablets and smartphones. These are the PCM smartphone UIs:

MobileBrowse.jpg   MobilePulse.jpg

 

 

Hope that blog was helpful. If you are interested in reading more about creating sites with SAP NetWeaver Portal, check out the other blogs in my blog series.

 

Regards,

Sibylle

Applies to:

 

This article applies to SAP Enterprise Portal 7.0.

 

Summary

 

This document explains the procedure to add our predefined properties in the Search Options Screen of SAP Enterprise Portal.

 

Author(s):    Sreeram Kasturi

 

Company:    Infosys Technologies Limited

 

Created on: 16th September 2013

 

Author Bio

 

 

Sreeram Kasturi is working as Senior Technical Architect in Infosys Technologies Limited, Bangalore.  He has worked on SAP MDM, SAP BPM, EP, KMC and Java/J2ee Technologies. He has conducted trainings on behalf of SAP Education Center on EP KMC

 

 

 

1. Introduction

 

SAP Enterprise Portal comes with a set of standard predefined properties for each resource for example: created by, modified by. Sometimes we might require creating our own properties also. This blog explains how to add the new predefined properties to appear in the Search Options Screen of SAP Enterprise Portal.

 

Two main sections of this document are “Creating New Properties” and “Adding Predefined Properties to Search Option Screen” as shown below.

 

2. Creating New Properties

 

This section “Create New Properties” is already explained in my previous article published on SDN - Creating Predefined Properties in Knowledge Management - Step by Step Guide” .

 

3. Adding Predefined Properties to Search Option Screen

 

This section explains how to add predefined Properties to Search Option Screen in SAP Enterprise Portal

Go to System Administrator --> System Configuration --> Knowledge Management --> Content Management --> User Interface

searchoption1.JPG

Click on Show Advanced Options in “User Interface”

searchoption2.JPG

Click on Search +.

 

searchoption3.JPG

Click on “Search Options Set”

 

searchoption4.JPG

Select the 'UISearch' and click on Edit Button

searchoption5.JPG

Click on ‘Show All Object’ link to display all the properties under ‘Allowed Predefined Properties’

searchoption6.JPG

Select the newly created / required properties from the list shown in the above image.

 

Click on ‘OK’ button.

 

The newly added properties like approved, reviewed, printed are visible in the Search Option screen as shown below.

searchoption8.JPG

 

4. References

 

 

http://help.sap.com/SAPHELP_NW70EHP1/helpdata/EN/cc/f4e77ddef1244380b06fee5f8b892a/frameset.htm

 

http://help.sap.com/saphelp_nw04s/helpdata/en/ad/e3ce0fd4f011d5994400508b6b8b11/frameset.htm

With Netweaver Portal 7.30 SP10 or 7.31 SP09 SAP launched the new UI Theme Designer. By default the old editor is still loaded, so here are the tips:

 

 

1) Enable UI Theme Designer in the portal

In Netweaver Administrator (/nwa) go to Configuration > Infrastructure > Application Modules;

Select the web module "com.sap.portal.themes.lafservice" in the Module List;

Now in the Portal Service Details the Properties are loaded. Change "Determine what will be the theme runtime provider" to LESS.

Save it and restart the portal.

 

nwa_less.gif

2) By enabling the LESS functionality the portal has added a new menu option under Content Administration > Portal Display > Portal Themes. It is called UI Theme Designer.

 

portal.gif

 

If you launch the UI Theme Designer, be sure you are running a modern browser (e.g. CSS3 support -> IE9 or higher, Firefox and Chrome).

Otherwise it won't start / work correctly.

 

 

 

3) Check out the following: Note 1839261 - Application displayed without theme (UI Theme Designer). In our case we needed a patch for SAP_BASIS (SAPKB73108).

 

 

4) Now you can run the UI Theme Designer from the portal.

 

theme.gif

 

Some interesting information (thanks Shani and Itzik again )

OSS note 1890375

http://help.sap.com/saphelp_nw73ehp1/helpdata/en/8e/a763272dcd4b4ba6ea347050b1f3fc/content.htm?frameset=/en/47/fdd03fc5de3c92e10000000a42189c/frameset.htm

 

/*

Noël Hendrikx - SAP Portal consultant @ Peppie Portals.

Specialized in Corporate branding SAP Portal / Adobe Interactive Forms.

 

UI Theming blog series

Portal theming - also waited a couple of years?

How to... UI Theme Designer - Installation

How to... UI Theme Designer - Migration

How to... UI Theme Designer - Locating elements

How to... UI Theme Designer - Transportation

 

 

Other blogs:

Tired of zipping / unzipping portal theme?

Tips for the Portal Content Studio

DSM Terminator and popup blockers (or not)

My best development friend - Autoresponder FTW

/*


Hi SAP Portal Community,


Today, I would like to introduce myself to you and invite you to follow a series of blogs that I intend to start in the next days. My name is Sibylle Brehm and I have been part of the portal Product Management team since the very beginnings of SAP Portal, although at that time my focus area was Knowledge Management. In the last years, I took over the responsibility for planning, setting up, and configuring our SAP NetWeaver Portal demo scenarios, for customer events like Sapphire and TechEd, for our standard demo landscape and also for specific customer meetings.

Here you can see some of the portals that I worked on:

Ozone.pngVintage.png

 

Since the portal management team decided in 2010 to further enhance and enlarge the portal offering with the best-of-breed Content Management and Web Site Management solutions of our partner OpenText, these new capabilities also needed to be reflected in our demo scenarios. Thus, I had the opportunity to build up a lot of experience on the integration of SAP Portal Content and Site Management of OpenText with SAP NetWeaver portal, on the benefits of using these add-ons to the portal, on configuration and administration.


This has been quite a fascinating time to get to know these new products in detail with long hours and some ups and downs, lots of learning by doing and help from our colleagues in the Portal development team and at OpenText. And it is this experience that I would like to share with you in a blog series on creating sites with SAP NetWeaver Portal. These are the topics that I am going to tackle in my first blogs:

 

  1. Leveraging SAP Portal Site Management by OpenText for building external sites
  2. Accessing sites built with SAP Netweaver Portal and PSM on mobile
  3. Anonymous logon for external sites
  4. What to consider when changing the portal look and feel with a custom framework page

 

If you have any additional ideas and points of interest around this topic, please feel free to provide your suggestions by writing a comment on this blog. I promise to take a close look at your ideas and provide some details wherever possible.


So, stay tuned! The first blog is already available and the second one just around the corner.


Regards,
Sibylle

Hi SAP Portal Community,

 

Creating external facing portals is quite an important topic for many companies and there are lots of things to consider regarding architecture, security, user access etc. Today, I would like to take a closer look at how you can use SAP Portal Site Management by Opentext (PSM) with the SAP NetWeaver Portal to create even better, more appealing sites with a maximum of flexibility.


PSM provides customers with a rich set of features and functions to enable non-technical business experts to easily manage their content within the SAP Portal. To benefit from the close integration between Portal and OpenText Web Site Management and the advanced Site Management features of the product, you first need to install the OpenText Services and deploy the PSM Portal components.


From the Portal side of the solution, you get lots of functionality for providing an external facing site out of the box like navigation via short URLs or quicklinks, a navigation cache, a light framework page, and a resource-sensitive page builder. You can find more about this topic in the SAP help portal at http://help.sap.com/saphelp_nw73ehp1/helpdata/en/48/1d0555a4ef4e6fe10000000a42189c/content.htm?frameset=/en/48/1d054fa4ef4e6fe10000000a42189c/frameset.htm. For general information on SAP NetWeaver Portal, please take a look at the SAP NetWeaver Portal space in SCN where you can find for example a Getting Started blog and a roadmap presentation, or watch the portfolio video.


With the usage of PSM, you gain all features of a best-of-breed web site management solution for administrators and an easy-to-handle, quick editing tool for site editors in addition. Besides, PSM offers Asset Management to manage images you used on your web-sites, support for the whole content process and, very importantly, lots of options for building dynamic sites. For more detailed information on PSM in general, take a look at this presentation.


Well, how do PSM and Portal work together when building up an external site? Let’s take a look at different important decisions you have to make, when building up your site:

  1. Access: The OpenText Delivery Server, the powerful, XML-based tool for dynamic delivery of web site content to the Portal, has its own anonymous user. SAP Portal Site Management by OpenText automatically recognizes if the portal user is an anonymous user and then maps it the Delivery Server anonymous user without any configuration needed.
  2. Navigation: Since your external site will be first of all a portal, you can use the normal SAP NetWeaver portal concept to provide a role-based navigation structure. With PSM you can complement the role navigation by adding either single pages or complete navigation trees to a portal role and very easily link between pages. In addition, you can choose between static and dynamic links when adding pages or page structures to a role, so that in the second case, even after having connected the page to a role, all changes to the page structures will be automatically visible in the portal once they are published. You can see how to add pages to a role in this video.
  3. Look and Feel: In many cases, SAP Portal customers will create their own portal desktops and framework pages based on the Ajax framework page to shape the portal design according to their needs. You can easily integrate the same css and if needed js file both in the OpenText Management Server as part of the portal framework to attain a seamless experience both in your External Facing site and in your editing environment.
    To ensure a consistent look of Portal/PSM pages, the OpenText Management Server (the part of the solution where the actual page creation, editing and publishing workflow is handled) offers also a clear separation of content and layout and helps to enforce strict adherence to a predefined design, even when content creation is delegated to content experts in the LOB. To reach this, the whole content creation process heavily on templates that can be created in a way to fit seamlessly into your portal environment.
  4. Portal Content: In many cases, you will decide to bring together structured and unstructured content on the same page. In fact, this can be done easily by using the Application Integration feature of PSM. Thus, PSM pages are not just nice web pages created using cool templates and based on a stylish css, but they can also contain any application that is available in your portal as an iView, so that you can for example display the list of current purchase orders next to some information on the purchasing process in your supplier portal. The application integration is done in the template, so power users can provide a set of templates including different applications and add red dots to the template to modify iView properties of the application, e.g. root node and display options for a document list or transaction code for an SAP transaction.
  5. You can easily provide a mobile version of your external facing site, but that will be the topic of my next blog. To see an overview of the complete series about creating sites with SAP NetWeaver Portal, go the introductory blog.


Stay tuned!

Sibylle

Steps to remove tabs from UWL

 

By default we get below tabs in uwl.

  1. Alerts
  2. Tasks
  3. Notifications
  4. Tracking

 

If we need
to remove any tab, we can do it by following below given steps:

 

 

  1. Go to iview properties and check the
    property useNavigationId, as shown in fig below:

ivew-property.jpg

 

 

Note down the value ‘’com.sap.pct.erp.mss.Main”, this is nothing but an xml file.

 

 

2. Go to System Administration -> System Configuration -> Universal Worklist
Administration
.

 

 

Click on Click to Manage Item Types and View Definitions under Universal
Worklist Content Configuration

As shown below:

 

2nd_step.jpg

 

3.After that select the xml file, go to end of the page and download the file.3rd-step.JPG

 

4. Save it to your desktop and make a copy to preserve the original file.

 

5. Open the file with any XML editor or word pad and do the below changes,

    

      5.1To hide the Alert tab: change the visibility to no as shown below:5th1-step.JPG

 

    5.2  To Hide Notification Tab: Change the below given visibility to no.

 

5th2-step.JPG

 

   5.3  To hide Tracking Tab, change the visibility to no, as shown below:

 

5th3-step.JPG

 

 

 

6) Save the file after doing above changes. 

 

7) Go to the next tab in portal “Upload new configuration”.7th-step.jpg

 

 

Fill the Configuration name :  com.sap.pct.erp.mss.Main

Check the high priority.

Browse the file. And upload.

 

 

 

8) Next, message would be displayed that the file already exists. Choose yes to overwrite and save.

 

Now, check the uwl iview for the result.

 

after_change.JPG

 

 

 

Note:
if you are checking by any role. Then please ensure that the same iview is linked
to the role for which you checked the property in step 1.

 

Hope this document helps people.

Thanks

.

Welcome to the September edition of the SAP Portal News Blog in 2013. We have news for you around the following areas:

  • SAP TechEd
  • Cloud Portal
  • Mobile Portal
  • Blogs from the Portal Community

 

SAP TechED

 

We already informed you some time ago in our SAP TechEd blog on the set of educational sessions and hands-on exercises planned for SAP TechEd this year.

 

Meet now also some of our SAP TechEd speakers!

 

Tamas Szirtes who is working for Intenzz, one of our partner companies. He is speaker for the session POP114 Using a Mobile Portal to Monitor SAP HANA ASUG TechEd Session in Las Vegas. Read Tammy Powlas blog introducing Tamas and giving you more information on his session.

 

Aviad Rivlin "SAP Portal Product Manager" who is giving you a short preview of his planned activities at SAP TechEd this year: he is going to share with you all information on SAP NetWeaver Portal, mobile edition and on the integration between SAP Fiori and Mobile Portal.

 

 

Ifat Shwartz "HANA Cloud Portal Product Manager" who is giving you a preview on the latest innovations and capabilities of HANA Cloud Portal which she will present you this year at SAP TechEd in Amsterdam.

 

 

Yariv Zur who is a SAP Mentor and Director of Solution Management at SAP. His main focus is on SAP Portal, User Interface and User Productivity in the Enterprise world - Cloud based, On Premise and Mobile. In Yariv's sessions at SAP TechEd 2013 attendees can expect to experience Yariv's interpretation of SAP's UI strategy and gain guidance for their projects:

 

 

 

Reminder: SAP Portal Stars Challenge

We would like to launch another SAP Portal Stars challenge this year just prior to SAP TechEd 2013. This challenge provides you a platform to expose your innovative company to other portal customers and increase your brand visibility as a thought leader in this area. Contact us and share with us your Portal experiences. More information about the initiative and how to participate: see the blog SAP Portal Stars Strike Back by Aviad Rivlin.

 

 

SAP HANA Cloud Portal

 

Register for Partner Test, Palo Alto 19-21 November 2013

You are invited to get your hands on SAP HANA Cloud Portal during a free partner test event hosted in Palo Alto from November 19-21. During this event, you would have the chance to experience the technology of SAP HANA Cloud Portal, running on top of SAP HANA for in-memory computing. You would learn how to quickly and easily create engaging cloud-based business sites, and integrate with other SAP and non-SAP cloud solutions.

 

Some information on the tester profile:

  • Experience with Java development
  • Experience with developing web applications (HTML, JavaScript)
  • Cloud technology experience

In case you are working for a SAP partner company and you fullfill the tester profile, you can register here. Even though you cannot make it for the event, you can experience how to create cloud-based business sites by registering for a free and unlimited Cloud Portal trial with your SAP ID or SCN credentials.

 

HR Extensions with SuccessFactors and HANA Cloud Portal

This new screencast shows you how HANA Cloud Portal is integrated into SuccessFactors as an enabler for HR extensions:

 

 

Read also this blog by Filip Misovski to get more background information on this topic.

 

Out of the box sites for Cloud Portal

We launched two new beautiful websites available for free to all cloud portal users. These sample sites designed to give you a jump start on your first steps in setting up a site using SAP HANA Cloud Portal. Both sites were created based on the out-of-the-box content provided with Cloud Portal, therefore you can easily customize their content and branding for a wide range of scenarios.

 

Cloud Portal Hangout

Watch this new Google Hangout on HANA Cloud Portal with Sonali Mukherjee, SAP Technical Consultant at Ciber in the US. Sonali reports on her experiences with the product and the benefits she sees for partners and customers.

 

 

SAP Portal, Mobile Edition

 

SAP Fiori and Mobile Portal available as RPD Edition

SAP is now offering a new Rapid Deployment Solution (RDS) for SAP Fiori and the mobile portal. This new service will quickly and easily setup the mobile portal on your existing SAP NetWeaver Portal, and integrate the Fiori applications into it - proving you an extendable, role based, single point of access for your mobile apps and content. More information in this blog by Aviad Rivlin.

 

Creating Dynamic Actions for Your Mobile Framework Page Application

Read this blog by SAP Portal developer Yotam Kadishay, one of the client-side developers who implemented the new mobile framework page. Yotam describes how the SAP NetWeaver Portal mobile framework page gives you the ability to create dynamic actions for your applications, and add them to the framework action bar.

 

 

Blogs from the Portal Community on SCN

 

We recommend reading the following blogs on SCN:

 

Thanks to Murali, Fouad and Andy for their great contributions.

As you all know portal 7.3 has an ajax framework page which means that not the whole page is reloaded but only the contentarea div. So where do you have to place your google analytic code so that every time a user visits a page/iview the data is send to google?

 

That’s an easy question: you have to place it somewhere in the contentarea. So the easiest way is to create an iView with your google analytic code in it and to add that iview in every page. But what if you already have a lot of iViews or pages and you do not want to go to every page and add that iView? And in some cases you only have an iView so you have to add you existed iView in a new page and also add your google analytic iview to it => overkill.

 

Another solution is to download the contentarea war file from your server and change the code and then overwrite SAP code. But that solution I prefer not to use in this case.

 

So what I did was create an iView and add it to the Ajax framework page/ custom ajax framework page and thats it!
I listen to the event “navigate” and every time that happens the data is send to google. Which means this also works for Web Page Composer(WPC) pages.

First you need to create a portal application. After you deployed it to the server you create an iView of it and then add it to the framework page you use.

 

You can find the source code here. After unzippen it you have to import into youre NWDS(Import > General > File system).(Don't forget to change the google analytics id in the iview properties as explained below)

 

See below for the steps in detail:

 

Prerequisites:

- Create a Google Analytics account(https://www.google.com/analytics/web/provision?et=&authuser=#provision/SignUp/)

- Portal Server should be able to access(telnet) to www.google-analytics.com(check this with your basis team)

 

1) create a portal application

create_portalapp.pngcreate_portalapp_2.png

 

Click Next > Finish.

 

After the application project is created you have to create an portal application object.

 

Right click on the portal application project you just created. Follow the next steps:

 

create_portalapp_3.png

create_portalapp_4.png

create_portalapp_5.pngcreate_portalapp_6.pngcreate_portalapp_7.png

After clicking Finish the portal object will be created and the googleanalytics.java file will be open in your NWDS.
The only code will put in the doContent method of the AbstractPortalComponent is:

 

package flexso.com;
import com.sapportals.portal.prt.component.*;
import com.sapportals.portal.prt.resource.IResource;
public class googleanalytics extends AbstractPortalComponent
{
    public void doContent(IPortalComponentRequest request, IPortalComponentResponse response)
    {
              response.include(request, request.getResource(IResource.JSP,
        "jsp/analytics.jsp"));
    }
}

 

(Don't forget to add the import statement "import com.sapportals.portal.prt.resource.IResource;")

The above code will load the jsp file that we still need to create.(see next step)

 

Next step is to create the JSP file where the google analytic code will be placed.

So first drilldown to the folder jsp under dist > PORTAL-INF > jsp and right click.

 

create_portalapp_8.png

create_portalapp_9.png

create_portalapp_10.png

Attention: the name that you use here has to be the same as the one you used in the doContent method in the java file.

Click Finish to proceed.

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import = "com.sapportals.portal.prt.component.IPortalComponentRequest" %>
<%@ page import = "com.sapportals.portal.prt.component.IPortalComponentResponse" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>analytics</title>
<!-- begin part 1 -->
<%
          String googleID = componentRequest.getComponentContext().getProfile().getProperty("googleanalytics.id");
%>
<!-- end part 1 -->
<script>
// begin part 4
function callbackGetNodeInfo(currentNode){
          (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
                    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
                    ga('create', '<%=googleID%>', 'flexso.com');
                    ga('set', 'title', currentNode.getTitle());
                    ga('set', 'location', currentNode.getNodeURI());
                    var loggindUser = LSAPI.AFPPlugin.configuration.getUser().FirstName + 
                                                                      ", "          +
                                                                      LSAPI.AFPPlugin.configuration.getUser().LastName +
                                                                      " ("+
                                                                      LSAPI.AFPPlugin.configuration.getUser().LogonUid +
                                                                      ")";
                    ga('set', 'dimension1', loggindUser);
                    ga('send', 'pageview',{
                                'dimension1': loggindUser
                    });
}
// end part 4
// begin part 3
function navigationEventHandler(eventObj) {
   //eventObj.dataObject.target.split("?")[0] this will split the target at "?" and [0] will return the first part of target value which is the navurl
  if(typeof eventObj.dataObject.target === "string"){ 
        LSAPI.AFPPlugin.model.getNode(eventObj.dataObject.target.split("?")[0],callbackGetNodeInfo);
   }else  
        LSAPI.AFPPlugin.model.getFirstNode(callbackGetNodeInfo);
// end part 3
// begin part 2 
EPCM.subscribeEvent("urn:com.sapportals:navigation", "Navigate", navigationEventHandler);//when you are navigate in the portal
EPCM.subscribeEvent("urn:com.sapportals.portal:browser","load", navigationEventHandler);//when you load the page
// end part 2
</script>
</head>
<body>
</body>
</html>

 

 

The JSP is divided in 4 parts:

 

Part 1: Is some java code to get the value of our google analytics id.(Which is provided by Google) This property will be maintenable through the iview property of the application. Which makes it easy when you transport the iview to acceptance or production you then only need to change the value of the property.

 

Part 2: Is the subscribeEvent method. With that piece of code you will run your EventHandler method every time the navigation event is triggered.

 

Part 3: Is the actual method that will be executed. In that method I use the getNode method of the LSAPI object. For more information about the LSAPI navigation method see the url: http://help.sap.com/saphelp_nw73/helpdata/en/c8/5eacdc37434cfb8ec5e5288b884100/frameset.htm

 

Part 4: Is the code that you get from google analytics. You only need to change the actual id with <%=googleID%> so it gets the value stored in the iview property. In this part I also added some additional information like user name , firstname and loginid which can be viewed in a custom report.(For more information check google analytics documentation) Attention: do not forget to change 'flexso.com'. You can find the value that you have to put there in your google analytic piece of code that is generated by google.

 

The last part of the portal object is to add the property googleanalytics in the portalapp.xml.

Replace the part <component-profile/> with:

 

      <component-profile>
        <property name="googleanalytics.id" value="UA-XXXXX-Y">
          <property name="category" value="Google Analytics"/>
        </property>
      </component-profile>

 

Now the application is done and you need to deploy it to the server.

Once it deployed on the server the last step is to create an iview of it and add it to the ajax framework page you use.

 

Steps to follow:

 

Go to Content Administration > Portal Content Management > Portal Application.

create_iview_from_portalapp.png

Create an iview from the application by copying it to a folder in the Portal Content.

 

create_iview_from_portalapp_2.png

create_iview_from_portalapp_3.png

create_iview_from_portalapp_4.png

After you created the iview you must change the property "googleanalyticsid" in the property of the iview.

 

create_iview_from_portalapp_5.png

Click on the button "Modify Properties" and change the value with the id from google.

Do not forget to change the property "authentication scheme" to anonymous if you also want to track anonymous user on your portal.

 

Now you still need to add this iview to your framework page. If you use the SAP standard ajax framework page it is best to copy that page and change that one.

If you have a custom framework page just add this iview to it. If you don't have a container for "technical/hidden iviews" make sur the iview has no tray or something visible. (Maybe you can set the height to 1px).

 

In this example I will add the iview to standard framework.

You can find the standard SAP Ajax Framework page under: Portal Content > Portal Users > Standard Portal Users > Ajax Framework Content.

 

add_iview_to_frameworkpage.png

Open the page and select youre google analytic iview and right click on it and select Add iview to page > Delta link.

 

add_iview_to_frameworkpage_2.png

 

The last step is to change the container where the iview will be placed.

 

add_iview_to_frameworkpage_3.png

 

Now save your changes and go to your google account do some tests.

 

PS: this is my first blog.

Enjoy!

SAP NetWeaver Portal has a component called “Activity Data Collector (ADC)” which traces user and content activity, monitors portal requests and maintains details of each request, such as the logged-on user, processing time and the iView requested and creates a record in a file. More details on activating ADC by Aviad in his blog - SAP NetWeaver Portal 7.3 – Activity Data Collector Enhancements.   SAP NetWeaver Portal does not provide an out-of-the-box capability for reporting on the information collected by the ADC. Hence, it’s left to the customer to analyze the raw information from these files and develop a reporting mechanism.

 

I recently came across Lumira – a data visualization tool (formerly known as Visual Intelligence) and found it very easy to use. Few months back, SAP made it available on the HANA Cloud and hence there is no need to install a software on your PC. You can create reports from the browser and share it with other users. Since its HTML5 based, users can view it on any device.  I wanted to showcase how you could use this tool to display Portal Activity reports in a more visual manner.

 

Step 1: Setup ADC and generate a file. The file which I am using is below

01.jpg

 

Step 2: Login into Lumira Cloud to create a Dataset

02.jpg

Once you upload the file, it will automatically detect the measures and attributes. I have change the measure to aggregate based on Count.

03.jpg

Step 3: Build your report

 

In the design area, select the type of chart from the visualization tab and select your X/Y axis fields

04.jpg

Save the report. It is now ready to be accessed and shared across.

 

This is how the report would show up when accessing from Home page. This report shows the top iView being used on the SAP Portal

05.jpg

 

You can also share the report to other users who can view it with their Lumira Cloud login.

06.jpg

 

Below is snap shot of the email which is being generated.

07.jpg

You could go and create N number of reports in a very simple fashion. I have just created few reports to give an idea.

 

08.jpg

 

The below report shows Top active users on the SAP Portal. I have further filtered it to find top users accessing “Change Orders and Operations” iView using IE Browser.

09.jpg

 

A simple pie chart to show the user types - Authenticated vs Anonymous access to SAP Portal

10.jpg

Hope you found this informative.

Often I get complaints if the SAP Portal is still running. The portal seems to be slow, pages are empty. I know what is going on, I am developing the custom framework, fixing some bugs or adding new functionality. Deploying the portal application takes some time and you will notice it.

 

 

Now most of the intelligence in the custom framework (Ajax) is client side. This means that you can call javascript functions that retrieve information from the backend (LSAPI). Previously I had to change the code in NWDS, deploy it and wait for some seconds to see the result. My collegues yelled at me again: "Noël are you deploying?". With a big smile I did not say anything.

 

 

Well... my collegues love me once more. How? I am using Fiddler (and other HTTP watchers) and discovered there's a neat functionality in it. It's called "Autoresponder". http://www.youtube.com/watch?v=h3DWqYXKarA

 

 

Ok, here's the deal. Step by step this time to set everything up.

 

 

Step 1:

Get the files you will change a lot. In my case they are located in my portal application.

Screenshot - 20-8-2013 , 12_57_08.png

 

Step 2:

Copy and paste the files into a folder (e.g. d:\noel\fiddler)

Screenshot - 20-8-2013 , 12_58_35.png

 

Step 3:

Setup fiddler with autoresponder settings:

 

Screenshot - 20-8-2013 , 13_00_59.png

 

Go to Autoresponder > Add rule. Now you need to know the location of your css and js files while viewing as an end user:

Screenshot - 20-8-2013 , 13_03_45.png

 

Copy and paste the url of the css file into the rule definition

 

Screenshot - 20-8-2013 , 13_07_21.png

When Fiddler sees this file, it will be 'replaced' by the one you defined.

 

 

Step 4: Enable it

 

Screenshot - 20-8-2013 , 13_10_54.png

 

 

Step 5:

Change your local files as often as you like. No one will notice it!!!

 

 

Step 6:

Don't forget to save your changes back to the origional source (portal project) when you are finished.

 

 

Happy developing!

 

 

/*

Noël Hendrikx - SAP Portal consultant @ Peppie Portals.

Specialized in Corporate branding SAP Portal / Adobe Interactive Forms.

 

UI Theming blog series

Portal theming - also waited a couple of years?

How to... UI Theme Designer - Installation

How to... UI Theme Designer - Migration

How to... UI Theme Designer - Locating elements

How to... UI Theme Designer - Transportation

 

 

Other blogs:

Tired of zipping / unzipping portal theme?

Tips for the Portal Content Studio

DSM Terminator and popup blockers (or not)

My best development friend - Autoresponder FTW

/*

The SAP NetWeaver Portal, mobile edition is a multichannel role based single point of access to application (SAP and non-SAP, web and native) and content (documents, RSS feeds, and media) accessible to users anytime on multiple devices (desktop, smartphone and tablet).

 

SAP Fiori is an example of content that can be integrated into the portal seamlessly. It is a collection of applications providing a consistent and enhanced user experience of the most broadly and frequently used SAP software functions that can be accessed from mobile and desktop devices.

 

 

To accelerate the implementation of this joint scenario, SAP is now offering a new Rapid Deployment Solution (RDS) for SAP Fiori and the mobile portal. This new service will quickly and easily setup the mobile portal on your existing SAP NetWeaver Portal, and integrate the Fiori applications into it - proving you an extendable, role based, single point of access for your mobile apps and content.

 

Additional info:

 

For any question, feel free to comment below.

Aviad

Overview

 

The Mobile Framework Page (MFP) was developed for "tablet" and "smartphone" devices.

To make using the mobile portal easier for first-time users, we developed a "Quick Guide" that provides a brief explanation about the main UI elements of the MFP.

The "quick guide" openes each time an end user enters the portal via the MFP. To stop displaying the guide, the user can select the "Do not show this again" check box.

Pic1.PNG

By tapping the black arrows, or swiping the screen, users can page through the "quick guide" to learn about the different UI elements. The relevant UI element is highlighted, and a short description about the element is presented.

Pic2.PNG

We also added an entry to the toolbox for opening the "quick guide" manually. This item is part of the "eu_mobile_role".

when opens the "quick guide" from the toolbox,  it openes in a separate tab, the toolbox entry is also available for users who selected the "Do not show this again" check box.

Pic2.PNG

 

Enabling the Quick Guide for a Specific User

 

The information about whether to expose the tutorial per user is maintained in the UCD.

If a user selected the "Do not show this again" checkbox and would like to see the tutorial again when opening the MFP, the administrator can expose it again by doing the following:

1. Access the UCD Cleanup Tool using the following URL: http://<server>:<port>/irj/servlet/prt/portal/prteventname/HtmlbEvent/prtroot/com.sap.portal.pcd.admintools.ucdadmin.default

2. Enter a principal name (the user ID) and choose Show. -> A table of UCD users is displayed.

3. Select the user for which you want to enable the "quick guide" and check the "MFP_TUTORIAL" entry -> "Remove" -> "Close"

 

 

Disabling the Entire Feature

 

The "quick guide" is an iView that is part of both Tablet and Smartphone framework pages. If administrators choos not to show the quick guide, they need to do the following:

1. Set the iView "Quick Guide" to "not visible" in the Tablet Framework Page.

 

2 .Set the iView "Quick Guide" to "not visible" in the Smartphone Framework Page.

Pic5.PNG

3. Set both the Tablet and Smartphone "Quick Guide" iViews to invisible in the "eu_mobile_role".

Pic6.PNG

 

* If the administrator removes the iViews from the framework pages, and leaves it on the role, tapping the Quick Guide from the toolbox will open a new tab with the framework page without the Quick Guide.

 

Technical Information

 

JSON

 

The quick guide is based on a JSON that represents the UI elements to display. Each element in the JSON is represented as a page in the guide.

The JSON is maintained as a property on the "Quick Guide" iVIew. In order to view the JSON, open the iView from within one of the framework pages and look for the property "TabletJsonConfiguration" or "SmartPhoneJsonConfiguration" per requested JSON.

The JSON can be changed according to the administrators decision.

The structure:

Pic7.PNG

All text is taken from a resource bundle (for translations), so text can be changed by changing the properties file of the iView on the server itself.

 

The attributes:

 

title                       - the title of the UI element that is displayed, taken from a resource bundle (e.g. the text "Launcher" in the second screenshot)

 

arrowposition      - as you can see, there is an arrow pointing to the UI element on the screen, the arrow appears as part of the page and could 

                                point to a general position on the screen. The values it gets are 0-12. 0 means no arrow and 1-12 draw an arrow according to a position

                                on a clock face (e.g. 11 is the second screenshot)

 

text                       - represents the main text of the guide, taken from a resource bundle (e.g. the text "Open applications and ..." in the second screenshot)

 

headertext           - relevant for the first and last page, taken from a resource bundle (e.g. the text "Welcome to SAP NetWeaver Portal..." in the first screenshot)

 

helptext                - relevant for the first and last page, taken from a resource bundle (e.g. the text "You can open the Quick..." in the first screenshot)

 

helpiconcssclas - relevant for the first and last page, represents the image to take from the sprite (e.g. the "light bulb" in the first screenshot)

 

cssclass              - represents the image to take from the sprite (e.g. the "Launcher icon" in the second screenshot)

 

idofuielement      - the ID of the UI element that we want to highlight on the framework

 

func                     - calls a function on the client side, enables to perform necessary actions on the framework (e.g. opening the toolbox to display "search")

 

 

Resources

 

All the images are maintained in a sprite file that is maintained in the Web Resource Repository (WRR) and could be replaced by the administrator.

The css and less files are also placed in the WRR and can be replaced as well.

The entry to look for in the WRR is pcd:resource_repository/application_branding/~com.sap.portal.navigation.mobile.apps.tutorial

Pic8.PNG

The properties files are part of the iView. There is a file per language. The administrator can change the text in the properties files as well.

Of course all changes done there will be overwritten in the next upgrade.

 

Landscape / Portrait

 

All position calculations are made according to percentages, that way, the guide changes according to the state of the device.

Welcome to this edition of the SAP Portal News Blog. SAP TechEd season is approaching and already in this edition SAP TechEd is playing an important role. On top of this we will inform you about news on:

  • Cloud Portal
  • Mobile Portal
  • Portal Upgrade
  • Blogs from the Portal Community

 

SAP TechEd 2013

 

SAP Portal Sessions and Lectures

The SAP Portal team is ready for another exciting SAP TechEd season. We are looking forward to meet our customers and partners in Las Vegas, Amsterdam or Bangalore. We will offer a full set of educational sessions and hands-on exercises focusing on the SAP Portal portfolio:

  • SAP Portal Portfolio - Overview & Roadmap for Portal on Premise, SAP HANA Cloud Portal, Mobile Portal, and HANA UI Integration Services
  • SAP NetWeaver Portal 7.4 - What's new and recommendations for upgrade
  • SAP NetWeaver Portal, Mobile Edition
  • SAP HANA Cloud Portal
  • Next generation content management in SAP NetWeaver Portal

You can find more information in this blog SAP Portal Team at SAP TechEd 2013: Some First Information.

 

Watch this movie and meet Amir Blich "Head of SAP Portal Go-to-Market team" who is giving you a short preview of SAP Portal's planned activities at SAP TechEd:

 

 

 

SAP Portal Star Challenge for SAP TechEd
Following our last year's very successful SAP Portal Star challenge, we would like to launch another challenge this year just prior to SAP TechEd 2013. We would like to invite you to share your SAP Portal experience and success in a recorded “blog”. How to do that? After accepting our invitation to join the 2013 #sapportalstars challenge, we will "hang-out" together about your topic by using the Google hangouts to share information, discussions and knowledge.

Just prior to SAP TechEd, we will produce a nice summary video of all of the participants talking about their product experiences. Everyone who is running a SAP Portal can participate - customers, partners, SAP Employees. Your participation should be completed by September 13th.


More information about the initiative and how to participate: see the blog SAP Portal Stars Strike Back by Aviad Rivlin and Launching Portal Hangouts by Amir Blich

 

We can already share with you our first SAP Portal Star hang-out for 2013 with Simon Kemp from PLAUT IT, Australia who - on top of his regular job - is a SAP mentor and very active in the SCN Portal community:

 

 

 

Vote in SAP Portal Poll

Imagine you would attend SAP TechEd 2013 - maybe you also plan to go there. Which Portal sessions and lectures would you plan to attend and what kind of topic would most attract your attention? Vote in this poll and give us your opinion.

 

 

Mobile Portal

 

Webinars

In case you are working for a SAP partner company, you can register for the following partner webinar: Increase Users’ Productivity on-the-go with SAP NetWeaver Portal, mobile edition on August 27, 2013. You can register for this event here.

 

 

SAP HANA Cloud Portal

 

SAP Runs SAP

Some weeks ago we launched the new HR site named SAPlus that was implemented using SAP HANA Cloud Portal. SAPlus is a site of leisure and benefits for SAP employees and their families in Israel. It represents a great collaboration between HR and the Cloud Portal development team that jointly designed and created a website with an engaging user experience, providing unique editing capabilities for online content updates and archiving. With this solution in place, SAP employees in Israel will be able to register to local events, join sport activities, contribute to the community and more. More information in this blog by Ifat Shwartz.


SAP HANA Cloud Challenge 2013

The SAP HANA Cloud Portal team is excited to launch a new challenge for 2013. We invite you to take part in our latest contest: Design and build your unique custom-branded site using a great variety of tools and open standards.

During October 2013 we will announce the top sites coming out of this contest. The winners will be showcased at the SAP TechEd EMEA conference this year. SAP TechEd attendees will be invited to join the Cloud Portal team and have their sites presented at a Customer Showcase session. More information: see in this blog.

 

How to Connect HANA Cloud Portal to a Backend System

Read this blog written by Cloud Portal developer Tomer Gabbai on one of the most powerful capabilities of this product: easy integration with SAP back-end systems. In his blog Tomer explains how to create a connection between Cloud Portal and SAP CRM back-end system


SAP HANA Cloud Portal Partner Test: Recap
During June 11-13 we conducted a partner test workshop in Walldorf with a big group of 28 partners from various companies and countries representing different business areas. The partners tested our new cloud solution SAP HANA Cloud Portal and gave us their detailed feedback. Several of the partners already had EP experience and were looking for the opportunity to expand their practice knowledge and expertise to the cloud. The partners went through various hands-on sessions and free-style development sessions. All the sessions were conducted using the HANA Cloud Portal free trial. The 3 days concluded with a successful feedback session presented by the partners to the Cloud Portal management team. In the blog by Ifat Shwartz you find a detailed summary of the workshop. You can also read in another blog how Ted Castelijns (one of the partners) experienced the workshop.

 

 

SAP NetWeaver PORTAL UPGRADE INFORMATION


Based on customer experience and our own SAP Portal experts, we have collected an exhaustive set of resources, guidelines, important information and known issues that can be helpful before, during and after an upgrade to SAP NetWeaver Portal 7.3. Read this SCN document to get a better idea about the upgrade process.

In addition we recommend reading one of our most popular SCN blogs written by SAP Portal Product Manager Thomas Hensel, who describes in detail how to start a Portal project based on SAP NetWeaver 7.3.

 

 

Blogs from the Portal Community

 

We recommend reading the following helpful and valuable blogs from the SAP Portal and HANA Cloud Portal Community on SCN:

 

 

Thanks for your great contributions!

Background:

 

We upgraded our Portal from 7.0 to 7.31 which was a huge leap forward and there was so much things we need to consider while doing this upgrade. In 7.0 all Portal components used were all PAR files and now there are no PARS. You will have to migrate all these files. One of the challenges we had was modifying the standard Portal logon page. We had to go through numerous documents on how to modify the logon pages, how to modify the war files in NWDS using NWDI and how to package the war file into an ear and deploy to the server. All the pains gone through to make that a success is the reflection of this document.

 

Solution Implementation:

 

1. Open your NWDS and logon to NWDI. Navigate to the Development Configuration in which you would like to create this new development component.

2. Create a Web Module Development Component.

WebModule DC.png

3. Give the Web Module DC Details. Click finish. This will automatically create an activity in NWDS and attach all the files and folders to it respectively.

WebMod DC Details.png

4. It's time to now import the standard logon file from the server that was downloaded. Right Click on the DC and import WAR File.

Import WAR.png

5. Select the War File Location and a new local Web project name where the contents will be uploaded.

Import.png

6. In the above step the default jar files will be added to the lib folder in the local web project. Additional jar files that are required to be added to eliminate the errors in jsp's can also be added.

7. Copy the Web Content Folder of local project and replace the web contents folder inside the NWDI DC.

8. Modify the JSP Files as required to customize your logon screen. Build the DC.

9. This DC is not directly deployable. You will need to package this into another DC of type Enterprise Application.

Ent App.png

10. Give the DC Details.

DC Details.png

11. Select the Web Module Project in the Next Screen so the WAR file is added to the deployment descriptor of the the new DC created for deployment.

Select Web Module Project.png

12. Modify the application-j2ee-engine.xml file in the DC as below. Provider name for the application is usually your client name. The provider name defines your namespace where your applications reside on the AS Java.

application-j2ee-engine.png

13. Now, Right click on your DC and Java EE Tools > Generate Deployment Descriptor Stub. This will generate application.xml file.

14.The application.xml file will look like the below. By default the Context-Root will be referring to the Web Module DC you created but you can modify the Context-Root Name to a different one which will be used in the NWA Configuration for the logon page.

application.png

15. Build your DC and Deploy it to the server.

 

Hurray !!! Next Step is your nwa configuration where you need to give the context-root name that we used above and restart the server.





Actions

Filter Blog

By author:
By date:
By tag: