Page tabs to anchors

I'd like to know how to make the page tabs at the top link to anchors within another page. In other words, rather than opening up the top of the linked page, I'd like the link to open midway down the linked page. Is there a way to do this?

Alternatively, is there a way to make the header only show up on the home page? This is why I need to link to midway down each page---my header shows up on every page making it so you can't see the actual content without scrolling down.

Thanks in advance for your help!

 

Hello,

Could you please explain your issue more clearly with the help of screenshot images that what do you want to do with this theme.

 

I have three questions:


1) When clicking on the “Why rats?” button (the button to the right of "Home" in the middle of the screen): http://aboutpetrats.com/
I'd like the "Why rats?" page to open so that the heading "Why rats?" is at the top rather than the "About Pet Rats" banner. Can you please tell me how to create an anchor link so the page opens more towards the middle rather than the top?

2) How do I make the banner ("About Pet Rats") that appears at the top of every page narrower so it doesn't take up so much space?

3) Is there a way to make the banner only show up on the home page?

I hope my questions are clearer this time. I tried to insert screenshots here as you suggested, but to insert a picture I need a url.....not sure how to do this if the screenshot is in the form of a jpg not attached to a url.

Thank you in advance for your help!

Jasmine

 

Hello,

1.For your first issue

Could you please clarify your issue little more.

2.For your second issue

Paste this code in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

.logo img {
width: 100%;
height: 200px;
}

Adjust its value as per your requirements.

3.For your third issue

Paste this code in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

.page.page-id-103 .logo img {
display: none;
}
.page.page-id-2 .logo img {
display: none;
}

 

3. Thanks so much for answering my questions. The answer to #3 worked great!
2. I couldn't get #2 to work. The width adjusted just fine but not the height.
1. Here's another way to phrase my question #1 again:

I want to be able to create an "anchor link" so that when someone is on the home page and they click on the "Home" button they are taken to a spot lower down on the same page.​

​

Thank you for your help!

 

Hello,

Paste this code in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

.logo img {
width: 100%;
height: 200px!important;
}

To achieve this firstly add id attribute for your desired heading at which you want to jump the link.

For example:

Code:

<h3 id="test">Your Heading</h3>

After that go to Appearance > Menus
and create custom menu and add that heading id in URL.

For example:

Code:

#test

and add it.

Sending image for reference




This will solve your issue.

 

Thank you for your help. The new code you sent for making the banner narrower works perfectly.

There is still one unresolved question: I am not understanding how to create the anchor links. Just to reiterate, I want to be able to click on the "Home" tab and be taken to further down on the same page.
When writing in your response "firstly add id attribute for your desired heading at which you want to jump the link", I'm not sure of the location to which you're referring. Are you saying that I need to enter something similar to "<h3 id="test">Your Heading</h3>" around the heading where I want people to be able to click and be taken lower down on the same page? I'm not sure where this is located. I tried adding it to Custom CSS and red "x"s appeared. I thought that to add anything to Custom CSS it needs to end in a bracket ("{"). Can you please provide a more detailed answer including exactly where the codes need to be added?

Thank you in advance for clarifying!

Jasmine

 

Hello,

Follow the link given below

http://www.wendycholbi.com/anchor-links-jump-links/

I hope it will help's you.

 

Thanks for your help!

Should I be creating a separate thread for each question?

I do still have some follow-up questions about the above answers:

1. For making the banner logo appear ONLY on the home page, you gave me the following code:
.page.page-id-103 .logo img {
display: none;
}
.page.page-id-2 .logo img {
display: none;
}
This worked great until I added a new page. The new page shows the home page banner logo. I will be adding several additional pages. Can you please tell me what code I need to enter so that, no matter how many additional pages I add, the home page is still the only page with the banner logo?
2. I appreciate your providing the link to Wendy Cholbi's page on anchor/jump links. However, I still don't know how to add a jump link on the home page. When editing the home page, there is not a way to switch to html view. Where would I enter codes for jump links for the home page? (Or is it even possible to create jump links on the home page?)
Thanks again and I appreciate your patience with all of my questions.
Jasmine

 

Hello,

1. For your first issue,
Paste the following code in your Custom CSS
(Appearance -> Theme Options -> Styling Options -> Custom CSS)

Code:

.logo img {
display: none;
}
body.home .logo img {
display: run-in;
}

This will solve your first issue.



2. For your second issue

Can you please specify us that where you want to jump the link on home page, so we will create jump link for that area.
And also send us your dashboard details on our email at [email protected].

Thread Link: http://www.inkthemes.com/community/threads/page-tabs-to-anchors.7377/
Your Website URL:
WordPress Username:
WordPress Password:

Send this information on our email at [email protected]

 

Thanks so much for the code to make the banner/logo show up only on the home page. It works great!

As for the other question, I'm going to hold off for now. I really wanted to experiment and play around with it so I can't say exactly where I'd want the jump links. Thanks for the offer though.

Thanks again for the help. Much appreciated!