Customizing the Matrix Self Service Portal

by nigel.cook on 03-07-2010 03:05 AM

I was playing around with the BladeSystem Matrix creating some new demo videos, and I thought why not dig into the portal skinning features to create a custom look for my system.


The skinning feature is intended to let companies personalize the portal with their logos and product names, replacing the standard HP skin that ships with the product. In this example, my customer is the fictitious Acme Corporation.


Here are the steps I went through:



  1. Copy C:\Program Files\HP\Insight Orchestration\webapps\hpio-portal.war to my desktop

  2. Rename to hpio-portal.zip

  3. Copy hpio-portal.zip to hpio-portal.orig.zip

  4. Unzip hpio-portal.zip

  5. Browse to the hpio-portal/skins directory, and create a new folder "acme". You should see the following:


  6. Copy your new images into the acme directory. The image names, format, and recommended sizes are shown in the table below. I found there is minor flexibility in the sizes of images you create, but in general things look a little nicer if you stick to the sizes shown in the table.































    Filename



    Format



    Recommended Size in pixels
    (w x h)



    LoginScreenLogo.png



    PNG



    90 x 72



    LoginScreenImage.jpg



    JPEG



    408 x 287



    TitlebarLogo.gif



    GIF



    42 x 26



    TitlebarImage.png



    PNG



    300 x 40





  7. Edit the skinConfig.xml file in the skins directory. Here's my updated content:


    <properties>
         <property><key> personalizeMode                 </key><value>insight</value></property>
         <property><key> skinName                        </key><value>acme</value></property>
         <property><key> brandName                       </key><value>Acme Corporation</value></property>
         <property><key> portalName                      </key><value>Developer Self Service</value></property>
         <property><key> bsaURL                               </key><value></value></property>
    </properties>




  8. rezip hpio-portal directory
    Once you have re-zipped hpio-portal, you might want to open it and check that the top component of the zip file is the contents of the hpio-portal folder, and not a folder called "hpio-portal". Windows XP zip default behavior is to create that top level folder in the zip archive. Compare with the contents of hpio-portal.orig.zip to make sure you get this correct. Otherwise your portal won't restart correctly in the later steps.




  9. rename hpio-portal.zip to myportal.war file




  10. Stop the Insight Orchestration service




  11. Rename C:\Program Files\HP\Insight Orchestration\webapps\hpio-portal.war to hpio-portal.war.orig




  12. Copy myportal.war to C:\Program Files\HP\Insight Orchestration\webapps\hpio-portal.war




  13. Delete the folder in the C:\Program Files\HP\Insight Orchestration\work directory with a name starting with Jetty and containing the name hpio.portal.war




  14. Start the Insight Orchestration service




 Updated Portal


Here's my updated login screen to the self service portal, and a zoom in on the updated window bar after login is complete.



 


ioconfig Command


The ioconfig command in the C:\Program Files\HP\Insight Orchestration\bin folder is a useful utility that lets you switch between skins, for example: ioconfig --skin insight will change back to original skin. See ioconfig --help for more information on this command and options.


Send your examples


I hope this quick overview is helpful to getting you started. Send me examples of your self-service portal customizations!

We encourage you to share your comments on this post. Comments are moderated and will be reviewed and posted as promptly as possible during regular business hours.

To ensure your comment is published, please follow our community guidelines.

Comments
by Jesper(anon) on 04-04-2011 08:35 AM

Is it possible to change the color scheme of the portal?

Post a Comment
Be sure to enter a unique name. You can't reuse a name that's already in use.
Be sure to enter a unique email address. You can't reuse an email address that's already in use.
Type the characters you see in the picture above.Type the words you hear.

Find HP in Social Media

Facebook Twitter YouTube SlideShare Flickr
About the Author
  • Cynthia is part of the BCS marketing team. Interested in all things mission-critical and what's next on the horizon.
  • Ken is a cloud Architect in the CloudSystem team. Ken focuses on software, servers, Virtual Connect, networking and server virtualization to enable cloud solutions. Ken also develops white papers and best practices as part of the BladeSystem Readiness Team. You can find him on Twitter as @BladeGuy.
  • Hello! I am on the HP Enterprise Servers, Storage and Networking team, focused on Interactive Web and Social Media Marketing for (ISS) Industry Standard Servers. I will be sharing relevant ISS and HP news & info as it crosses my path.
  • Greetings! I am in the HP Converged Infrastructure team focused on Server, Storage & Networking group at HP and will be sharing news & info as it crosses my path.
  • Network industry experience for more than 20 years - Data Center, Voice over IP, security, remote access, routing, switching and wireless, with companies such as HP, Cisco, Juniper Networks and Novell.
Labels