Tell me more ×
WordPress Answers is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.
up vote 0 down vote favorite

I have uploaded a file as my main logo within the theme settings but would like a different logo on the main page. The theme I am using has a custom css option within the theme settings, can I use custom css to only change it on the front page and not the rest of the site?

Theme: http://demo.ghostpool.com/?theme=bounce-bp

share|improve this question
1  
Your question needs to be considerably more specific. Please show us the code for the logo in index.php – AndrettiMilas Jan 24 at 17:22
Sorry, here are my php files: index php- pastebin.com/YEMnpR2g header php- pastebin.com/n7vdZdZ3 – user26480 Jan 24 at 17:49

3 Answers

up vote 0 down vote accepted

It looks like the theme designer has a means for you to use a different logo on the homepage. Looking at your header.php on lines 83-93.

If your theme detects that this is the front page, the title is enclosed with an <h1> tag, otherwise it is enclosed in a <div>. Both have id='logo'.

If you can add custom css, you could use css image replacement to replace this <h1> tag with a different image on your homepage.

share|improve this answer
That worked perfectly! Thanks everyone! – user26480 Jan 24 at 19:10
up vote 0 down vote

at header.php you can found this tags:

<div id="logo" style="">             
    <span class="logo-details">Bounce |   Example Homepage 1</span>
    <a href="http://demo.ghostpool.com/bounce" title="Bounce"><span class="default-logo"></span></a>                    
</div>

You just need access the a style-colorchoose.css at line 43 and change image path at class .default-logo, if you inspect using chrome developer tool you can find this class calling a logo from CSS using this class I mentioned.

Know if this theme offer a solution to change logo it's other way they cannot help you.

Contact me if you need a help.

share|improve this answer
Yes, the theme offers a solution to upload a logo which I have uploaded already. The problem I have is that i need a different logo on on only 1 page(homepage). I found a css file which references the themes colors and it shows this: /* Logo */ .default-logo { background-image: url(lib/images/logo-darkblue.png); } – user26480 Jan 24 at 18:15
But this action change a logo every pages. To change only to home, you need saw how class is applied to home, using a inspector at chrome you can saw all classes applied to body and using this you can add a exception adding line after default-logo this way: .classe-home-used .default-logo { background-image: url(http://yoursite.com/wp-content/uploads/2012/01/logo-onlyhome.png); } – Rick Benetti Jan 24 at 18:25
That darkblue.png is the default logo for the theme, it was replaced when I uploaded a logo using the option in the theme settings. Here is the site: are.massideation.com – user26480 Jan 24 at 18:30
The .default-logo class only gets applied if you haven't specified an image in the theme options panel. – cpilko Jan 24 at 18:30
up vote 0 down vote

There are many ways to do this. Let's go.

1. Just Header File

Open your header.php and find when logo is displaying and add conditional home tag. Something like this:

<?php if(is_home()) { ?>
<!-- your custom logo for home here -->
<?php } else { ?>
<!-- your theme logo function here -->
<?php } ?>

2. Using CSS Background Image

Open your header.php and go to tag. Add the body_class() function.

<body <?php body_class($class); ?>>

Now, you can customize any element on home with CSS. For Example:

body.home .default-logo {background-image:url(your-custom-logo-for-home.jpg) !important;}
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.