The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> WordPress Header Text Links, I need help to turn text in my header, to clickable links.
richnlp
post Jan 21 2016, 07:46 AM
Post #1


Advanced Member
****

Group: Members
Posts: 106
Joined: 8-March 12
From: Chicago
Member No.: 16,661



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 -->

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jan 21 2016, 01:19 PM
Post #2


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



Your link href should have an = sign, not a - sign.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
richnlp
post Jan 21 2016, 08:20 PM
Post #3


Advanced Member
****

Group: Members
Posts: 106
Joined: 8-March 12
From: Chicago
Member No.: 16,661



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.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jan 21 2016, 09:24 PM
Post #4


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



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.

This post has been edited by CharlesEF: Jan 21 2016, 09:31 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
richnlp
post Jan 21 2016, 10:41 PM
Post #5


Advanced Member
****

Group: Members
Posts: 106
Joined: 8-March 12
From: Chicago
Member No.: 16,661



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.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jan 21 2016, 11:35 PM
Post #6


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



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.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
richnlp
post Jan 23 2016, 02:58 AM
Post #7


Advanced Member
****

Group: Members
Posts: 106
Joined: 8-March 12
From: Chicago
Member No.: 16,661



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?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
richnlp
post Jan 23 2016, 03:07 AM
Post #8


Advanced Member
****

Group: Members
Posts: 106
Joined: 8-March 12
From: Chicago
Member No.: 16,661



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?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jan 23 2016, 10:34 AM
Post #9


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



Seems you already figured out how to make the text white. Glad you got things worked out.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
richnlp
post Jan 23 2016, 02:03 PM
Post #10


Advanced Member
****

Group: Members
Posts: 106
Joined: 8-March 12
From: Chicago
Member No.: 16,661



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!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
CharlesEF
post Jan 23 2016, 02:18 PM
Post #11


Programming Fanatic
********

Group: Members
Posts: 1,981
Joined: 27-April 13
From: Edinburg, Texas
Member No.: 19,088



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.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 23rd April 2024 - 10:39 PM