Need help re-adding a logo to the top left bar of my site

mannyopr · Member · Feb 22, 2015 at 12:55 am
Copy link

Add topic to favorites
Hey there, so I used a custom CSS code to insert a logo to the top left of my site. After some months, I tweaked the width and height of the logo from the CSS code but the logo disappears and hasn’t reappeared since. Here’s the code:

.main-navigation li.mannyopr_logo > a {
background: url(‘http://mannyopr.files.wordpress.com/2014/11/web_logo2.gif’) no-repeat scroll center center rgba(0,0,0,0);
display: block;
height: 40px;
margin: 0 25px 0 0;
overflow: hidden;
text-indent: 150%;
white-space: nowrap;
width: 196px;
}

.main-navigation li {
Vertical-align: middle;
}

My question is, How do I get the logo to reappear?

The blog I need help with is mannyopr.com

The blog I need help with is: (visible only to logged in users)
dannywellman · Member · Feb 22, 2015 at 3:15 am
Copy link
Hello there!

It looks like the id tag of the nav bar has changed. Try this:

#wp-admin-bar-blog > a {
background: url(‘http://mannyopr.files.wordpress.com/2014/11/web_logo2.gif’) no-repeat scroll center center rgba(0,0,0,0);
display: block;
height: 40px;
margin: 0 25px 0 0;
overflow: hidden;
text-indent: 150%;
white-space: nowrap;
width: 196px;
}

However, I’m not sure about the TOS for this hack. I didn’t see anything about removing their logo on the Admin bar, but who knows? Also, I don’t think this logo will show up for anyone unless they are signed in to WordPress. Either way, I think the CSS change should work for you!

Let me know if that does it, please!

Have a good evening!
mannyopr · Member · Feb 22, 2015 at 3:25 am
Copy link
Thanks! I’ll give it a try and give you an update
mannyopr · Member · Feb 22, 2015 at 3:34 am
Copy link
Hey there,

It didn’t work for the nav bar that has the menu (about, portfolio, blog, contact) which is where it was before I had the problem. However, it shows up on the admin bar just fine but I want it to show on the menu bar (to the left of about, portfolio, blog, contact).

I’m having trouble figuring out why the CSS code won’t work anymore when the same code worked when the logo was there.
dannywellman · Member · Feb 26, 2015 at 1:54 am
Copy link
Hello again!
I’m sorry about the delay. I was in Dallas for a couple days.

I also apologize for misunderstanding where you needed the logo. Could you try this out on your site?:

#menu-item-760 > a {
background: url(‘http://mannyopr.files.wordpress.com/2014/11/web_logo2.gif’) no-repeat scroll center center rgba(0,0,0,0);
display: block;
height: 52px;
margin: 0 25px 0 0;
text-indent: 100px;
white-space: nowrap;
}

The text-indent line determines how far away the About word is from the little logo. Fiddle with the number a bit to get the spacing the way you want.

FYI:
menu-item-760 is About
menu-item-762 is Portfolio
menu-item-759 is Blog
menu-item-761 is Contact

If you change a menu item in the future and want to tag the logo to it, you’ll need to know the exact id of that menu item. I found it by looking at the source code of your site.

I hope that one works for you! Let me know if it does or not, please.

Have a good evening!
mannyopr · Member · Feb 27, 2015 at 4:31 pm
Copy link
Thanks Dan!

I’ll give this one a try

No items found.