do i need css to add links inside image of custom header/

emchorush · Member · Jun 30, 2014 at 11:23 pm
Copy link

Add topic to favorites
do i need css to add links inside the custom header? if not how do i access the header to edit it?
thanks

The blog I need help with is: (visible only to logged in users)
thistimethisspace · Member · Jul 1, 2014 at 1:40 am
Copy link
You can create a custom menu with linked tabs as depicted here without any upgrade http://theme.wordpress.com/themes/twentytwelve/

Create pages http://en.support.wordpress.com/pages/
Create a custom menu http://en.support.wordpress.com/menus/
Adding Pages http://en.support.wordpress.com/menus/#adding-pages
Changing the Order & Creating Sub-Menus http://en.support.wordpress.com/menus/#changing-the-order-creating-sub-menus
kathrynwp · Staff · Jul 1, 2014 at 5:07 pm
Copy link
Timethief is spot on with her suggestion to create a custom menu instead of embedding menu item graphics within your custom header image.

Once you set up your menu, it will be displayed on your site, above your header.

If you run into any trouble with it, just let us know.
emchorush · Member · Jul 1, 2014 at 6:52 pm
Copy link
thank you both so much for this great help –
i’m on it! – hope i succeed the first time :)
timethief · Member · Jul 1, 2014 at 6:55 pm
Copy link
You’re welcome and best wishes.
emchorush · Member · Jul 1, 2014 at 7:16 pm
Copy link
sorry to ask for more help here.
i have in the past succeeded with your suggestions above – i have used a custom menu.

However, now I am faced with a challenge from the board members of our little neighborhood association. – the difficulty is trying to work with a custom header
https://firstmontrose.wordpress.com/wp-admin/customize.php?url=https%3A%2F%2Ffirstmontrose.wordpress.com%2Fwp-admin%2Fpost.php%3Fpost%3D29%26action%3Dedit

This custom header is a png image which is now in place on menu 2. I have been asked to embed links to the web site inside this png custom header.

would i need css to do this?

thank you1
kathrynwp · Staff · Jul 1, 2014 at 7:31 pm
Copy link
It’s not possible to embed multiple links within a custom header image. The link on the header image always goes to the homepage.

Perhaps if you explain a bit more what you’re trying to do and why a custom menu isn’t workable I might have some other suggestions.
emchorush · Member · Jul 1, 2014 at 7:51 pm
Copy link
Thank you.

please see my home page here:
http://firstmontrose.wordpress.com/

I am using what i call Menu 2 . Menu 2 has this custom header. I would like to embed within this png or behind the png, but showing through the png and functional, links to the pages within the web site so they can be clicked on.

prior to having this png green header, I used what I called menu 1.
menu 1 was a custom menu that had a well ordered menu with sub menu items but did not have the green image that you see.

I am able to use this custom image below the custom menu of Menu 1 with all the links above this custom image, but that is not what i’ve been asked to do.

On wordpress i have seen web site themes that have a logo header and within that logo there are links to the pages of the web site.

that is what I would like to learn what to do.

would i need css or some other upgrade to do this?

thanks very much!
kathrynwp · Staff · Jul 1, 2014 at 7:57 pm
Copy link
I think this is where I was getting confused:

Menu 2 has this custom header.

Menus and custom headers are two different things.

Right now, Menu 2 is totally blank – you haven’t added any pages to it, which you can do under Appearance > Menu:

Try adding some pages to your menu then we’ll see what might be possible with CSS.

Are you saying that you want something like this:

It may be possible to move the menu into that approximate possition with CSS. The best thing to do is first add some pages to your menu and then we’ll take it from there.
emchorush · Member · Jul 1, 2014 at 8:02 pm
Copy link
sorry
correction:
instead of “I am able to use this custom image below the custom menu of Menu 1 with all the links above this custom image, but that is not what i’ve been asked to do.”
this should read:
I have been able to use a custom well ordered menu with sub items to link to all the pages of the web site, but unable to place the logo or header above that.
I may just have to use the side bar for the links if I want to use the custom header?
or is there a way to have a custom png logo header with the custom menu links inside of it?
thank you :)
emchorush · Member · Jul 1, 2014 at 8:04 pm
Copy link
Yes!!!

