Hard coded logo image not showing up but background image are.

  • Resolved awhitley2

    (@awhitley2)


    12 years ago

    This is my first time converting html and css into a blank theme. I am attempting to convert a website that I built, into my own simple theme. All is going OK except my logo image is not showing up. It is hardcoded into the header file. All background images on the page are showing up just fine. All images are in the same folder so path shouldn’t be wrong. Here is a piece of my header code:

    <header>
		<div id="a5-header">
			<div id="logo"><a href="index.php"><img src="images/logo-try-3.png" width="297" height="114" alt="Web Tech By Design logo"></a>
			</div>

			<div id="headerText" class="description"><h1><?php bloginfo('description'); ?></h1>
			</div>

			<nav>
					<div id="a5-menu-box">
						<?php wp_nav_menu(array('menu'=>'Main Navigation Menu')); ?>
					</div>
			</nav>
		</div>
	</header>

    I have an images folder one level down from my index, header, footer, and sidebar php files. The logo image is in that file along with all other images that are showing up just fine.

    My images that are inserted into posts via the upload feature work just fine as well.

    Any suggestions as to what is wrong? My logo displays just fine in my static web setup before converting to a dynamic theme.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Pioneer Web Design

    (@swansonphotos)

    If you have a background image that is at the same display location as your header image you need to add the CSS for the Z axis (the theoretical space between your eyes and the images) that is larger for the forward image desired…

    https://www.w3schools.com/cssref/tryit.asp?filename=trycss_zindex

    michael.mariart

    (@michaelmariart)

    When you add in <img> tags, you should use a full path, not a relative path. There’s two reasons for this. First, it makes it a lot easier to see exactly where the image is being requested from. Second, if you use permalinks of anything but ?p=1234 then your images will be referenced from the same folder as the page that you’re on. As an example… Page ‘www.mysite.com/’ will reference the image from ‘www.mysite.com/images/logo-try-3.png’ BUT ‘www.mysite.com/pagename/’ will refernece the image from ‘www.mysite.com/pagename/images/logo-try-3.png’. That is the main reason that image links get broken.

    What I’d suggest is using something like this (remember to set your own image path to point to the correct location):

    <img src="<?php echo bloginfo('url'); ?>/images/logo-try-3.png" width="297" height="114" alt="Web Tech By Design logo" />

    As it is there, you’ll load the logo from ‘www.mysite.com/images/logo-try-3.png’ no matter which pagae on your site you are on.

    Thread Starter awhitley2

    (@awhitley2)

    Thanks for the replies. I will try what you say. This is a localhost installation, so I will have to figure out my absolute path to the image and use that I assume. Or since this will be a live site eventually I will download the images to the server folder and use an absolute path to that. Hopefully that will work with my localhost installation.

    Thread Starter awhitley2

    (@awhitley2)

    Success. Using the absolute path worked even though this is a localhost setup. I can see the logic of using the absolute paths when using the img tag. As long as the folder lives in that location and with the referenced image, the image will always show up. Thanks all!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Hard coded logo image not showing up but background image are.’ is closed to new replies.