How To Make OnPage Anchor Navigation Links With WordPress, Any Page Builder Or Custom Code

แชร์
ฝัง
  • เผยแพร่เมื่อ 6 ธ.ค. 2024

ความคิดเห็น • 306

  • @UnquietDreams
    @UnquietDreams 5 ปีที่แล้ว

    endless confusion and head-banging. Lightbulb! Adam! Finds video, follows along, success. I have an anchor and feel ridiculously proud! Thank you!

  • @barbakusz
    @barbakusz ปีที่แล้ว

    I have watched like 10 videos trying to figure out how to do this, but finally, you solved my problem and saved the day. Thank you!

  • @larrymyers5989
    @larrymyers5989 4 ปีที่แล้ว +3

    Yoooo! That’s why I love your videos. No one I know gives more descriptive, easy to follow instructions than you bro! Sometimes I forget to just check your videos first. Spent a couple hrs researching before I seen this...

  • @dubbyx8490
    @dubbyx8490 ปีที่แล้ว

    Thank you!!! I have been searching for how to create anchor links on a homepage but what I have been seeing are vidoes about doing them within posts.. This is awesome!!

  • @mangakeyyorivaldy9117
    @mangakeyyorivaldy9117 2 ปีที่แล้ว +1

    Thank you bro
    You saved me, I accidentally deleted my menu

  • @anainmazatlan
    @anainmazatlan 6 ปีที่แล้ว +9

    This is perfect timing Adam, thanks! I was trying to wrap my head around how to do this on so you saved me a lot of potentially wasted time.

    • @WPCrafter
      @WPCrafter  6 ปีที่แล้ว +2

      Happy to hear! Yea its so easy to do.

  • @aaroncarbon7273
    @aaroncarbon7273 4 ปีที่แล้ว +7

    Hi Adam! Great video. I was wondering why my anchor link doesn't work when I'm on another page. I've tried both ways with the css id and anchor menu option on element however they both don't work. All it does is add the #name of the css id at the end of the slug when I'm on a different page. I'm using the free version of Astra as a theme.
    Thanks

  • @christianneale476
    @christianneale476 3 ปีที่แล้ว

    absolutely brilliant! searched for ages for a solution to this - this video made it super easy to get it done! thank you

  • @khuramwaqar418
    @khuramwaqar418 4 ปีที่แล้ว +1

    I was looking for this but no one was able to help but you did man. thanks.

  • @doubler287
    @doubler287 5 ปีที่แล้ว

    I already knew about Anchor Links and how-to create but liked watching this video, you teach this very well Adam. Keep up the good work.

  • @definitelytimz2428
    @definitelytimz2428 3 ปีที่แล้ว

    Bless your Heart. Incredibly easy and straight forward. You're the man!

  • @annamilanamyownversion
    @annamilanamyownversion 4 ปีที่แล้ว

    Thank you Adam, I have watched some of your videos and your teaching is very straightforward and easy to understand.

  • @Sandeepkumarpnp
    @Sandeepkumarpnp 4 ปีที่แล้ว

    You are a great Teacher sir . Love From India . Namste Dil Se

  • @christopherg3897
    @christopherg3897 4 ปีที่แล้ว

    you have the best wordpress tutorials sir! thank you

  • @ne14dirt
    @ne14dirt 4 ปีที่แล้ว

    Yes! Cut the fluff and straight to the point. Great tutorial!

  • @Greenblueandred
    @Greenblueandred 4 ปีที่แล้ว +1

    2 Years later and it's still great info! thanks!

    • @WPCrafter
      @WPCrafter  4 ปีที่แล้ว

      Glad it was helpful!

  • @naumtinga7254
    @naumtinga7254 4 ปีที่แล้ว

    its so easy, thank you very much
    Best WP Channel on TH-cam

  • @johnboyd8053
    @johnboyd8053 6 ปีที่แล้ว +2

    Perfect timing, Adam. I was just able to share this video with the Elementor community.

    • @WPCrafter
      @WPCrafter  6 ปีที่แล้ว

      That's great John Boyd! Thanks for watching.

  • @JayByam
    @JayByam 4 ปีที่แล้ว

    THANK YOU SO MUCH! In WPBakery they call it Element ID and your #Element ID works great for an anchor link
    THANK YOU !

  • @angelahenryauthor
    @angelahenryauthor 6 ปีที่แล้ว

    Adam THANK YOU! I was using the Elementor Menu Anchors and they weren't working! I was beyond frustrated! But this worked like a charm!

  • @LuckyLifeTV
    @LuckyLifeTV ปีที่แล้ว

    Super helpful tutorials thank you so much, happy to finally find this, works for WP Bakery too (element ID rather than CSS) thank you.

  • @hectordeals
    @hectordeals 5 ปีที่แล้ว +1

    Thank you we need more videos like this.

    • @WPCrafter
      @WPCrafter  5 ปีที่แล้ว

      All in good time Hector.

  • @ArythmiaGroove
    @ArythmiaGroove 5 ปีที่แล้ว +2

    Thank you for the video! I have a question: I am using Elementor to build a multi page website. On the landing page I have a couple of Anchors linked to the menu, and another couple in another page. The problem I'm having is that the menu item brings me to the Anchor only if I'm already on the page where the Anchor is located but doesn't work if I click on it from another page. Any suggestions on how to fix this? Thank you!

    • @joel199191
      @joel199191 5 ปีที่แล้ว +3

      Try adding absolute URL in the custom link: yourdomain.com/#anchor seems to work for me

    • @AnetteTalie
      @AnetteTalie 4 ปีที่แล้ว

      @@joel199191 It didn;t work for me...=(

    • @muhammadhashir3835
      @muhammadhashir3835 2 ปีที่แล้ว

      @@joel199191 Thank you! This fixed the problem!!

    • @donniegilmore1834
      @donniegilmore1834 2 ปีที่แล้ว

      @@joel199191 definitely worked for me thank you!

  • @desicryptoupdates
    @desicryptoupdates 4 ปีที่แล้ว

    You are too good.
    Lots of wishes for you sir..
    A fan from India

  • @gholamulmostafa1443
    @gholamulmostafa1443 4 ปีที่แล้ว

    It is too helpful for all designers. I like your video

  • @MsJucarbo
    @MsJucarbo 6 ปีที่แล้ว +2

    Hi Adam. I followed this tutorial and went with the custom link menu page "way". My menu link works on the homepage to direct to the section I want (which is also on the home). However, when I click on other pages of the site, the custom menu link does not redirect back to that specific section of the homepage. I see the correct browser URL with the "#contact" but it just doesn't go. What could be the issue here?

  • @nawrouzouchar808
    @nawrouzouchar808 4 ปีที่แล้ว +2

    Hi Adam. Please help me with the following question.
    I need to link some widgets and buttons on my home page to another scrolling sections on another pages
    Thanks

    • @sirprize2524
      @sirprize2524 4 ปีที่แล้ว

      Not possible because Wordpress sucks

  • @lodewijkdevries8001
    @lodewijkdevries8001 2 ปีที่แล้ว

    you just saved my life bro, keep up with the great work! love and peace

  • @rasmuslarsen9320
    @rasmuslarsen9320 6 ปีที่แล้ว

    If anyone is wondering - same method is working for "WPBakery Page Builder" :-)
    Thank you Adam

  • @mohitsandhu2842
    @mohitsandhu2842 4 ปีที่แล้ว

    thanks sir your all videos are easy to understand and very helpful

  • @zannakristal3754
    @zannakristal3754 4 ปีที่แล้ว

    Really appreciate your Videos...clear to understand. Thank you

  • @AndyDuranFitness
    @AndyDuranFitness 3 ปีที่แล้ว

    Thank you this is exactly what I was looking for!. Couldn't find anywhere else

  • @אבירםבןעזיז
    @אבירםבןעזיז 3 ปีที่แล้ว

    amazingly helpful! thank you very much
    i do have a problem with this still that i dont know how to solve:
    intsed of nicely sliding down to the position it teleports me there as a straight jump, very bad for the eyes... is there a way to solve it with some data im missing??

  • @PaulDickson7
    @PaulDickson7 6 ปีที่แล้ว +2

    Thanks Adam, always a good trick to teach people

    • @WPCrafter
      @WPCrafter  6 ปีที่แล้ว +1

      Thanks Paul.

  • @seyedefatemekhademi5107
    @seyedefatemekhademi5107 2 ปีที่แล้ว

    Hi Adam, excellent video. It really helped me out with this specific issue I was having.God bless you...

  • @maldova7324
    @maldova7324 5 ปีที่แล้ว

    million thanks , only video on youtube explain these setting .

  • @MoroccanMusclesTV
    @MoroccanMusclesTV 3 ปีที่แล้ว

    Very Helpful thanks!

  • @edo152
    @edo152 6 ปีที่แล้ว

    I've seen so many people explain this using or but this is without doubt the quickest and smartest way to do page links. I always wondered what the CSS ID box was for! Well done and thanks for saving me huge amounts of time. One other thing, this way of linking content is much more precise - using those other methods I found myself sticking spacers in to get the link to arrive at the correct spot.

  • @tajahoneilbantugather3913
    @tajahoneilbantugather3913 5 ปีที่แล้ว +8

    Thank You Adam for your great tutorial,
    I’ve watched this several times and still can’t “for the life of me” get the link to work when I’m on another page! What am I missing? Please help thanks 20/03/2019

    • @deanontheinterwebs
      @deanontheinterwebs 5 ปีที่แล้ว +8

      From another page you need the full URL. Eg if anchor link is #packages, from another page you need to link to, as an example: domain.com/pagename#packages

    • @deanontheinterwebs
      @deanontheinterwebs 5 ปีที่แล้ว +5

      Or if it is the home page, as an example, it would be: domain.com/#packages -- using the same example.

    • @broadnanv2
      @broadnanv2 5 ปีที่แล้ว +2

      @@deanontheinterwebs thanks !!!! u saved million thounsand my times settle of this.

    • @sujitbiswasseo
      @sujitbiswasseo 4 ปีที่แล้ว

      @@deanontheinterwebs Hi, I need your help. I have already followed the video and created a custom link, it is showing in my nav menu. However, when I click on it nothing happens. Please help.

  • @hameedferozvlog5600
    @hameedferozvlog5600 5 ปีที่แล้ว +1

    Thanks for the information, but I was looking for something else. I made a List of Contents on the top of a post, and I want readers to navigate to the paragraph when they click on that particular topic in the list of contents. Can you please show how to do that. I'm new to Wordpress. And I found your videos very Helpfull

  • @mikescudder4621
    @mikescudder4621 2 ปีที่แล้ว

    CHEERS!! Just what i needed. Anchor menu did not work for me but the css id method did.

  • @kyriakosproestakis
    @kyriakosproestakis 4 ปีที่แล้ว

    Very helpful tutorial, thank you.

  • @habibaezzat6036
    @habibaezzat6036 3 ปีที่แล้ว

    Thank you for your help! I really appreciate your videos are very helpful!

  • @angusga
    @angusga 9 หลายเดือนก่อน

    Thanks for this. I'm trying to add a link from a description page containing a gallery and text about a product that will take a customer directly to the product for a woocommerce store. Will this work for that?

  • @g.m.7495
    @g.m.7495 3 ปีที่แล้ว

    Very helpful! Thank you!!!

  • @charlesasare5738
    @charlesasare5738 3 ปีที่แล้ว

    This is great. I want to know if it is possible to navigate (form the menu item ) from a page to a section on a another page using elementor?

  • @Chapa9
    @Chapa9 3 ปีที่แล้ว

    You are a genius, you are so helpful thank you very much.

  • @khaledamrhanafy5765
    @khaledamrhanafy5765 4 ปีที่แล้ว

    Thanks for the information!

  • @JayByam
    @JayByam 4 ปีที่แล้ว

    You explained it so well !

  • @alvaroponce14
    @alvaroponce14 4 ปีที่แล้ว

    Hi Adam! thank you for the video, I have a multiple page site and the submenu isn't working from the home page, it does work from the page the submenu is located but not from other pages, do you know how I could solve it? Thank you, cheers.

  • @Kevin-bu6gd
    @Kevin-bu6gd 5 ปีที่แล้ว

    Great video Adam, I wish to add the anchor to an already exist menu and not add a new menu. How can I do that? Will really appreciate your help.

  • @MotoMayhem
    @MotoMayhem 3 ปีที่แล้ว +1

    Hey I am having an issue with my menu anchor. My anchor is a section called "Location" and I linked it to my navigation menu. But when I go to a different page and click on "Location" in the nav it doesn't switch pages and navigate down to the content like it does on my Home page.

    • @marijewoudsma9250
      @marijewoudsma9250 3 ปีที่แล้ว +1

      hi, I have the same problem as you! Have you been able to solve it?!?!?

    • @myd4386
      @myd4386 3 ปีที่แล้ว +1

      ​@@marijewoudsma9250 Hey I have the same problem as you. Did you figure it out?

    • @myd4386
      @myd4386 3 ปีที่แล้ว

      Hey I have the same problem as you. Did you figure it out?

    • @marijewoudsma9250
      @marijewoudsma9250 3 ปีที่แล้ว

      @@myd4386 yes i did! I have to look into it for a moment, then I'll try to explain.

    • @myd4386
      @myd4386 3 ปีที่แล้ว

      @@marijewoudsma9250 Hey, I did it too! It was so simple. I'm so happy figuring it out.

  • @মুন্না-হ৯ঘ
    @মুন্না-হ৯ঘ 3 ปีที่แล้ว

    helpfull video from Bangladesh

  • @markchadbourne8049
    @markchadbourne8049 6 ปีที่แล้ว +2

    Good video Adam as usual. However you say 3m57s into the video: To enter the url for the menu you put the pound sign £ in, plus the css id name. However it's the hash sign # and the css id name. It's difficult to see the text on the page builder because the video is a little fuzzy. So you tend to hang on every word. Other than that very helpful and informative. Thank you.

    • @WPCrafter
      @WPCrafter  6 ปีที่แล้ว

      Thanks for watching Mark Chadbourne!

    • @DeanKennedyAU
      @DeanKennedyAU 5 ปีที่แล้ว

      In the US, the pound sign means the hash sign :D ... here in Aus, as in many places, yes, it can be confusing as "pound" can mean something other than "#".

  • @jacksoncn
    @jacksoncn 5 ปีที่แล้ว

    Hi Adam! Curious what you use to make your youtube thumbnails. If you'd be so kind as to share... that would be GREATLY appreciated. Thanks!

  • @mahalakshmi4769
    @mahalakshmi4769 4 หลายเดือนก่อน

    Hi! I have four tabs on a single page. In the menu bar, there are sub-menu options and tabs name are some. How can I set it up so that clicking on a sub-menu redirects to the corresponding tab?

  • @gizhekhairelddine7109
    @gizhekhairelddine7109 3 ปีที่แล้ว

    AWESOME TUTORIAL! :3 thank you so much!!

  • @MrBasically810
    @MrBasically810 5 ปีที่แล้ว

    good job adam, you did a wonderful job explaining this.

  • @DanielSimler
    @DanielSimler 4 ปีที่แล้ว +1

    HI, Thank you for this video. The only problem I have is when I click, and enter on another page and then click again the custom link displayed in the menu footer, is not working. I have to be on the home page in order the custom link to work.

    • @marijewoudsma9250
      @marijewoudsma9250 3 ปีที่แล้ว

      I have the same problem as you! Have you been able to solve it?!?!?

  • @deepakumar7596
    @deepakumar7596 4 ปีที่แล้ว

    Thanks for the above information. But how do I achieve this particular task : By clicking on TAB element (have 3 tabs), should change the photos in another section? Each TAB shows different pictures on click.

  • @sammimak4260
    @sammimak4260 2 ปีที่แล้ว

    Hi Adam, thanks for making this video. As I clicked on the anchor link, it did jump to the section desire. However, I couldn't scroll back up to the top. May I know what might have caused this?

  • @arshadhussain9257
    @arshadhussain9257 5 ปีที่แล้ว

    best tutorial, i have learned this in minutes while watching your tutorial

  • @AmyBowserRollins
    @AmyBowserRollins 6 ปีที่แล้ว

    Nice useful tip, Adam. Thanks for taking the time to show us. I've added the anchor links as a TOC at the top of a page, but I haven't yet done with a menu. And I haven't done it with a page builder yet. Good to know.

  • @prathapreddyirugula7776
    @prathapreddyirugula7776 4 ปีที่แล้ว

    Awesome explanation

  • @hipersign
    @hipersign 4 ปีที่แล้ว

    Thanks for the useful information

  • @nidaa3233
    @nidaa3233 3 ปีที่แล้ว

    exactly what I was looking for. You are God send.

  • @Amirmnt
    @Amirmnt 4 ปีที่แล้ว

    Hi Adam, Please help me with the following question.
    i want to use ID (for link) and use URL (for link) in the same menu

  • @samiraabourriche1356
    @samiraabourriche1356 3 ปีที่แล้ว

    Thank you for this video .It's helpful.

  • @mikalayding7539
    @mikalayding7539 5 ปีที่แล้ว

    Hi - great video - but what if I want to klick on a menu item and jump directly down to a page, that is under this menu item?

  • @Sai-lk3fc
    @Sai-lk3fc 2 ปีที่แล้ว +1

    Thanks man it was really helpful

    • @WPCrafter
      @WPCrafter  2 ปีที่แล้ว

      Glad it helped

  • @DaleFSims
    @DaleFSims 3 ปีที่แล้ว

    I followed your instructions and it worked! Sort of. I put the links in a drop down as a submenu and they do go where I want them to. There is no name in the drop down list. Just empty boxes that when clicked go where I want them to. Any suggestions?

  • @MarceloMarconcini
    @MarceloMarconcini 4 ปีที่แล้ว

    Tks so much fot the tips!!!!!!!!!!!!!!!!!! Amazing!!!!

  • @kinggonzales2067
    @kinggonzales2067 3 ปีที่แล้ว

    I have question how do I make it link to that specific anchor point from a different page? can I make it also to a text and button from other page to the anchor point that I want?

  • @jamesrobbins2167
    @jamesrobbins2167 3 ปีที่แล้ว

    Im totally New to this but I get your attaching a quick link to a boxed area on a page but I need to make a quick link to a Header, can this be done ?

  • @berrybarusman8471
    @berrybarusman8471 2 ปีที่แล้ว

    Thanks for the tip!

  • @RafaelScott
    @RafaelScott 2 ปีที่แล้ว

    Perfect! Thanks! 👏🏽👏🏽👏🏽😁

  • @Marlene-mf9bx
    @Marlene-mf9bx 4 ปีที่แล้ว

    your explanation is the best ever... So clear!!! Thank you so much ♥

  • @Paytonwh
    @Paytonwh 3 ปีที่แล้ว

    So i need the business profile to do this? I can't do plugins without it. Is there a way to make jumplinks without buying the business version?

  • @farrukhhamayoun
    @farrukhhamayoun 5 ปีที่แล้ว

    thanks a lot Adam!

  • @entertechinc
    @entertechinc 5 ปีที่แล้ว +5

    Hi Adam, brilliant concept. but if I understand clearly this method does not navigate you to a different page. Instead You have to include the URL of the page with the Anchor CSS ID, and it should be like this: "domainname.com/pagename/#anchor-ID"

    • @cherndon8948
      @cherndon8948 5 ปีที่แล้ว +1

      yes, this worked for me as well

    • @shantelle1440
      @shantelle1440 3 ปีที่แล้ว +1

      Thank you, your advice worked perfectly, just what I needed

    • @JuliaKibore
      @JuliaKibore ปีที่แล้ว +2

      Mwaahh 🥰I had really struggled now its working using custom links... which I had deleted and set up homepages which didn't work ... now back to custom links... I can navigate from other pages back to the home page using your advice

    • @SpankIEkzs
      @SpankIEkzs ปีที่แล้ว

      You Sir, are a great person! Thanks!

  • @albertoux1425
    @albertoux1425 2 ปีที่แล้ว

    Hi, but how do you do the anchor link if you want to send the user to a part in the footer, and the footer is managed by the worldpress theme and it's not editable with Elementor?

  • @jonathanwong7107
    @jonathanwong7107 4 ปีที่แล้ว

    Hi, thank you. This video saved me from hours of frustration! However, my problem now is that I actually linked a sub-header to scroll down to specific section of a page. When I click on the subheader from the menu, it doesn't link to the section directly. I have to click on the header to bring me to the page and then click on the subheader to bring me to the section that I want. Do you have a solution for this problem? Thank you in advance.

  • @pratikkayasth6705
    @pratikkayasth6705 3 ปีที่แล้ว

    Great video love this tutorial. But suppose I linked my services to the section of service on home page.( as shown in tutorial) but when i was on the contact page and try to click on service page then the link is not redirected. So is there any solution for this?

  • @dya1990
    @dya1990 3 ปีที่แล้ว

    the video is still very helpful! thank you!!

  • @sirseptember.digital
    @sirseptember.digital 2 ปีที่แล้ว

    Thanks a lot, this video helped me a lot.

  • @noorgrewal8424
    @noorgrewal8424 6 ปีที่แล้ว +2

    Hi Adam, I have this one page website with onpage anchors and I am finding hard time in creating a sitemap using anchors (just like pages) for google, any help would be appreciated.

    • @caryhuff8924
      @caryhuff8924 6 ปีที่แล้ว +1

      The answer to your question might be here. Hope this helps: webmasters.stackexchange.com/questions/56423/sitemap-for-a-one-page-site

  • @pedrotraguil8511
    @pedrotraguil8511 4 ปีที่แล้ว

    Is there a # i can use to create a menu item to go back to the top of the page? like a "home" button?

  • @the-long-named-one
    @the-long-named-one ปีที่แล้ว

    This is great, thanks so much!

  • @andyturner1225
    @andyturner1225 5 ปีที่แล้ว

    Always top quality tutorials - thank you

  • @muzhganhaidari8083
    @muzhganhaidari8083 2 ปีที่แล้ว

    you deserve a heart thank you so much

  • @justintime5681
    @justintime5681 5 ปีที่แล้ว

    Hi adam, tnx for the video! quick question, if im on page on my website and click on the anchor nav link set up for another page, it wont take me there... any suggestions? tnx

  • @beautyisinternal6953
    @beautyisinternal6953 3 ปีที่แล้ว

    Thank you so much! Your video helped me a lot🙏🏻

  • @misterellystudio
    @misterellystudio 3 ปีที่แล้ว

    This helped.... Thank you very much Sir

  • @hamidmghazi
    @hamidmghazi 4 ปีที่แล้ว

    Awesome! Thank you

  • @esselideas5114
    @esselideas5114 5 ปีที่แล้ว

    Dear Sir, all your tutorials are simply superb. Can you please help me how to use Image alt attributes in elementor post which is very important for Yoast SEO.
    It's showing below message Image alt attributes: Images on this page do not have alt attributes that reflect the topic of your text. Add your keyphrase or synonyms to the alt tags of relevant images! Thanks & Good Luck.

  • @mariavybohova7357
    @mariavybohova7357 5 ปีที่แล้ว

    Hello...I like your videos...They are very helpful for me. I have an Question for You: I have used one page scroll anchor navigation links on my wordpress website. (example:"Contact"-custom links in menu) and I also have used checkout and shop - pages in menu...but if I click on shop page, after that.... I can"t click back on "contact"-custom links /anchor navigation links. It"s doesn"t works. I have to click on Logo...and after I can click on "Contact"-custom links /Anchor Navigation Links/ works. Do you have some advice? Thank you. :)

  • @paritoshnpandya8426
    @paritoshnpandya8426 5 ปีที่แล้ว

    If in services page there is A , B and C service than we can go to that page ( say B ) but how to add this one page "Menu "on that service page (Say B ) and use it there to return page to this primary page ?

  • @tripmore
    @tripmore 5 ปีที่แล้ว

    thanks for simple and effective presentation. loved that

  • @arinavogelbacher7262
    @arinavogelbacher7262 5 ปีที่แล้ว

    great help! Thank you

  • @fantom2967
    @fantom2967 6 ปีที่แล้ว +2

    thanks for video. Adam why is the first method better than doing it with page builder?

    • @WPCrafter
      @WPCrafter  6 ปีที่แล้ว +1

      You mean how I do it in the CSS ID in the advanced section of my page builder? I find it easier to get it right to the location that I want.

    • @fantom2967
      @fantom2967 6 ปีที่แล้ว

      WPCrafter.com WordPress For Non-Techies thanks