{"id":16278661,"date":"2022-12-11T12:15:34","date_gmt":"2022-12-11T12:15:34","guid":{"rendered":"https:\/\/wordpress.org\/support\/?post_type=helphub_article&#038;p=16278661"},"modified":"2026-05-25T23:18:49","modified_gmt":"2026-05-25T23:18:49","slug":"custom-link-block","status":"publish","type":"helphub_article","link":"https:\/\/wordpress.org\/documentation\/article\/custom-link-block\/","title":{"rendered":"Custom Link block"},"content":{"rendered":"\n<p class=\"has-text-align-right has-small-font-size wp-block-paragraph\"><a href=\"https:\/\/wordpress.org\/documentation\/article\/blocks\/\">Go back to the list of <strong>Blocks<\/strong><\/a><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The Custom Link block allows you to embed a link, page, category, or another item in your Navigation section.&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"954\" height=\"1026\" src=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image4-3.png\" alt=\"WordPress editor block: Add link window with typed URL, toolbar, and options for updating the link.\" class=\"wp-image-16278666\" style=\"width:477px;height:513px\" srcset=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image4-3.png 954w, https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image4-3-279x300.png 279w, https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image4-3-952x1024.png 952w, https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image4-3-768x826.png 768w\" sizes=\"auto, (max-width: 954px) 100vw, 954px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">To add a Custom Link block, you must first add the Navigation block by clicking the <strong>Block inserter<\/strong> (+) icon or typing <code>\/navigation<\/code> in the editor.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"654\" height=\"330\" src=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image8-3.png\" alt=\"The plus icon in the toolbar and the Navigation block selection option to add a Custom link block\" class=\"wp-image-16278670\" style=\"width:327px;height:165px\" srcset=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image8-3.png 654w, https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image8-3-300x151.png 300w\" sizes=\"auto, (max-width: 654px) 100vw, 654px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">The Add link field will appear after adding a Navigation block. Type your URL or select from recent pages you used or created on WordPress. Hit enter to save the link.&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"1074\" height=\"860\" src=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/adding-custom-link.gif\" alt=\"URL pasted to the Custom Link block with option to select other items and the toolbar above.\" class=\"wp-image-16278675\" style=\"width:537px;height:430px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">You can insert multiple Custom Link blocks in one<strong> Navigation <\/strong>section. Hit enter after editing one link, and a new Add link field will appear. Every Custom Link block can have a separate link and text settings.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1478\" height=\"710\" src=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/customizing-custom-link.gif\" alt=\"One Custom Link block selected, Bold and Italics text formatting applied to it, and Options section expanded to click Duplicate.\" class=\"wp-image-16278708\" \/><\/figure>\n\n\n\n<p class=\"has-background wp-block-paragraph\" style=\"background-color:#e5f5fa\">Detailed instructions on adding blocks can be found <a href=\"https:\/\/wordpress.org\/documentation\/article\/adding-a-new-block\/\">here<\/a>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Block toolbar<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Each block has its own toolbar, which contains unique controls that let you customize or configure the block. The <em>Custom Link<\/em> block has the following options on its toolbar:<\/p>\n\n\n\n<h3 class=\"wp-block-heading has-medium-font-size\">Transform to<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">You can transform your Custom Link block to:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Submenu, turning your link into a wrapped links list<\/li>\n\n\n\n<li><a href=\"https:\/\/wordpress.org\/documentation\/article\/spacer-block\/\">Spacer<\/a> for dividing multiple links with an empty block<\/li>\n\n\n\n<li><a href=\"https:\/\/wordpress.org\/documentation\/article\/search-block\/\">Search<\/a>, creating a search bar&nbsp;<\/li>\n\n\n\n<li>Home link, linking to homepage of your website<\/li>\n\n\n\n<li><a href=\"https:\/\/wordpress.org\/documentation\/article\/site-logo-block\/\">Site logo<\/a> for adding your site logo<\/li>\n\n\n\n<li><a href=\"https:\/\/wordpress.org\/documentation\/article\/social-icons\/\">Social icons<\/a> for embedding buttons that lead to a selected social media platform<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"716\" height=\"548\" src=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image13-2.png\" alt=\"Custom Link block editor toolbar with the selected \u2018Transform to\u2019 icon and unwrapped options for updates.\" class=\"wp-image-16278684\" style=\"width:537px;height:411px\" srcset=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image13-2.png 716w, https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image13-2-300x230.png 300w\" sizes=\"auto, (max-width: 716px) 100vw, 716px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading has-medium-font-size\">Block moving tools<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">You can reorder Custom Link blocks inside a <strong>Navigation<\/strong> section. Use the toolbar to move the items left and right or drag them to a new position.&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img decoding=\"async\" src=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image7-1.png\" alt=\"Two toolbars with the Move option and example of a Custom Link block and with the Drag tool featured with three blocks.\" class=\"wp-image-16278688\" style=\"width:629px;height:267px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">For more information, explore the <a href=\"https:\/\/wordpress.org\/documentation\/article\/navigation-block\/\">Navigation block<\/a>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading has-medium-font-size\">Link tool<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The <strong>Link<\/strong> tool lets you edit your custom link block. You can edit title and custom URL and decide whether you want to open the link in a new tab.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"1112\" height=\"916\" src=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/editing-custom-link.gof_.gif\" alt=\"The toolbar with a Custom Link block editing process containing typing a title, selecting to open in a new tab, and demonstrating the unlink option.\" class=\"wp-image-16278710\" style=\"width:556px;height:458px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading has-medium-font-size\">Adding submenu to a Custom Link block<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The next icon lets you build a submenu, where you can add links to a drop-down list.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"666\" height=\"794\" src=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image11-1.png\" alt=\"WordPress editor Submenu section in the Navigation block applied to the selected Custom Link with the options to type URL or select an item.\" class=\"wp-image-16278717\" style=\"width:333px;height:397px\" srcset=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image11-1.png 666w, https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image11-1-252x300.png 252w\" sizes=\"auto, (max-width: 666px) 100vw, 666px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading has-medium-font-size\">Text formatting<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Basic <strong>Text formatting<\/strong> is available for all Custom Link blocks. Select your title (or a part of it) to make it Bold, Italic, or Strikethrough, or turn it into an Inline image to cover your link with an illustration.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"822\" height=\"290\" src=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image9-1.png\" alt=\"WordPress Custom Link block toolbar with selected text formation and additional options unwrapped, followed by the edited block example.\" class=\"wp-image-16278692\" style=\"width:617px;height:218px\" srcset=\"https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image9-1.png 822w, https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image9-1-300x106.png 300w, https:\/\/wordpress.org\/documentation\/files\/2022\/12\/image9-1-768x271.png 768w\" sizes=\"auto, (max-width: 822px) 100vw, 822px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading has-medium-font-size\">More options<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The <strong>Options <\/strong>section opens block settings and a button to move to the parent Navigation field section to update it. You can also copy, duplicate, lock, or remove your Custom Link. Like everywhere in the WordPress editor, you can undo actions using the <strong>Ctrl+Z<\/strong> (or <strong>Command+Z<\/strong> on macOS).<\/p>\n\n\n\n<p class=\"has-background wp-block-paragraph\" style=\"background-color:#e5f5fa\">Details about <strong>More options<\/strong> can be found in this <a href=\"https:\/\/wordpress.org\/documentation\/article\/more-options\/\">support article<\/a>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Block settings<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Each link has its <strong>Block settings<\/strong> you can access by clicking the <strong>settings <\/strong>button on the upper-right corner of the editor or via <strong>Options <\/strong>in the toolbar.<\/p>\n\n\n\n<h3 class=\"wp-block-heading has-medium-font-size\">Link settings<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Link settings<\/strong> section contains the following options:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Description<\/strong> to display with your link if the selected theme includes that option.<\/li>\n\n\n\n<li><strong>Link title <\/strong>to provide more information about the link for search engine optimization. Leave this field empty if you want the title used in URL settings to stay.&nbsp;<\/li>\n\n\n\n<li><strong>Link rel<\/strong> to specify how your external link is related to the page you\u2019re working on and if its authority should be higher than your website\u2019s.&nbsp;<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Refer to the <a href=\"https:\/\/wordpress.com\/support\/full-site-editing\/theme-blocks\/navigation-block\/#link-settings\">Navigation block documentation<\/a> for more information.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Typography<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The Custom Link block provides typography settings to change the font family, appearance, line height, letter spacing, decoration, letter case, and font size.<\/p>\n\n\n\n<p class=\"has-background wp-block-paragraph\" style=\"background-color:#e5f5fa\">For details refer to this support article: <a href=\"https:\/\/wordpress.org\/documentation\/article\/typography-settings-overview\/\">Typography settings overview<\/a><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Advanced<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The Custom Link block provides the following Advanced settings options: HTML anchor, Additional CSS Class(es), Additional CSS, and Styles.<\/p>\n\n\n\n<p class=\"has-background wp-block-paragraph\" style=\"background-color:#e5f5fa\"><a href=\"https:\/\/wordpress.org\/documentation\/article\/advanced-settings-overview\/\">Learn more about advanced settings<\/a><\/p>\n\n\n\n<div id=\"changelog\" class=\"wp-block-group changelog has-background is-layout-flow wp-block-group-is-layout-flow\" style=\"background-color:#dce5ec\">\n<h2 class=\"wp-block-heading has-medium-font-size\">Changelog<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Updated 2026-05-25 (props @kjoyner @awetz583)\n<ul class=\"wp-block-list\">\n<li>Updated &#8220;Advanced&#8221; section to refer to new overview page<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>2023-07-25\n<ul class=\"wp-block-list\">\n<li>Fix broken image URLs<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Created 2022-12-11<\/li>\n<\/ul>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Go back to the list of Blocks The Custom Link block allows you to embed a link, page, category, or another item in your Navigation section.&nbsp; To add a Custom Link block, you must first add the Navigation block by clicking the Block inserter (+) icon or typing \/navigation in the editor. The Add link [&hellip;]<\/p>\n","protected":false},"author":20343101,"featured_media":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"advanced_seo_description":"","jetpack_seo_html_title":"","jetpack_seo_noindex":false},"category":[80,91],"class_list":["post-16278661","helphub_article","type-helphub_article","status-publish","hentry","category-customization","category-theme-blocks"],"revision_note":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/articles\/16278661","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/articles"}],"about":[{"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/types\/helphub_article"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/users\/20343101"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/comments?post=16278661"}],"version-history":[{"count":15,"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/articles\/16278661\/revisions"}],"predecessor-version":[{"id":16368609,"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/articles\/16278661\/revisions\/16368609"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/media?parent=16278661"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/category?post=16278661"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}