{"id":12141,"date":"2019-07-09T11:31:22","date_gmt":"2019-07-09T11:31:22","guid":{"rendered":"https:\/\/ampforwp.com\/tutorials\/?post_type=ht_kb&#038;p=12141"},"modified":"2019-07-09T11:39:39","modified_gmt":"2019-07-09T11:39:39","slug":"how-to-add-smooth-scrolling-on-jump-links-in-amp","status":"publish","type":"ht_kb","link":"https:\/\/ampforwp.com\/tutorials\/article\/how-to-add-smooth-scrolling-on-jump-links-in-amp\/","title":{"rendered":"How to add smooth scrolling on jump links in AMP"},"content":{"rendered":"\n<p>Smooth scrolling allows you to jump between areas of your page easily without having manually scroll up and down looking for specific sections. Smooth scrolling works very well when you have an anchor link that you want to be able to jump to quickly from any part of your page.  <\/p>\n\n\n\n<p><strong>Follow this simple steps:<\/strong><\/p>\n\n\n\n<p>You will find this option in <strong>WordPress Dashboard<\/strong> -> Navigate to &#8220;<strong>AMP option panel<\/strong>&#8221; -> <strong>Settings <\/strong>-> <strong>Advance Settings<\/strong> -> Enable &#8220;<strong>Smooth Scrolling For Links<\/strong>&#8221; option and click on the &#8220;<strong>Save Changes<\/strong>&#8221; button.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"490\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/smoothscrolling-1-1024x490.png\" alt=\"\" class=\"wp-image-12143\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/smoothscrolling-1-1024x490.png 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/smoothscrolling-1-300x144.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/smoothscrolling-1-768x368.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/smoothscrolling-1-50x24.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/smoothscrolling-1-60x29.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/smoothscrolling-1-100x48.png 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/smoothscrolling-1.png 1307w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong>Smooth Scrolling For Links:<\/strong> Enable this option if you want smooth scrolling for jumping links. <\/p>\n\n\n\n<h4>The Output of the Smooth Scrolling For Links in AMP<\/h4>\n\n\n\n<figure class=\"wp-block-video\"><video controls src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/07\/Smoothscrolling-Screencast-2019-07-09.mp4\"><\/video><\/figure>\n\n\n\n<p><strong>That\u2019s it for this tutorial!<\/strong><\/p>\n\n\n\n<p>We hope it helped you. If you have any feedback or questions, then please share them in the comments section below.<\/p>\n<div id=\"div-1\" class=\"hkb-feedback\">\n\t\t\t<strong class=\"ht-mobile-exit__title\">Ask your Questions Directly!<\/strong><br>\n\t\t\t<div class=\"hkb_widget_exit__content\" style=\"font-size: 14px;\">If you can't find the solutions in this article, then just ask us in the comments and we will answer it for you!<\/div>\n\t\t\t<a href=\"https:\/\/ampforwp.com\/support\/#contact\" id=\"button\" target=\"_blank\" rel=\"noopener noreferrer\"><button>Yes, I have a Question<\/button><\/a>\n\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Smooth scrolling allows you to jump between areas of your page easily without having manually scroll up and down looking for specific sections. Smooth scrolling works very well when you have an anchor link that you want to be able to jump to quickly from any part of your page&#8230;.<\/p>\n","protected":false},"author":18,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":[],"ht-kb-category":[34],"ht-kb-tag":[],"_links":{"self":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/12141"}],"collection":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/comments?post=12141"}],"version-history":[{"count":9,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/12141\/revisions"}],"predecessor-version":[{"id":12152,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/12141\/revisions\/12152"}],"wp:attachment":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/media?parent=12141"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb-category?post=12141"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb-tag?post=12141"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}