Help - Search - Members - Calendar
Full Version: WordPress Header Text Links
HTMLHelp Forums > Web Authoring > Web Site Functionality
richnlp
Hello, working on a client's website on WordPress and I need help to turn text in my header, to clickable links, please.

The text:
New Construction - Classic Chicago Rehabs - Landmark Restoration - Low Income Housing - Section 8 - Hospitality

Website Link

The Gist:
The regular <a href=...> does not make that text clickable. It's all in the header.PHP file. I'm no expert with the coding of that file when it comes to making text into links with non-html code.

Thanks in advance! I'll check back later tonight.
Code:
CODE
<!-- #site-navigation -->.........
<a href-"http://www.midwestbuildersgroup.com/construction/"><span style="color: #ffffff;">New Construction</span></a> - <a href-"http://midwestbuildersgroup.com/chicago-rehabs"><span style="color: #ffffff;">Classic Chicago Rehabs</span></a> - <a href-"http://midwestbuildersgroup.com/landmark-restoration/"><span style="color: #ffffff;">Landmark Restoration</span></a> - <a href-"http://midwestbuildersgroup.com/low-income-housing"><span style="color: #ffffff;">Low Income Housing</span></a> - <a href-"http://midwestbuildersgroup.com/section-8"><span style="color: #ffffff;">Section 8</span></a> - <a href-"http://midwestbuildersgroup.com/hospitality"><span style="color: #ffffff;">Hospitality</span></a>
    ..........</header><!-- #masthead -->

CharlesEF
Your link href should have an = sign, not a - sign.
richnlp
QUOTE(CharlesEF @ Jan 21 2016, 02:19 PM) *

Your link href should have an = sign, not a - sign.

That's strange, it did have '=' when I pasted the code. It does have that in the code that didn't work though.
CharlesEF
QUOTE(richnlp @ Jan 21 2016, 07:20 PM) *

QUOTE(CharlesEF @ Jan 21 2016, 02:19 PM) *

Your link href should have an = sign, not a - sign.

That's strange, it did have '=' when I pasted the code. It does have that in the code that didn't work though.

I didn't check your posted code. I checked the code on your posted website link. Also, you don't really need those <span> elements. You can style the <a> link directly.

One other thing, the background color makes your drop down menus almost impossible to see.
richnlp
QUOTE(CharlesEF @ Jan 21 2016, 10:24 PM) *

QUOTE(richnlp @ Jan 21 2016, 07:20 PM) *

QUOTE(CharlesEF @ Jan 21 2016, 02:19 PM) *

Your link href should have an = sign, not a - sign.

That's strange, it did have '=' when I pasted the code. It does have that in the code that didn't work though.

I didn't check your posted code. I checked the code on your posted website link. Also, you don't really need those <span> elements. You can style the <a> link directly.

One other thing, the background color makes your drop down menus almost impossible to see.

That was something else I needed help with. Can't seem to find the spot to change in the stylesheet. So does anyone have an actual answer to my original question? Sucks that I need to be rude about this but I'm so tired of posting a question and getting every type of reply, EXCEPT the answer to my question. This happens to so many users online and it's quite ridiculous. Can anyone help without pointing out other things that I didn't even list?? Thanks.
CharlesEF
I have given you an actual answer. Your problem is with the way your <a> links are defined. When I view the actual website and click on 'View Page Source', this is what I see for your links:
CODE
<a href-"http://www.midwestbuildersgroup.com/construction/"><span style="color: #ffffff;">New Construction</span></a> - <a href-"http://midwestbuildersgroup.com/chicago-rehabs"><span style="color: #ffffff;">Classic Chicago Rehabs</span></a> - <a href-"http://midwestbuildersgroup.com/landmark-restoration/"><span style="color: #ffffff;">Landmark Restoration</span></a> - <a href-"http://midwestbuildersgroup.com/low-income-housing"><span style="color: #ffffff;">Low Income Housing</span></a> - <a href-"http://midwestbuildersgroup.com/section-8"><span style="color: #ffffff;">Section 8</span></a> - <a href-"http://midwestbuildersgroup.com/hospitality"><span style="color: #ffffff;">Hospitality</span></a>
When I inspect the first <a> element using Firebug, this is what I see:
CODE
<a "="" construction="" www.midwestbuildersgroup.com="" href-"http:="">
When I correct the <a> element to look like this:
CODE
<a href="http://midwestbuildersgroup.com/construction/">
The link works fine. I don't know anything about WordPress, if you have some kind of interface that you use to make these changes then I think you need to learn how that works. I don't know.
richnlp
QUOTE(CharlesEF @ Jan 22 2016, 12:35 AM) *

I have given you an actual answer. Your problem is with the way your <a> links are defined. When I view the actual website and click on 'View Page Source', this is what I see for your links:
CODE
<a href-"http://www.midwestbuildersgroup.com/construction/"><span style="color: #ffffff;">New Construction</span></a> - <a href-"http://midwestbuildersgroup.com/chicago-rehabs"><span style="color: #ffffff;">Classic Chicago Rehabs</span></a> - <a href-"http://midwestbuildersgroup.com/landmark-restoration/"><span style="color: #ffffff;">Landmark Restoration</span></a> - <a href-"http://midwestbuildersgroup.com/low-income-housing"><span style="color: #ffffff;">Low Income Housing</span></a> - <a href-"http://midwestbuildersgroup.com/section-8"><span style="color: #ffffff;">Section 8</span></a> - <a href-"http://midwestbuildersgroup.com/hospitality"><span style="color: #ffffff;">Hospitality</span></a>
When I inspect the first <a> element using Firebug, this is what I see:
CODE
<a "="" construction="" www.midwestbuildersgroup.com="" href-"http:="">
When I correct the <a> element to look like this:
CODE
<a href="http://midwestbuildersgroup.com/construction/">
The link works fine. I don't know anything about WordPress, if you have some kind of interface that you use to make these changes then I think you need to learn how that works. I don't know.

I appreciate it. I'm trying now and will keep you updated. Also, is there a way to give you a like or thumbs up rep for helping me out?
richnlp
IPB Image

THANKS! I understand what you meant and I can't believe I even made a mistake like that with the coding.

Any idea how to change the top menu colors to white?
CharlesEF
Seems you already figured out how to make the text white. Glad you got things worked out.
richnlp
QUOTE(CharlesEF @ Jan 23 2016, 11:34 AM) *

Seems you already figured out how to make the text white. Glad you got things worked out.

I cheated and used a WP menu plugin lol.

...I DO have one more issue. I'm trying to make the text links at the top (in white), change color when hovering over them. Can't remember what code to use and where to put it, if you know that off hand. Thanks again!
CharlesEF
You would have to use something link this:
CODE
.main-navigation ul a:hover
{
  color: #123456;
}
I could be wrong with the selector name, there are so many, but you should get the idea.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2019 Invision Power Services, Inc.