I am trying to use anchor tags in wordpress on my main menu. I am creating the menu through the menu editor in wordpress. I have added my anchors to my page exactly how I want and have tested that the links for example mywebsite.com/about-us/#executive-team work correctly.
And they all work as I want them to when I paste the link in the browser address bar.
The links also work when I click on the menu item.
Here is my problem: the anchor links DO NOT work when I click on them from the actual page that has the anchor point on it. For example, if I click on mywebsite.com/about-us/#executive-team from mywebsite.com it works great. If I click on mywebsite.com/about-us/#executive-team from mywebsite.com/about-us the link does not go anywhere.
Any suggestions. I need the anchor links to work no matter what page they are being clicked from.
Remove the trailing slash from the URL:
mywebsite.com/about-us#executive-team
The trailing slash is looking for another page. It works fine from an external page, but on the page itself, the slash throws off the browser.
Related
I've encountered a problem that never happened to me before: on this test site: http://c2040213.ferozo.com/dimi/ whenever you click on one of the sub menu links from the "Vender" menu item, they start redirecting to the "Comprar", even though on the href there is no indicator that the link itself redirects to that site, instead, they are anchor links to http://c2040213.ferozo.com/dimi/#tasa for example.
So I'm having trouble discovering why when I click a link that goes to http://c2040213.ferozo.com/dimi/#tasa, redirects me to http://c2040213.ferozo.com/dimi/comprar
I'm working on the latest version of WordPress and with Elementor.
Thanks a lot in advance, feel free to ask for more information if needed.
I'm writing some documentation using GitHub's built in wiki (using Markdown syntax).
The problem I have had with anchor tags is that once I have clicked that anchor once, manually scrolled down to it again, and try to click it, it won't work anymore.
a) The place where the anchor links jump to.
##<a name="listofactions">List of Actions</a>
b) An example of an anchor link
[Back to List of Actions](#listofactions)
I also tried html in markdown syntax
Back to List of Actions
And even tried linking to the full url with the # and anchor appended.
Back to List of Actions
They all work, but when I manually scroll down to the anchor link again and click it, it doesn't bring me back to (a) anymore. Unless I click on a different anchor link.
How can I write it such that the anchor links can work regardless?
There is nothing wrong with your Markdown. This is simply how browsers work. The first time you clink the link (when viewing the same page), the URL in the address bar of your browser changes from http://example.com/path/to/your/page to http://example.com/path/to/your/page#someanchor. As that is a different URL, the browser will navigate to the new URL by scrolling to the appropriate position on the page. However, as you read the page and scroll to a different position, the URL remains the same. Finally, the second time you click the link,the URL is already http://example.com/path/to/your/page#someanchor so there is no change in the URL and as far as the browser is concerned, you are already there so no navigation happens and the page does not scroll.
There may be some JavaScript tricks you can use to trick the browser into behaving as you want, but those won't work on GitHub as they won't let you include any JavaScript in your pages for security reasons.
What you could do as a workaround (assuming you have a long page and want to easily find the specific location again) is first click the [back] button (taking you back to http://example.com/path/to/your/page) in your browser's navigation bar and then click the [forward] button (returning you to http://example.com/path/to/your/page#someanchor) which should trigger the browser to navigate to the location and scroll the page.
Try this:
...
<a name="listofactions"></a>
## List of actions
Mind the blank line between the HTML tag and the markdown markup.
Then call it via [link-to-anchor](#listofactions)
Should work.
Hope to have helped!
Add the attribute target="_self"
I am currently developing a WordPress website.
I have home page as parallax page. you can visit here. and parallax working fine on this page,
I have another page on same site which you can see here, you can also navigate to that page by clicking news menu link on home page.
My issue is, after navigating to news page, other links ( Home, Services ) not working.
When I right click and choose open link with new Tab its working, but when i direct click that menu link (Home, Services ), Its not working, Why? What is missing there?
I have tried to bind jQuery click event with it, and click event in jQuery working fine.
The browser is confused because you are using hashtags # in your url. Hashtags are normally used for links on the same page (anchors). The link is however not on the same page.
When you right-click and select open in new tab you are forcing the browser to go to a new page.
I do not know why the hastag is there in the first place. I suggest you remove it in the url. Do not forget the remove the hashtag in the slug of the page too.
your theme has an event on links with w-nav-anchor class in your js/plugins.js
Add more specific selector like '.home .w-nav-anchor' to run properly.
Is there anyway to stop the address bar dropping down in mobile browsers when an anchor target extension is placed on the end of the URL?
For example when the anchor is clicked the URL would update from http://www.websiteurl.com/ to http://www.websiteurl.com/#contact causing the URL bar to drop down if it isn't already visible.
Hoping there's a solution to this one!
Thanks
"The fact of having an anchor with an href attribute is enough for Safari Mobile to show the bar unless the address is preceded by the hash sign. It is not the fact of changing the URL, because if you preventDefault() the click on the link and avoid the navigation, the bar is shown anyway."
From: http://jmperezperez.com/prevent-iphone-navigation-bar-ajax-link-click/
That page has further explanations and code. The solution seems to be to add a click handler to links ( elements) that removes the href attribute and redirects to the page through JS.
I'm trying to do something that I thought would be really simple but I can't make it work.
My bookmark anchors work fine if I'm on the home page but the same links in the header of my page don't work if the # part refers to the home page:
Some Link Text
It works if I have some sort of page name, but doesn't work for the home page. (i.e. this works: Some Link Text)
Of course if the href is just / it works fine.
So how the heck does one link to a bookmark in the home page from another page?
Thanks!