I would like exactly what you show here:https://cloudup.com/cIvvpckbGG0
emchorush · Member · Jul 1, 2014 at 8:13 pm
Copy link
re:
“Menu 2 has this custom header.”

sorry – what i meant to say is that when I added the custom header to the web site using Menu 1 with all the custom links to the web site.
the menu appeared above the header/logo
and this looked awkward.
kathrynwp · Staff · Jul 1, 2014 at 8:35 pm
Copy link
sorry – what i meant to say is that when I added the custom header to the web site using Menu 1 with all the custom links to the web site.
the menu appeared above the header/logo
and this looked awkward.

That’s how the Twenty Twelve theme looks, though – the menu is placed above the header.

What about trying Twenty Eleven instead? In that theme the menubar is below the header:

http://twentyelevendemo.wordpress.com/
kathrynwp · Staff · Jul 1, 2014 at 8:38 pm
Copy link
I would like exactly what you show here:https://cloudup.com/cIvvpckbGG0

Then please feel free to go ahead and do what I suggested earlier:

It may be possible to move the menu into that approximate possition with CSS. The best thing to do is first add some pages to your menu and then we’ll take it from there.
emchorush · Member · Jul 1, 2014 at 8:39 pm
Copy link
ok, here’s menu 1 on my web site along with the custom header
https://firstmontrose.wordpress.com/wp-admin/customize.php?url=https%3A%2F%2Ffirstmontrose.wordpress.com%2Fwp-admin%2Fpost.php%3Fpost%3D29%26action%3Dedit

as you can see, the menu is above the header.

What we would love to have is what you were able to accomplish:https://cloudup.com/cIvvpckbGG0

is this possible for me to do?

thank you!
kathrynwp · Staff · Jul 1, 2014 at 8:42 pm
Copy link
Ah, your menu is a big one. :-) I don’t think that’s going to fit nicely over your header, even if we were able to move it with CSS.

I’d suggest you check out a different theme, one that places the menu below the header, even if it doesn’t overlap it. Twenty Eleven would be my first suggestion – it’s similar to Twenty Twelve in a lot of ways.
emchorush · Member · Jul 1, 2014 at 9:34 pm
Copy link
ok, thanks very much

i have pruned the menu down quite a bit, by the way. (it was too much, indeed)

we will try twenty eleven, thank you.

by the way – would we need css on twenty eleven in order to have the menu appear within the header if that is still an issue?

thank you for all your suggestions
emchorush · Member · Jul 1, 2014 at 10:02 pm
Copy link
ahhhh
Twenty Eleven looks much better!
Thank you for that suggestion. I am hoping this will be an easy solution for us.

thanks for all your help!
kathrynwp · Staff · Jul 2, 2014 at 2:50 pm
Copy link
Twenty Eleven looks much better!

Great! The shorter menu looks good, too.

If you wanted to hide the search box and move up the menu, you could add something like this under Appearance > Customize > CSS:
```
#branding #searchform {
  display: none;
}
#access {
  background: none;
  margin: -90px 0 0 230px;
  z-index: 2;
  box-shadow: none;
  width: 100%;
}
#access a {
  color: #000;
  font-size: 110%;
  font-weight: bold;
}
```
You’ll need the Custom Design upgrade in order to save the changes, but this would give you an idea of what’s possible.

Here’s what that would look like:

If you decide to go ahead and need further help, just let me know!
emchorush · Member · Jul 2, 2014 at 3:01 pm
Copy link
Thank you so much, kathrynwp
I will share this with the web site committee to see what they wish to do.
i think it looks very attractive!

Thanks for all your help on this!
Evelyn

No items found.