This is an example of a custom login logo. I used my blog's logo to demonstrate.
To make a similar change, you need to edit the skins/Default/styles.css file. The default @ symbol logo is actually defined by a character, not an image. This has to be removed first. Look for the following in the CSS file...
skins/Default/styles.css
.login_panel .header .icon:before {
content: "\e63c";
display: inline-block;
vertical-align: middle;
font-size: 140px;
height: 100%;
width: 100%;
margin-top: -20px;
color: #D7D3C8;
text-shadow: 0 1px 0 #ffffff, 0 -1px 0 #b4afa0, -1px -1px #d2c6a5;
}
Delete the content: "\e63c"; line. Next look for the following in the CSS file...
skins/Default/styles.css
.login_panel .header .icon {
height: 95px;
width: 130px;
}
Change this to something like...
.login_panel .header .icon {
height: 81px;
width: 95px;
background-image: url(url_of_your_image.png);
}
Adjust the width, height and the URL according to your image.
Your custom logo should now appear on the login screen.
-i
Facebook
Twitter
Google+