{"id":1588,"date":"2020-10-13T12:29:08","date_gmt":"2020-10-13T12:29:08","guid":{"rendered":"https:\/\/utiawpguide.tennessee.edu\/?p=1588"},"modified":"2020-10-13T12:29:08","modified_gmt":"2020-10-13T12:29:08","slug":"linking-to-sections-of-a-page","status":"publish","type":"post","link":"https:\/\/utia-dev.tennessee.edu\/wpguide\/2020\/10\/13\/linking-to-sections-of-a-page\/","title":{"rendered":"Linking to Sections of a Page"},"content":{"rendered":"\n<p>Anchor tags, also known as &#8220;jump tags&#8221;, points to a particular section on a web page and are used to jump to a particular section on a web page.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Creating An HTML Anchor<\/h2>\n\n\n\n<ol class=\"wp-block-list\" type=\"1\"><li>The first step to creating an <strong>HTML Anchor<\/strong> in WordPress is that you have to declare a point on the page to jump to. In WordPress it must be a <strong>heading<\/strong> somewhere on a page. So the heading has to be created first and you also have to create an anchor link.<\/li><\/ol>\n\n\n\n<ul class=\"wp-block-list\"><li>The <strong>HTML anchor<\/strong> has to have some kind of text to declare as the <strong>anchor link<\/strong> (in this example we used: page-jump as denoted under the advanced section in the red square in the picture below) but the text can be any text of your choosing.<\/li><li>Note: the <strong>HTML anchor<\/strong> can only be applied to headings [h1] \u2013 [h5], it cannot be applied to regular text in WordPress without editing HTML manually.<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-content\/uploads\/sites\/212\/2020\/10\/jump-to-anchor-2-1024x615.jpg\" alt=\"Jump to HTML anchor\" class=\"wp-image-1591\" width=\"768\" height=\"461\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Setting Up An Anchor Link<\/h2>\n\n\n\n<p>Now an <strong>anchor link<\/strong> needs to be set up. The link will be created just like any other link. Except instead of a URL being entered, you enter the <strong>anchor link<\/strong> that you created in step # 1 page with a pound\/hash sign (#) in front of it (example: <em><a href=\"#page-jump\">#page-jump<\/a><\/em>)<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-content\/uploads\/sites\/212\/2020\/10\/page-jump-2.jpg\" alt=\"basic jump to page link example\" class=\"wp-image-1593\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Linking From Another Page<\/h2>\n\n\n\n<p>To link to the<strong> Anchor Link<\/strong> from another page you need to only add a link to the page as usual and then end the URL with a forward slash and the <strong>Anchor Link<\/strong> you created in step 1 (example: <a href=\"https:\/\/utiawpguide.tennessee.edu\/linking-to-sections-of-a-page\/#page-jump\"><em>https:\/\/utiawpguide.tennessee.edu\/linking-to-sections-of-a-page\/#page-jump<\/em><\/a>)<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Adding An Anchor Link For A Menu<\/h2>\n\n\n\n<p>When adding an <strong>Anchor Link<\/strong> FOR a menu the process is identical to step #3 except you add the URL from the dashboard &gt; Appearance &gt; Menus. And create a \u201cCustom Link\u201d with the <strong>Anchor Link<\/strong> included just as you would with a regular URL link with a pound sign in front of the URL. (example: <em><a href=\"https:\/\/utiawpguide.tennessee.edu\/linking-to-sections-of-a-page\/\">https:\/\/utiawpguide.tennessee.edu\/linking-to-sections-of-a-page\/#page-jump<\/a><\/em>)<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"468\" height=\"375\" src=\"https:\/\/utiawpguide.tennessee.edu\/wp-content\/uploads\/sites\/18\/2020\/10\/Menu-Link.jpg\" alt=\"Jump to link menu example\" class=\"wp-image-1592\" srcset=\"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-content\/uploads\/sites\/212\/2020\/10\/Menu-Link.jpg 468w, https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-content\/uploads\/sites\/212\/2020\/10\/Menu-Link-300x240.jpg 300w\" sizes=\"auto, (max-width: 468px) 100vw, 468px\" \/><\/figure>\n\n\n<style>.wp-block-kadence-spacer.kt-block-spacer-_af9e88-07 .kt-block-spacer{height:80px;}.wp-block-kadence-spacer.kt-block-spacer-_af9e88-07 .kt-divider{border-top-width:1px;height:1px;border-top-color:#eee;width:80%;border-top-style:solid;}<\/style>\n<div class=\"wp-block-kadence-spacer aligncenter kt-block-spacer-_af9e88-07\"><div class=\"kt-block-spacer kt-block-spacer-halign-center\"><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"page-jump\">Test Text to jump to<\/h3>\n","protected":false},"excerpt":{"rendered":"<p>Anchor tags, also known as &#8220;jump tags&#8221;, points to a particular section on a web page and are used to jump to a particular section on a web page. Creating\u2026<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_searchwp_excluded":"","footnotes":""},"categories":[6],"tags":[],"class_list":["post-1588","post","type-post","status-publish","format-standard","hentry","category-manage-your-site"],"acf":[],"publishpress_future_action":{"enabled":false,"date":"2026-04-29 23:00:19","action":"change-status","newStatus":"draft","terms":[],"taxonomy":"category","extraData":[]},"publishpress_future_workflow_manual_trigger":{"enabledWorkflows":[]},"_links":{"self":[{"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/posts\/1588","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/comments?post=1588"}],"version-history":[{"count":0,"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/posts\/1588\/revisions"}],"wp:attachment":[{"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/media?parent=1588"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/categories?post=1588"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/tags?post=1588"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}