How to Create Anchor Links in Divi

Поделиться
HTML-код
  • Опубликовано: 28 окт 2024

Комментарии • 225

  • @patriciamorgan6834
    @patriciamorgan6834 4 года назад +6

    I have spent a couple hours looking at other tutorials to tell me how to do this, and yours was so simple, sweet and perfect. THANK YOU

  • @juliesepulveda5206
    @juliesepulveda5206 3 года назад +1

    Thank you thank you thank you! I was watching other tutorials and applying different methods, not realizing that it's slightly different with Divi! This is exactly what I needed! What took me several hours to figure out with other tutorials I figured out in less than 10 minutes thanks to your video! Thank you!!!

  • @ileanaricketts6035
    @ileanaricketts6035 6 лет назад +1

    I viewed many divi videos on anchor links and none of them worked for me. But this one did! Thank you!

    • @JoshHallco
      @JoshHallco  6 лет назад

      Awesome to hear, Ileana! Thanks for that feedback. So glad it helped :)

  • @soloeditor4320
    @soloeditor4320 5 лет назад

    you are the best youtube teacher i've ever met................gosh

  • @SJ-gj7mx
    @SJ-gj7mx 6 лет назад +12

    The best video for learning anchor links in Divi.

    • @JoshHallco
      @JoshHallco  6 лет назад +3

      Thanks, Sarah! Much appreciated :)

    • @klaarkkent4199
      @klaarkkent4199 5 лет назад

      Sarah Jack Yo! Fr fr. Thought me everything

  • @infinityhealingcollective1558
    @infinityhealingcollective1558 4 года назад +7

    Thanks Josh! Been watching your Divi videos, you're a really good teacher of this stuff, which is so helpful. Just because someone knows web building and coding doesn't necessarily mean they're able to teach it so well!

  • @KarlandKristoff
    @KarlandKristoff 6 лет назад +1

    THANK YOU!! I have been working on this for hours and it kept not working based on other wordpress tutorials. Thank you for creating a divi version.

    • @JoshHallco
      @JoshHallco  6 лет назад

      Thanks so awesome to hear, Deanna! Glad to hear it being Divi-specific helped you :)

  • @saraheikaiwa9318
    @saraheikaiwa9318 4 года назад +1

    Thank you so much!! I spent way too long looking at other sites and getting no where. I wish I had found this first!

    • @JoshHallco
      @JoshHallco  4 года назад

      Awesome to hear. I have a growing list of tutorials at joshhall.co/tutorials Sarah so just keep an eye there first to see if you have an issue that I've already covered!

  • @charbellsolutions5019
    @charbellsolutions5019 5 лет назад +2

    Thanks Josh. Clear, succinct description for creating and using Anchor Links.

  • @larrypezzuto482
    @larrypezzuto482 4 года назад

    Best Divi tutorial video I've ever watched

  • @janaabreu
    @janaabreu 2 года назад

    Thank you so so much! Just had to listen to the first 3 minutes and you gave me the answer, but the whole video was super helpful! Thank you !

  • @armandogutierrez6757
    @armandogutierrez6757 2 года назад

    Josh thank you very much for these quick tips about buttons. Very nice videos really instructive.

  • @EricaRayLanguage
    @EricaRayLanguage Год назад

    So simple and worked beautifully! Thank you!

  • @sweetfernorganics6817
    @sweetfernorganics6817 Год назад

    Thank you! Been trying to figure out a decent Table of Contents for my articles and this video saved me! THANK YOU!!

  • @זואיגאזוטש
    @זואיגאזוטש Год назад

    Thank you this was the most informative and easy-to-understand tutorial!

  • @pjp3158
    @pjp3158 6 лет назад

    Josh, this just became my new favorite channel! Thank you so much. I was able to do the second type of anchor in one minute after watching this video. I've been trying to get a button to anchor for hours before finding this video. Thank you! :)

  • @andrewhayden5575
    @andrewhayden5575 7 лет назад

    Been very busy of late Josh, but just wanted to say great work with the recent tutorials!

    • @JoshHallco
      @JoshHallco  7 лет назад +1

      Good to hear. I was getting worried! :)

  • @sarahthomas7193
    @sarahthomas7193 5 лет назад +2

    you are a such an AMAZING TEACHER!!!!

  • @saltpzak
    @saltpzak 6 лет назад +9

    Perfect! Exactly what I needed. Thanks, Josh!

  • @julieannsarangaycureg4375
    @julieannsarangaycureg4375 3 года назад +1

    Thank you Sir Josh. Mabuhay from the Philippines! :)

  • @davidflannery887
    @davidflannery887 6 лет назад

    Great Post. I will keep this in my arsenal of tool to use when I am building a website.
    Thanks
    Dave

    • @JoshHallco
      @JoshHallco  6 лет назад

      Awesome to hear, David. Thanks!

  • @equilibriumconsulting7546
    @equilibriumconsulting7546 5 месяцев назад

    Thanks so much for the video. The issue i am having is that the first anchor link on a page works but as soon as i add a second or third one - they don't work. the first one continues to work but the others do not and their descriptions are 100% unique and they have been set up the exact same way. Any advise?

  • @LisaLubin
    @LisaLubin 5 лет назад

    Thank you! I did this on another divi site the other day using html. This is so much easier! Easy, clear instructions. Thanks!

  • @JohnShaw-dj2uf
    @JohnShaw-dj2uf 5 лет назад

    Thanks Josh, plain, clear and simple - perfect

  • @akashahlawat3948
    @akashahlawat3948 3 года назад +1

    Thank you soo much, I was searching it on Google and everything just messed up!
    This is damn easy. Thank you very much.

  • @Khordmaster
    @Khordmaster 4 года назад

    My anchor link refreshes my page instead of just scrolling down. Any idea on how to fix this???

  • @christophrehse
    @christophrehse 3 года назад +1

    Great tutorial. To the point. Easy to follow.

  • @MikeMorinmdesign
    @MikeMorinmdesign Год назад

    Hi Josh, Question: How do you get the 1 page navigation to smoothly scroll to the top Hero section of the Home page? My Service, About, etc... all move smoothly to there sections on the home page but when I click on Home in the nav it reloads the page. How do you smoothly make it move to the top Hero section of the Home page? Thanks.

  • @kellyevans4035
    @kellyevans4035 Год назад

    Hi Josh. Thanks for the great tutorial on jump links. I have a problem though. The menu jump link works when I am on the page, but doesn't work if I'm on a different page. When selcted it just goes to the top of the page, not the correct section of that page. Does that makes sense? Hope you can help

  • @chrisnastander7665
    @chrisnastander7665 4 года назад

    What a champion! Saved me a ton of time! Just subscribed because your videos make life easier!

  • @webchameleon5663
    @webchameleon5663 5 лет назад

    So quick and easy. Knowledge is power. Thanks a mil!!

  • @samgutierrez5532
    @samgutierrez5532 3 года назад

    Thanks Josh. Very well explained. Great tutorial

  • @billyhulting1040
    @billyhulting1040 Год назад

    Thank You! So well explained for each situation!

  • @klaarkkent4199
    @klaarkkent4199 5 лет назад +6

    Thank you so much for this. This is everything I was looking for and then some.

  • @fahmidaakterdina875
    @fahmidaakterdina875 4 года назад

    At last I solved my problem! Was stuck here for the entire day

  • @9S6OFFICIAL
    @9S6OFFICIAL 3 года назад

    i dont have te CUSTOM LINK section on my meny so i cant put a URL. why? can someone explain me how to do it?

  • @sangrafuz9456
    @sangrafuz9456 4 года назад

    Finally I understand this ! thank you so much.
    Greetings from Colombia

  • @bijougirl12
    @bijougirl12 2 года назад

    Easy to understand tutorial. Unfortunately my url address shows page numbers not my page name. Any advice on how to correct this?

  • @tracieparker7414
    @tracieparker7414 2 года назад

    Thanks Josh. This was very helpful. I was able to follow you, step-by-step, to create my anchor links, but experienced a small glitch. I cannot find any information to help me with this glitch. Hoping you can assist me. I created an anchor link to zip to a spot on the same page. Follow steps to a T. When I click on the link, it zips me down the page but lands the location I set up with the CSS ID. The spot I want it to land is completely off the screen above the spot I landed. Any idea what I can do to fix this?

  • @jonathanedwards-olympian8009
    @jonathanedwards-olympian8009 3 года назад

    Thanks for this. I'm having trouble getting this to work as a hyper link in a widget in the footer. Is there something I should be tweaking?

  • @wire_writer
    @wire_writer 3 года назад

    Great vid, very clear and concise. Got all my anchor links working, thanks !

  • @LifeinGlow
    @LifeinGlow 2 года назад

    thank you for the last part especially, good to know! Question: if I don't see the "menu" option in the drop-down menu in the left top corner under W , how can I get it there? :)

  • @gosteronlinecourses
    @gosteronlinecourses 2 года назад

    I was trying to link from a button to an anchor section on another page and your method didn't work on my version of Divi. I had to add the anchor to the section like you said, then copy and paste the url of the page where I put the anchor, into the link section for the button, then add the /#anchor at the end of the page url in the button link now it works like a champ. Thanks for the help!

  • @JeroenVanbever
    @JeroenVanbever 4 года назад

    Great! Thanks for this very useful and clear tutorial Josh!!

  • @edempsey1957
    @edempsey1957 4 года назад

    Thank you Josh! Your tutorials are the best!!

  • @saltygoat
    @saltygoat 3 года назад

    Thank you. Very clear instructions.

  • @JohnsonOpigo
    @JohnsonOpigo 4 года назад

    Excellent tutorial. Could not have been any clearer. Thanks!

  • @joostweesie4628
    @joostweesie4628 Год назад

    very awesome vid, I have a question though: I think I spot it in the video as wel at 1:35. with a fixed header and navigating to an anchor, I find that de (sticky) header is covering some of the content and I have to first scroll up to see the top part. I tried making the header disappear when scrolling, wich fixed this covering content problem, but raised 10 more design problems, so I ended up deleting the custom CSS and sticking to DIVI's header settings. Then I used a margin on the header, but this did'nt do any good. So I'm a bit stuck and could use some help

  • @ulrikebernebee-say8142
    @ulrikebernebee-say8142 Год назад

    Hi Josh, thanks for sharing this awesome and easy to understand video tutorial. :) I have one question: if I want to to use a table of contents in a blogpost and want to set the anchor links, so the user is moved directly from the table of contents to the respective Headline on the same page, do I have to use separate sections for the headlines? Or is it ok to use separate modules for the headlines, set the anchor link in the module (CSS ID) and then copy the CSS ID to the line of the table of content, link it with # and CSS ID? Hope this is understandable. Thanks a lot in advance!

  • @hollybruns5653
    @hollybruns5653 4 года назад

    Thanks! This was exactly what I needed. I'll be checking out your other videos.

  • @cyberargos
    @cyberargos 3 года назад

    Thank you so much for your tutorials!

  • @tomaszaw
    @tomaszaw 4 года назад

    Great video. How did you get a logo with a circle outline for the barber site? In the nav bar?

  • @marekhrycak5947
    @marekhrycak5947 4 года назад

    Great tutorial. You explained it in a simple and understandable way. Thank you.

  • @ricardomichela9560
    @ricardomichela9560 4 года назад

    Right to the point! Very clear. Thanks Josh!

  • @ArjanDral
    @ArjanDral 3 года назад

    Thanks Josh, question if I still may. I tried to do a menu to section class but the CSS field is missing at the appearance/menu. Any idea?

  • @WondervilleSeries
    @WondervilleSeries 7 лет назад

    Hello, I am a divi student-just ran across your video. Liked your presentation style and sub'd. Good luck with your channel.:)

    • @JoshHallco
      @JoshHallco  7 лет назад

      Thanks, SJ! Much appreciated. Looking forward to hearing how your Divi journey progresses!

  • @StaceyBroder
    @StaceyBroder 3 года назад

    What a great video! Answered every question I had about this. You made this easy - thanks!

  • @davidpayne2749
    @davidpayne2749 5 лет назад +1

    Curious now when I go into my menu to put a anchor in the URL I don't see a URL and the CSS classes (optional) box like in your demo which lead me to believe in the last two year obviously changes have been made to the menu?

    • @JoshHallco
      @JoshHallco  5 лет назад +1

      You just need to go into the Screen Options and make sure that setting is enabled!

    • @Skyhighcrypto
      @Skyhighcrypto 5 лет назад

      @@JoshHallco I check all the boxes in screen option still I cant see URL box , I put my link in Title Attribute , CSS Classes (optional)
      , Link Relationship (XFN)but nothing works . there is no URL section available :(

  • @Pappiiii
    @Pappiiii 4 года назад

    how do you do that with a them you take??? i mean a theme that is already premade....
    because when i open menus, there is absolutely nothing? How do i create those menus??

  • @crystalmeserole4796
    @crystalmeserole4796 4 года назад

    Thank yo umuch for explaining this! Very helpful, clear and concise!

  • @artishawalker719
    @artishawalker719 4 года назад

    thank you so very much for this clear and concise video!!

  • @adrianamclane4458
    @adrianamclane4458 6 лет назад +1

    Thank you for this. Used it today and it worked perfectly.

  • @happyfishdesign
    @happyfishdesign 3 года назад

    How can we link to an anchor link in another tab - in a Divi tabbed module? So a link from say tab 1 that jumps to tab 3? :) Thanks!

  • @upsoccertraining9388
    @upsoccertraining9388 4 года назад

    Great video. Very easy to follow. Thank you

  • @webexpressions3307
    @webexpressions3307 6 лет назад

    Hi Josh
    Maybe you can help me out here.
    All the ways that you are explaining in your video are pretty straightforward and understandable.
    There is one that is getting the better of me. Let me explain.
    I have got a home page with anchor links to my services page rows of which I created ids for. These rows are for desktop and tablet. On my services page, I created the same rows for mobile only with the same ids.
    Now the problem I am having is that desktop anchor links are working but soon as you change to mobile the anchor links from the home page does not lead to the row ids stipulated.
    Please could you help if you have any other idea how to make this work.
    Thanks Shane

    • @JoshHallco
      @JoshHallco  6 лет назад

      mmm as long as those sections are active on mobile you should be good!

  • @dostparty6636
    @dostparty6636 4 года назад

    Great. You made my life so easy. Very nicely explained.

  • @soheilsharifi4133
    @soheilsharifi4133 3 года назад

    thank you. learned the whole thing so fast

  • @thehustlerscorner59
    @thehustlerscorner59 5 лет назад

    Can you add this strategy to anchor text on other sites for backlinking strategies?

  • @chibuikem_
    @chibuikem_ 6 лет назад +1

    Hey,thank you for the video. Just a quick question, what plugin did you use for the staff members? It had an email me option and a meet person which took you to the section with more information about them. It looks great and I want to implement it

    • @JoshHallco
      @JoshHallco  6 лет назад

      It's actually a Divi layout I created and use on a lot of my sites. It's available here! joshhall.co/product/jump-to-bio-team-page/

  • @adrianaagresta
    @adrianaagresta 6 лет назад +1

    Hi Josh! Thanks for this awesome tutorial. I have a problem, however. The website I'm working on has three pages on three different links. There's a 4th link that is not a page itself, it's an anchor link. If I'm on the Home section the anchor works fine just as you showed. But if I'm on any other page, the link doesn't work. I think it's because it tries to find the #anchorlink on the same page I'm visualizing, but since it is in another one, it doesn't work. Do you know a workaround? Thanks in advance!

    • @JoshHallco
      @JoshHallco  6 лет назад

      Hey Adriana, yeah in that case, you'll probably want to add the full URL in the link to the anchor. That way the link knows exactly where to go. Hope that helps!

    • @adrianaagresta
      @adrianaagresta 6 лет назад

      Hey Josh, yes I eventually figured that out, the only problem is that it takes much longer to load the link. Guess that'll be that then. Thank you very much!!

  • @godsgotyagirl5704
    @godsgotyagirl5704 5 лет назад

    Great video-Thank you. Very easy to follow.

  • @jamesschoaf
    @jamesschoaf 4 года назад

    Anchor links to sections in other pages dont seem to work in DIVI? is there a fix for this?

  • @JohnJackson31
    @JohnJackson31 4 года назад

    On the turner's site, how did you add that hero section above the menu and made it fade in on scroll? I really have been trying to figure out how to do that.

    • @JoshHallco
      @JoshHallco  4 года назад +1

      Hey in Divi, you can just select the "hide menu until scroll" option! Easy peasy with Divi!

  • @jddking2562
    @jddking2562 4 года назад

    how do you get the scroll effect? on my page its just jumping from Anker to Anker :/ ps. really helpfull vid!

  • @rgbcom
    @rgbcom 6 лет назад

    As always, very clearly explained. If one wanted to create a link from an item in the main menu to a certain tab of a tab module, would it be conceptually be the same?

    • @JoshHallco
      @JoshHallco  6 лет назад

      Thanks, Rodrigo. Yep it should work the same way!

  • @Discression
    @Discression 3 года назад

    QUESTION :
    what if my site is : www.homepage.com and I put an anchor link on my menu like : www.homepage.com/#review to lead me on the review section of my homepage,
    If I am on an "about page" so www.homepage.com/about and I click on the menu link "review", It will not lead me to the review section of my homepage. WHY ? or How to deal with this situation ?

  • @merlin9244
    @merlin9244 6 лет назад +1

    Thanks for your help! Worked out very easily.

  • @waltertrejo9512
    @waltertrejo9512 6 лет назад

    Hello,
    I tried to follow your video but didn't have much luck. if you go to into 3:25 in your video and it shows the URL section, I didn't appear in my menu structure. Is this because my wordpress is a newer version than yours maybe?
    Thanks in advance :)

    • @ewadasilveira8510
      @ewadasilveira8510 6 лет назад

      Hi, Not sure if you still need it, but you need to add Custom Link. You will find it two lines below the 'add new page' in the same menu. Then, follow the advice from the tutorial , ie add # whatever your link is. The other input field is a name of your link in the primary menu.

  • @goodworn
    @goodworn 5 лет назад +1

    When you click on the links, it sort of slides to the destination, which looks kind of nice. Mine jumps to that section suddenly. Any reason?

    • @Dave_Zimmerman
      @Dave_Zimmerman 4 года назад

      I have this same problem. Did you figure it out?

    • @Dave_Zimmerman
      @Dave_Zimmerman 4 года назад

      Actually, I just figured if out. If the Anchor link has spaces (not dashes as indicated in this videos) then it won't scroll smoothly.

  • @rosssessoms5287
    @rosssessoms5287 4 года назад

    With a sticky header, when it scrolls, the heading the page scrolls to is hidden just under the sticky header. any way to fix?

    • @schullieringer
      @schullieringer 4 года назад

      I would like to find a fix to this as well

  • @vicktorgregorybrilhantecos2500
    @vicktorgregorybrilhantecos2500 4 года назад

    pretty good, thanks.
    Say hello to Brazil.

  • @R3DB3EARD
    @R3DB3EARD 4 года назад

    Thank you so much! Kept it nice and simple.

  • @MrTempest2009
    @MrTempest2009 6 лет назад +2

    Brilliant, been searching for exactly this, thanks dude

    • @JoshHallco
      @JoshHallco  6 лет назад

      Awesome to hear, Michael. No problem!

  • @o.ferdinand2666
    @o.ferdinand2666 5 лет назад

    Does someone know when standing on another page and hitting an anchor links menu item. The anchor link won't work, and won't go back to its page and section?

  • @CrearyCoser
    @CrearyCoser 4 года назад

    Thank you! It was really helpful!

  • @theshelleydennisshow
    @theshelleydennisshow 4 года назад +1

    Sweet Jesus, thank you, this worked like a charm!

  • @JidduSays
    @JidduSays 3 года назад +1

    Your video helped. Thanks.

  • @IsraelAndersonOfficial
    @IsraelAndersonOfficial 5 лет назад +1

    Thank you very much, Josh.

  • @jaagadeesh
    @jaagadeesh 7 лет назад

    Thank you bro. Really helps to do better with Anchor links.

  • @ciscobalbontin1932
    @ciscobalbontin1932 5 лет назад

    Not working if you try to link from a blurb to content on the same page, theres no option to choose a specific content only page.

  • @genmcc
    @genmcc 6 лет назад +1

    VERY HELPFUL!!!! Thank you so much!

  • @uhmazingfinds1328
    @uhmazingfinds1328 5 лет назад +2

    Whoot! Beautiful, thank you! Achieved exactly what I needed! :D

  • @tomg3833
    @tomg3833 4 года назад

    That was great. Thank you for making the video.

  • @ingridhoffmann8036
    @ingridhoffmann8036 4 года назад

    Thanks Josh, thats what I was looking for.

  • @skeptimedia1093
    @skeptimedia1093 5 лет назад +1

    thanx Josh... as u call it easy peasy :)

  • @LuciaExpressions
    @LuciaExpressions 4 года назад

    But how can I link from the main menu on the top navigation bar of, ie. a blog post, to a specific section on the homepage?

    • @JoshHallco
      @JoshHallco  4 года назад

      You could add the full URL like website.com/#section. If you just do /#section, it'll link to whatever page it's on.

    • @LuciaExpressions
      @LuciaExpressions 4 года назад

      @@JoshHallco Oh my God, it worked! I did try that, but I had put the # before the website url instead of before the section name at the end, so it didn't work! Thanks so much for replying

  • @christianorsos
    @christianorsos 4 года назад

    Now how does this work when you're in a different page and the anchor is only in a Homepage?

    • @JoshHallco
      @JoshHallco  4 года назад +1

      Just do the full URL. Like joshhall.co/#section

  • @GeneciaAlluora1
    @GeneciaAlluora1 6 лет назад +1

    Thanks for the video! The ultimate solution.

  • @anatorri6812
    @anatorri6812 6 лет назад

    Easy to follow. Good video.

  • @samysapp9751
    @samysapp9751 3 года назад

    Thank you very much!! Very very good video!!!!