4 Replies Latest reply: Feb 7, 2013 8:20 AM by Mahmoud_Rabie RSS

    Modify Login Screen on Theme 24 (Cloudy) to add logo

    AshPatel2
      Application Express 4.1.1.00.23
      Internet Explorer - 8
      Oracle Database 11g Enterprise Edition Release 11.2.0.3.0 - 64bit Production
      Theme - Cloudy - 24

      Hi wondering if someone can help, I am using the Cloudy 24 theme for my application, I wanted to change the login screen and add to it the application logo. I downloaded one of oracles sample applications called "SAMPLE TREES", in which they have modified the login screen and put a logo on it. Ideally that is what I would exactly like my login page to look like but I dont know how to make my login scren look like the "SAMPLE TREES" login screen and replcae the logo they have used with my own.

      I have looked at the themes and templates in shared components but cant seem to work out how they have done it.

      Regards
      Ash
        • 1. Re: Modify Login Screen on Theme 24 (Cloudy) to add logo
          Mahmoud_Rabie
          Hi AshPatel2,
          I dont know how to make my login scren look like the "SAMPLE TREES" login screen and replace the logo they have used with my own.
          1) The information of the sample apex.oracle.com workspace containing the application of sample trees
          workspace : ralab
          username : test
          password : test
          application : 53647
          the url : http://apex.oracle.com/pls/apex/f?p=53647

          2) If you go to the Login Region template in the body section you will find the following code
          <section class="uRegion uRegionNoPadding clearfix uLoginRegion" id="#REGION_STATIC_ID#" #REGION_ATTRIBUTES#>
            <div class="uLoginHeading">
              <span class="bgArrow"></span>
              <div class="appIcon">
                <img src="#IMAGE_PREFIX#f_spacer.gif" class="appIcon #REGION_STATIC_ID#" alt=""/>
              </div> 
              <h1>#TITLE#</h1>
            </div>
            <div class="uLoginBody clearfix">
              #BODY#
              <span class="uButtonContainer">
                #CLOSE##PREVIOUS##NEXT##DELETE##EDIT##CHANGE##CREATE##CREATE2##EXPAND##COPY##HELP#
              </span>
            </div>
          </section>
          3) In particular, you need to replace this part with your logo div
              <div class="appIcon">
                <img src="#IMAGE_PREFIX#f_spacer.gif" class="appIcon #REGION_STATIC_ID#" alt=""/>
              </div>
          If this question is answered, please mark the thread as closed and assign points where earned..

          Best Regards
          Mahmoud
          • 2. Re: Modify Login Screen on Theme 24 (Cloudy) to add logo
            scott.wesley
            This may also be of assistance:
            http://www.grassroots-oracle.com/2011/07/modifying-your-apex-login-page.html
            • 3. Re: Modify Login Screen on Theme 24 (Cloudy) to add logo
              AshPatel2
              Thanks for all your help everyone, sorted : )