Custom Font for Message Text Items On Self Service Page

Very often we get requirements to have custom look and feel for message text items in Self Service pages.
One of the requirement I had recently, was to show custom warning message in iExpanse page.

Here, I am explaining two ways to achieve this.

1> Using custom.xss

   > Change custom.xss file according to your requirement.
     >> Go to $OA_HTML/cabo/styles directory
     >> FTP the custom.xss file to your local system
     >> Add your custom style selector after
    <!-- Please start your customizations here -->

        <style selector= ".XXOraTestSS">
           <property name="font-family">Arial,Helvetica,Geneva,sans-serif</property>
           <property name="font-weight">bold</property>
           <property name="font-size">large</property>
           <property name="color">#cc0000</property>
        </style>


    <!-- Please end your customizations here -->

   > Put changed custom.xss file back to $OA_HTML/cabo/styles

   > Now login to application and add 'System Administration' responsibility to your user, if not added already.
 
   > Go to System Administrator > Application > Menu
     >> Search for 'ICX_SYSTEM_ADMINISTRATION'
     >> Add function 'Framework CSS Style Lookup Page' -- FWK_CSS_LOOKUP
     >> Give any Prompt name, like 'CSS Style'
     >> Save it and go to 'System Administration' responsibility, you can see the 'CSS Style' form function attached to the menu.
     >> Click on 'CSS Style', in the self service page you will be able to see your custom Style Selector  (XXOraTestSS) in the list attached to 'Style Selector'.
     >> Select 'Static Text' from Item Style and your custom Style Selector (XXOraTestSS) and 'GO'
     >> You can see the preview of your changes in 'Result of the Selection' region.
     >> If you are happy with the result.
        >> Personalize your self service page
        >> Create a new item and choose "Formatted Text" (or"Raw Text") Item Style
        >> In 'CSS Class' filed, provide your custom Style Selector (XXOraTestSS)
        >> 'Text' filed -> Put your message
        >> Apply and return to the application.

   > Remove the files from $OA_HTML/cabo/styles/cache directory
  
   > Bounce the Apache server 
     >> $INST_TOP/admin/scripts
        ./adapcctl.sh  stopall
        ./adapcctl.sh  startall

   > Login again to the application and hopefully you can see your changes.

2> Direct using HTML string

   > Personalize your self service page
     >> Create a new item and choose "Formatted Text" (or"Raw Text") Item Style
     >> In 'Text' filed, give HTML string based on your requirements
        Ex: <font face="Helvetica" color="red" size="4pt" weight="bold"><b>Test warning message</b></font>
     >> Apply and return to the application.