If you are like me, you find Wordpress to be a perfect fit as a CMS for small sites. Despite the fact that it originated as a blogging platform, it is flexible enough for simple pages or complex functionality and editing.
I have found that many clients like the nice subtle touch of branding their wordpress administration panel. There used to be a plugin that made this process easier but it doesn’t seem to work with the latest versions of wordpress. Luckily this process is simple even with out it.
What are we customizing?
By default, in wordpress 2.6+ there are two spots that the Wordpress logo shows up. At the footer in the administration panel, and the login / logout page.
The first step is easy, we simply need to find those images and change switch the logo to our own. This is merely a matter of downloading the images, altering them, then re-uploading them to the server.
Both images are located in the /wordpress/wp-admin/images directory, you are looking for:
logo-ghost.png and logo-login.gif
They look like this:
Let's start with the login page. Open up logo-login.gif in your favorite image editor.
At this point all you have to do is replace these files with a copy of your logo. To keep things in proportion relative to the rest of the design, I recommend that you keep the width the same size as the original (290px) but you could make the image taller and still have a nice login page composition.
Once you are finished, save your file and upload it back into your /wordpress/wp-admin/images directory.
If you save the file with different dimensions you will need to do some minor editing to the CSS to ensure all of the logo is visible. This can be done via the following:
Download and open /wordpress/wp-admin/css/login.css
You are looking for this code:
h1 a {
background: url(../images/logo-login.gif) no-repeat;
width: 292px;
height: 187px;
text-indent: -9999px;
overflow: hidden;
padding-bottom: 15px;
display: block;
}
Simply alter the width and the height to match the dimensions of the file you just saved.
Save your changes, upload, and navigate to your login page to see your new logo in all of it’s glory.
The next step is to alter the footer logo which resides on every page in the administration panel. For this logo I recommend keeping the dimensions the same, as their is not a whole lot of room to tweak the size.
Simply open up the file in your image editor of choice, drop your logo in and save. (Make sure you save it as an index color png for consistency.)
If you did want to alter the size you will likely want to login to your admin panel and see how it looks. The logo we changed is a background image so there is a chance no alteration will be needed.
If the logo looks off, you will need to open up /wordpress/wp-admin/colors-classic.css or /wordpress/wp-admin/colors-fresh.css (depending on what color scheme you are using) and find the following CSS:
#footer {
background: url(../images/logo-ghost.png) #464646 no-repeat 20px 10px;
color: #999;
}
the 20px and 10px alter the background position of the logo. You can tweak and play with those until the logo looks like it is placed correctly. If the logo is larger than the footer you will most likely have to give #footer a height: ###px; equal or greater than the size of your logo.
The Color Scheme
The last step is to alter the color of your administration panel to fit the colors of your brand. You can do this by editing the same style sheet we just downloaded (/wordpress/wp-admin/colors-class.css or /wordpress/wp-admin/colors-fresh.css). I recommend altering the colors-fresh.css file so you can always switch back to default if necessary.
This is simply finding the colors and changing the hex codes in CSS. Hopefully you know enough about CSS where I don't have to spell out every step. However the main areas you will likely want to edit are:
#adminmenu
#sidemenu
#wphead
#rightnow and
.tablenav
I found it easiest to do a search and replace for specific colors and background colors, otherwise you could spend quite some time hunting through the CSS.
The Result
And their you have it! Here are a few shots of our results, pretty nice isn’t it?
xxoxo
on June 19, 2009
video klip download sites thanks