View Full Version : Add a logo to the left of my heading (WordPress)

08-27-2011, 07:54 PM
How can I add an 80px by 80px image to the left of my heading in wordpress?

The current code for the heading is:

<div id="wrapper">

<?php lightword_header_image(); ?>

<div id="header">

<?php lightword_rss_feed(); ?>


08-27-2011, 09:12 PM
Describe the position of the 80X80 image.
Since it would be taller than the space at the top, do you
want it to push down the page, or go "behind" the page?
And how far left? Over the date tabs?

Do a screenshot and use MS Paint to draw how it might look.


08-28-2011, 03:26 AM
I must have read my pixel ruler wrong.

Here is what I want:

08-28-2011, 04:23 AM
You'll have to dig around for what I guess might be your "header.php" file
located in the theme folder called "lightword".

There is a line that looks something like this:
<div id="top_cufon"><h1 id="logo"><a name="top" title="mmHudson" href="http://mmhudson.com">mmHudson</a> <small>Updates | Resources | Tutorials</small></h1></div>

It won't have "mmHudson" in there, but a WP variable instead.

Upload your image to the image folder in the "lightword" directory.

Then, change that line to something like this ... and since I can't test it,
this might not be correct ... I'm just guessing.

<div id="top_cufon"><a href="http://www.mmhudson.com"><img src="lightword/images/yourimage.png" style="float:left; padding-right:20px; border:none;" /></a><h1 id="logo"><a name="top" title="mmHudson" href="http://mmhudson.com">mmHudson</a> <small>Updates | Resources | Tutorials</small></h1></div>

The part in blue is what I added.
You have to reference your image correctly (the path and filename).


08-28-2011, 06:05 AM
Perfect. Thanks a million.

08-28-2011, 06:25 AM
Awesome. I use wordpress alot and that will be handy. :thumbsup:

08-28-2011, 07:25 AM
So what do you think of the look of that?

08-28-2011, 05:36 PM
Looks good.
That little color adds a touch to the otherwise gray contrast at the top.
I see you did some more inline CSS to adjust position ... good job on that.
If you are understanding CSS, you'll be able to customize many things in your theme.


08-28-2011, 07:02 PM
I know css and html pretty well, I just couldn't figure that out for some reason.


08-29-2011, 12:32 AM
I should mention to anyone that is customizing a theme (WordPress).
Always save a complete copy of your theme directory (folder) / all files, to a safe place on your PC.
That way, you can always see the original script, in the event you wreck something.

Only make changes to the theme directory ... do not make any changes to any other
WP file or directory. This is important, because if you update WP (which happens
all the time), you'll overwrite any changes you've made.

WP updates do not affect your theme, unless you're using the default WP theme.
For some odd reason, WP keeps making theme changes to their own default theme.
They should not be doing that, as it erases any customizations a user does.


08-29-2011, 05:56 AM
Well the thing is I can't actually update the theme either, because the theme has updates and they will overwrite the changes I made..