Modifying your APEX login page

If you would like your Login (101) screen looking a little more exciting, add a picture to paint a thousand words.

Update: You may be looking modify your APEX workspace login page. 
http://www.grassroots-oracle.com/2013/02/modifying-apex-workspace-login-page.html
or
http://www.oracle-and-apex.com/customize-the-apex-workspace-login-page/

Today I added a little polish to one of our sample applications, and I thought I'd share the relatively simple process.

As with all things Oracle, there are many ways to skin this... er, vegetable. The simplest is to edit the region properties for the container holding the username/password fields.

Here I added a region image definition of
#APP_IMAGES#sage_logo.gif
which referred to an image I've loaded into the Apex repository.

On a side note, it may be a good idea to parameterise the image location, but that's another story.

Alternatively, I could have added a Display Image item; modified the region source; added some pre-element text... I could go on, but this solution placed the image in a place that suited my imagination exactly.

Part of this decision was not fighting the product. Apex isn't always great at complying with your WYSIWYG thoughts, sometimes it's not worth spending 80% of the effort on manipulating layout.

I also thought the default width for the form region was excessively wide, so I thought I'd investigate where to change that. I wasn't exactly sure what this theme did, so I needed to look underneath the hood.

I'm a regular Chrome user, so out of the box I could right-click on something in my page and select "Inspect Element."
I happened to right-click in the table that houses my items, so I kept looking at the parent divs until I saw the width: 450px definition. Next to that is a link that names the CSS file that sets that attribute, so I opened that file; modified the value from 640 to 450, and refreshed my page to a nice ratio.

A simple task, hope it helps.

Scott